The frontend is a React + Vite single-page application that provides the complete interview-practice experience: onboarding, preparation, interview execution, feedback, and analytics.
- React + React Router
- Zustand for client-side auth/profile state
- Tailwind CSS + custom theme variables
- Axios-based service layer for API integration
Core routes defined in client/src/App.jsx:
/Home/login,/register/dashboard/preparation/interview(Interview Center)/interview/:sessionId(Live Interview)/session/:sessionId/summary/session/:sessionId/qa-summary/analytics/profile/suggestions
Central hub for progress, recent activity, and navigation shortcuts.
Pre-interview preparation content and readiness support.
Session setup and interview mode selection before starting.
Question-by-question answering experience with voice/text flow.
Rubric-based answer scoring with detailed feedback.
Performance trends, insights, and progress tracking.
- User logs in and lands on Dashboard.
- User opens Preparation to review recommended material.
- User starts a session from Interview Center.
- Live Interview page drives question-answer flow.
- Session summary and QA feedback views show evaluation details.
- Analytics page tracks long-term improvement.
Frontend services call backend APIs in these domains:
- Session lifecycle: create/start/answer/next/complete
- Analytics: progress and insights
- Profile and preferences
- Authentication and consent
cd client
npm install
npm run dev