A modern, AI-powered mock interview platform built with React, TypeScript, and Google's Generative AI. This application helps users prepare for job interviews by generating custom interview questions and providing real-time feedback on their responses.
https://github.com/ryash14/LearnityX
- AI-Generated Interview Questions - Leverages Google's Generative AI to create tailored interview questions based on job role, experience level, and tech stack
- Real-Time Interview Simulation - Conduct mock interviews with webcam recording and speech-to-text capabilities
- Intelligent Feedback System - Receive detailed AI-powered feedback on your interview responses
- Personalized Dashboard - Track your interview history and progress over time
- Secure user authentication powered by Clerk
- Protected routes for authenticated users only
- Session management and user profile handling
- Modern, responsive UI built with Radix UI components
- Dark/Light theme support with next-themes
- Smooth animations with Tailwind CSS
- Intuitive navigation and breadcrumb system
- Webcam Integration - Record yourself during mock interviews
- Speech-to-Text - Convert your spoken answers to text automatically
- Custom Interview Creation - Create and edit interview sessions with specific parameters
- Question Management - Navigate through multiple interview questions seamlessly
- Performance Tracking - Review feedback and improve your interview skills
- React 18 - Modern React with hooks and concurrent features
- TypeScript - Type-safe development
- Vite - Fast build tool and development server
- React Router v7 - Client-side routing
- Tailwind CSS - Utility-first CSS framework
- Radix UI - Accessible, unstyled component primitives
- Lucide React - Beautiful icon library
- Sonner - Toast notifications
- React Fast Marquee - Smooth scrolling animations
- Firebase - Backend services and data storage
- Google Generative AI - AI-powered question generation and feedback
- Clerk - Authentication and user management
- React Hook Form - Performant form handling
- Zod - TypeScript-first schema validation
- React Webcam - Camera integration
- React Hook Speech to Text - Voice recognition
- Node.js 18+
- npm
- Firebase account
- Clerk account
- Google AI API key
- Clone the repository
git clone https://github.com/ryash14/LearnityX.git
cd LearnityX- Install dependencies
npm install- Set up environment variables
Create a .env.local file in the root directory:
# Clerk Authentication
VITE_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
# Firebase Configuration
VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
VITE_FIREBASE_PROJECT_ID=your_firebase_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_firebase_storage_bucket
VITE_FIREBASE_MESSAGING_SENDER_ID=your_firebase_messaging_sender_id
VITE_FIREBASE_APP_ID=your_firebase_app_id
# Google AI
VITE_GOOGLE_API_KEY=your_google_ai_api_key- Start the development server
npm run dev- Open your browser and navigate to
http://localhost:5173
├── src/
│ ├── assets/ # Static assets
│ ├── components/ # Reusable UI components
│ │ └── ui/ # Radix UI component wrappers
│ ├── config/ # Configuration files
│ ├── handlers/ # Business logic handlers
│ ├── layouts/ # Layout components
│ ├── lib/ # Utility functions
│ ├── provider/ # Context providers
│ ├── routes/ # Page components
│ ├── scripts/ # Utility scripts
│ ├── types/ # TypeScript type definitions
│ ├── App.tsx # Main application component
│ └── main.tsx # Application entry point
├── public/ # Public static files
├── .env.local # Environment variables
├── vite.config.ts # Vite configuration
├── tailwind.config.js # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
npm run dev- Start development servernpm run build- Build for productionnpm run preview- Preview production buildnpm run lint- Run ESLint
This project is configured for Firebase Hosting deployment.
- Install Firebase CLI
npm install -g firebase-tools- Login to Firebase
firebase login- Build the project
npm run build- Deploy to Firebase
firebase deploy/- Landing page/signin- User sign in/signup- User registration/generate- Dashboard (protected)/generate/:interviewId- Create/Edit interview (protected)/generate/interview/:interviewId- Interview preparation (protected)/generate/interview/:interviewId/start- Start mock interview (protected)/generate/feedback/:interviewId- View feedback (protected)
Contributions are welcome! Please follow these steps:
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License.
- Google Generative AI for powering the interview question generation
- Clerk for seamless authentication
- Firebase for backend infrastructure
- Radix UI for accessible component primitives
- The open-source community for amazing tools and libraries