🌟✨ The goal of this project is to create a web-based platform that offers a seamless and secure experience for students taking MCQ tests. The platform focuses on providing a robust user authentication system, an intuitive test-taking interface, and automated result processing. ✨🌟
Click https://cipherschools-mcq-test-portal-frontend.onrender.com/ to view in your browser. 🌐👀
Login and attempt the test, you can use the following demo credentials:
- Email: rahul@gmail.com
- Password: Rahul@1234
Please note that the result will not be shared. If you want to receive the result, make sure to sign up with your email. We prioritize your security and we do not store your password.🔒📧✨
-
Secure Login: 🔒 Users can log in using their email and password.
-
Protected Routes: 🚧 Ensures that only authenticated users can access the test environment.
-
Interactive Questions: 📝 Users can view each question and its multiple-choice options.
-
Answer Selection: ✅ Allows users to select and modify their answers easily.
-
Navigation: 🚀 Users can freely navigate between questions without restrictions.
-
Integrated Camera Window: 📷 The interface includes a small window displaying the live camera feed during the test.
-
Submission Process: 📤 Users can submit their answers upon completing the test, redirecting them to a "Finish Test" page.
-
Automatic Evaluation: ✔️ The platform automatically evaluates the answers, calculates the score.
-
Email Notification: 📧 The score is sent to the user's email using a predefined template, ensuring prompt and accurate communication of results.
- React: ⚛️ A JavaScript library for building user interfaces.
- Node.js: 🟢 A JavaScript runtime built on Chrome's V8 JavaScript engine.
- Express: 🌐 A minimal and flexible Node.js web application framework.
- MongoDB: 🍃 A NoSQL database for storing user data.
- JWT (JSON Web Token): 🔐 Used for securely transmitting information between parties as a JSON object, ensuring secure user authentication.
- Nodemailer: 📨 A module for Node.js applications to send emails, used for sending test results to users.
-
Clone the repository
git clone https://github.com/Faizankhan298/CipherSchools-MCQ-Test-Portal-frontend.git
-
Navigate to the project directory
cd frontend -
Install dependencies
npm install
-
Start the application
npm run dev
The frontend will start running on http://localhost:5173. 🚀🌐
-
Clone the repository
git clone https://github.com/Faizankhan298/CipherSchools-MCQ-Test-Portal-backend.git
-
Navigate to the project directory
cd backend -
Install dependencies
npm install
-
Start the application
node index.js
-
Connect to MongoDB Ensure MongoDB is installed and running on your system. Update the connection string in the .env file if necessary.
The backend server will start running on http://localhost:5000. 🚀🌐
- MONGO_DB_URL="your_mongodb_connection_string"
- JWT_SECRET="faizan1234"
- SMTP_HOST="smtp.gmail.com"
- SMTP_PORT=587
- SMTP_MAIL="your_email@example.com"
- SMTP_PASS="your_email_password"
-
Signup The signup page where users create a new account by entering Name, Email and Password.
-
Login The login page where users can enter their credentials to access the home page.
-
Home The home page displayed after login, showing information about the test.
-
Quiz The quiz interface where users can answer multiple-choice questions, navigate between them, and view the camera feed.
-
Result The result page displaying a message indicating that the results have been shared to your email.
-
NodeMailer Code The Nodemailer is a Node.js module that enables sending emails from application making it ideal for automating tasks like sending quiz score.
- Thanks to React for the great front-end library.
- Thanks to Node.js and Express.js for the robust back-end framework.
- Inspiration from various open-source projects and documentation.
For any questions or feedback, feel free to reach out Mohammed Faizan.
Contributions to the project are welcome. Please follow the standard fork and pull request workflow. 🤝🌟