Complete Web App for taking online attendance using AI based Facial Recognition. Designed from scratch using React + Tailwind with Python backend. OpenCV used for Face detection and recognition.

Setup

1. Install Front-end

To run the front-end:

• Clone the repository.

• Navigate to the cloned repository and install dependencies by running:

npm install

• Now, start the server

npm start

2. Install Back-end

• The project requires python 3.7. Other versions may create issues.

• Install MongoDB using their documentation and start the MongoDB server.

• Navigate to backend/ folder and install the python dependencies:

pip install -r requirements.txt

• Run main.py

3. Connect front-end to back-end

• Note the local host url the backend server is running at (as given in the terminal output). Paste this url in config/api.js eg:

// End point of your flask api.
export const apiEndPoint = 'http://127.0.0.1:5000/';

Preview

WorkFlow

• User(Teacher) signs in.
• Teacher creates a new course by giving information, and dataset.
• Dataset includes a folder having pictures of students enrolled in the course, shot by their webcams.
• Upon creation, the data is sent to the backend and model is trained for the given course.
• To take attendence, the teacher starts a new session of the course.
• A unique code is generated which teacher sends out to the students.
• Students navigate to /markattendence page and paste the code.
• Students are then shown a page where they allow webcam, capture a shot and mark attendence. Using the trained model, their attendance is marked.
• Teacher can download attendence reports of a course in form of csv from the sessions page.