できる日本語 — 1:1 일본어 회화 플랫폼
AI 튜터와 원어민 강사를 연결하는 1:1 일본어 회화 튜터링 플랫폼
Next.js, TypeScript, Prisma, TailwindCSS, Recharts
프로젝트 소개
AI 튜터와 원어민 강사를 모두 활용하는 1:1 일본어 회화 플랫폼입니다. 학생은 튜터를 탐색하고, 수업을 예약하며, 크레딧을 충전해 결제까지 하나의 플로우로 완결됩니다.
학생 대시보드(마이페이지)와 관리자 패널을 분리 설계하여, 사용자 여정과 운영 관리 두 축을 모두 구현했습니다.
기간
2025.06
유형
개인 프로젝트
페이지
10+ (SSR/CSR)
학생 여정
튜터 탐색부터 예약, 결제까지 자연스러운 사용자 여정을 설계했습니다.
튜터 찾기
AI/원어민 필터로 튜터 탐색
튜터 상세
프로필, 리뷰, 스케줄 확인
수업 예약
날짜 → 시간 → 확인 3단계 예약
크레딧 결제
패키지 선택 + 결제 수단 통합
마이페이지
보유 크레딧, 학습 통계, 다가오는 수업, 수업 이력을 한 화면에서 확인할 수 있는 학생 대시보드입니다.
관리자 화면
매출, 예약, 유저 통계를 실시간으로 모니터링하고 회원을 관리하는 어드민 패널입니다.
대시보드
매출 차트, 오늘의 수업, 최근 활동
회원 관리
상태 필터, 검색, 페이지네이션
반응형 디자인
데스크톱은 물론 모바일에서도 동일한 사용 경험을 제공하도록 설계했습니다.
기술적 포인트
Next.js App Router
서버 컴포넌트와 클라이언트 컴포넌트를 적절히 분리한 하이브리드 렌더링
Prisma ORM
타입 안전한 DB 접근과 시드 데이터를 활용한 풀스택 데이터 플로우
Recharts 대시보드
매출 추이, 통계 카드 등 데이터 시각화 어드민 패널
결제 플로우 UI
크레딧 패키지 선택부터 결제 수단까지 완결된 결제 경험