Online Quiz App Development using MERN Stack
Prabhat Kumar
Online-Quiz-App-Website (MERN)
Features:
Working with complex MongoDB, queries, schemas, models.
Separate User Interfaces for Users, Admins.
JWT Authentication and Password Hashing.
Admin can add exams with questions , options and answers.
Real time updates for all the crud operations in Questions and Exams Module.
Timer functionality for Exam Sessions.
Live Result Functionality after writting the exams.
Storing the results into Mongo DB.
Separate Reports / Analatics functionality for both Admin and User.
A leaderboard too for admin only
A light/dark theme switch
Questions with multiple correct Answers too
Tech Stack Used:
Front-End:
Back-End:
Database:
Project Structure
quiz-app/ ├── frontend/ # React app ├── backend/ # Node.js backend ├── package.json # Monorepo root package.json (for workspaces) └── README.md # This file
Installation
Step 1: Clone the repository
Step 2: Install dependencies
This project uses npm workspaces. To install dependencies for both frontend and backend, run:
This will install all dependencies for both the frontend and backend workspaces.
Step 3: Set up environment variables
Create a .env file in the backend/ directory and add the following environment variables:
In the frontend/ directory, create a .env file with the following:
Step 4: Run the application
Use the following command to start both the frontend and backend together:
This will:
Start the frontend React app at http://localhost:3000 Start the backend Node.js server at http://localhost:5000
Step 5: Access the app
Go to http://localhost:3000 to access the homepage. Admin users can access the admin panel from /admin. Regular users can log in and take quizzes.
Like this project
Posted May 5, 2025
Developed a MERN stack online quiz app with admin and user interfaces.
Likes
0
Views
0
Timeline
Sep 11, 2024 - Sep 26, 2024
