QuizAI is an interactive web application that lets users generate personalized quizzes based on any topic they choose. Built with Next.js and integrated with the Google Gemini-Flash 1.5 API, the app allows users to input a topic and create a quiz with a customizable number of questions. Whether you're studying, testing your knowledge, or just having fun, QuizAI makes quiz creation quick and easy. The app is also fully responsive, ensuring a great user experience on both desktop and mobile devices.
- Customizable Quiz Generation: Users can input any topic and generate a quiz with a specific number of questions.
- Real-Time Question Fetching: The app fetches quiz questions in real-time using the Google Gemini-Flash 1.5 API.
- Authentication & User Profiles: Users can sign up and log in using NextAuth.js for secure access and personalized quiz management.
- Responsive UI: Fully responsive design using Tailwind CSS and Shadcn UI for modern, accessible, and user-friendly interfaces.
- Database Integration: Store user data, quiz history, and preferences with MongoDB for persistent storage.
-
Frontend:
- Next.js – A React framework for building static and dynamic websites.
- React – JavaScript library for building user interfaces.
- Tailwind CSS – Utility-first CSS framework for building custom designs.
- Shadcn UI – A modern, accessible component library for React.
-
Backend/API:
- Google Gemini-Flash 1.5 API – API used to fetch quiz questions based on user-input topics.
-
Authentication:
- NextAuth.js – A flexible authentication solution for Next.js, providing user sign-up, login, and session management.
-
Database:
- MongoDB – NoSQL database for storing user data and quiz history.
To run QuizAI locally, follow these steps:
Ensure you have the following installed:
- Node.js (v14 or above)
- npm or yarn (package managers)
- MongoDB – Create a MongoDB account and set up a cloud database, or install MongoDB locally.
-
Clone the repository:
git clone https://github.com/PiyushPb/QuizAi.git -
Navigate into the project directory:
cd quizai -
Install dependencies:
npm installor
yarn install -
Set up environment variables: Create a
.envfile in the root directory and configure the following:GITHUB_CLIENT_ID=<GITHUB_CLIENT_ID> GITHUB_CLIENT_SECRET=<GITHUB_CLIENT_SECRET> NEXTAUTH_URL=<NEXTAUTH_URL> NEXTAUTH_SECRET=<NEXTAUTH_SECRET> MONGODB_URI=<MONGODB_URI> GEMINI_API_KEY=<GEMINI_API_KEY>
- MONGODB_URI: Your MongoDB connection string (you can get this from MongoDB Atlas or a local MongoDB instance).
- NEXTAUTH_SECRET: A secret key used by NextAuth.js for session encryption (you can generate one using any random string generator).
- GEMINI_API_KEY: Your API key for the Google Gemini-Flash 1.5 API.
- Run the app locally:
npm run dev # or yarn dev
-
User Registration/Login: Users can sign up or log in via the authentication system powered by NextAuth.js. After logging in, users can start generating quizzes and track their quiz history.
-
Generate a Quiz: Once logged in, users can:
- Enter a topic for their quiz.
- Select the number of questions they want (e.g., 5, 10, 20 questions).
- Click on "Generate Quiz," and the app will fetch quiz questions using the Google Gemini-Flash API.
-
Taking the Quiz: Users can take the quiz directly in the app, answering questions one by one, with real-time feedback.
We welcome contributions! If you'd like to contribute to QuizAI, please follow these steps:
- Fork this repository.
- Clone your forked repository.
- Create a new branch for your feature or bug fix.
- Make your changes and commit them.
- Push your changes to your fork.
- Open a pull request to the main repository.
- Google Gemini-Flash 1.5 API – For providing AI-powered question generation based on user-input topics.
- Next.js – For enabling fast, scalable, and dynamic web applications.
- NextAuth.js – For easy authentication and session management in Next.js apps.
- Tailwind CSS – For simplifying responsive UI design.
- Shadcn UI – For accessible and modern UI components.