Skip to content

Latest commit

 

History

History
162 lines (118 loc) · 4.8 KB

readme.md

File metadata and controls

162 lines (118 loc) · 4.8 KB
Raw

🔠 AssessNet - Test Environment Platform 🕕

This project is a comprehensive quiz platform with environment testing capabilities. It includes features such as camera and microphone access testing, user authentication, and email score reporting. The platform is built with a robust backend for authentication and a modern frontend for user interaction.

Live Project Link : https://assessnet.vercel.app
Api Link : https://assessnet-cipherschools.onrender.com

Important Note : During Login or Signup It can take upto 50 seconds to responds because on render it responds lately.

Features

  • Environment Testing: Ensures the user's camera and microphone are working before starting the quiz.
  • User Authentication: Secure user registration and login using JWTs.
  • Dynamic Quiz: Presents 10 questions for demo purposes, with a user-friendly interface.
  • Email Score Reporting: After the quiz, the user's score is automatically sent to their email using EmailJS.

Project Demo

AssessNet.mp4

alt text

alt text

EmailJS Code Snippet

      const finistTest = () => {

        console.log(user.email)
        console.log(score)
        let emailTemplate = `${user.name} your test score is ${score}/${questions.length}`;
        emailjs.send(
            config.emailJSServiceID,
            config.emailJSTemplateID,
            {
                from_name: 'AssessNet',
                to_name: user.name,
                from_email: 'skprajapati3214@gmail.com',
                to_email: user.email,
                message: emailTemplate
            },
            config.emailJSPublicKEY
        )
            .then((response) => {
                console.log('Email sent successfully');
                console.log(response)
                alert('Email sent successfully');
                dispatch(logout());
                navigate('/');
            })
            .catch((err) => {
                console.error('Error sending email:', err);
                alert('Error sending email');
            });

    }

Tech Stack

  • Frontend:

    • React.js with Vite for a fast development experience.
    • Tailwind CSS for styling.
    • EmailJS for sending quiz scores via email.

  • Backend:

    • Node.js and Express.js for handling authentication and other API endpoints.
    • MongoDB for user data management.

  • Environment Management:

    • .env files for storing sensitive information like API keys and database credentials.

Project Structure

The project is divided into two main directories:

  • backend: Contains all the server-side logic.

    • controllers/: Business logic for handling user requests.
    • db/: Database connection and models.
    • middleware/: Authentication and other middleware functions.
    • routes/: API endpoints.
    • lib/: Utility functions and reusable code.

  • frontend: Contains all the client-side logic.

    • src/components/: React components for different parts of the UI.
    • src/services/: Service files for handling API requests and authentication.
    • src/store/: State management using Redux.
    • src/config/: Configuration files for different environments.

Getting Started

Prerequisites

  • Node.js and npm installed.
  • MongoDB database set up.
  • EmailJS account for email integration.

Installation

  1. Clone the repository:

    git clone https://github.com/skp3214/AssessNet-CipherSchools.git
cd AssessNet

  2. Install dependencies:

    # Backend
cd backend
npm install

# Frontend
cd frontend
npm install

  3. Environment Variables: Create a .env file in both the backend and frontend directories with the necessary environment variables. Example:

    Backend .env

     MONGO_URI=
 PORT=5000
 JWT_SECRET=skp3214
 NODE_ENV=development

    Frontend .env

     VITE_APIURL=http://localhost:5000/api/auth
 VITE_APP_EMAILJS_SERVICE_ID=
 VITE_APP_EMAILJS_TEMPLATE_ID=
 VITE_APP_EMAILJS_PUBLIC_KEY=

Running the Application

  1. Start the backend server:

    cd backend
npm run dev

  2. Start the frontend server:

    cd frontend
npm run dev

  3. Access the application: Open your browser and navigate to http://localhost:5173.

Usage

  • Sign Up/Login: Users must sign up or log in to access the quiz.
  • Environment Test: Before starting the quiz, users are required to allow access to their camera and microphone.
  • Take Quiz: Answer the 10 demo questions presented.
  • Score Reporting: After submitting the quiz, the user's score is sent to their registered email.