{"id":16454458,"url":"https://github.com/zahidalidev/ai-facial-attendence-python-reactjs","last_synced_at":"2026-06-11T03:31:01.635Z","repository":{"id":50224994,"uuid":"323534271","full_name":"zahidalidev/AI-Facial-Attendence-Python-Reactjs","owner":"zahidalidev","description":null,"archived":false,"fork":false,"pushed_at":"2021-06-01T11:18:56.000Z","size":1404,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-26T22:27:45.135Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zahidalidev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-12-22T05:51:35.000Z","updated_at":"2025-02-04T16:53:58.000Z","dependencies_parsed_at":"2022-08-31T08:02:13.942Z","dependency_job_id":null,"html_url":"https://github.com/zahidalidev/AI-Facial-Attendence-Python-Reactjs","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/zahidalidev/AI-Facial-Attendence-Python-Reactjs","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zahidalidev%2FAI-Facial-Attendence-Python-Reactjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zahidalidev%2FAI-Facial-Attendence-Python-Reactjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zahidalidev%2FAI-Facial-Attendence-Python-Reactjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zahidalidev%2FAI-Facial-Attendence-Python-Reactjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zahidalidev","download_url":"https://codeload.github.com/zahidalidev/AI-Facial-Attendence-Python-Reactjs/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zahidalidev%2FAI-Facial-Attendence-Python-Reactjs/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34181554,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-11T02:00:06.485Z","response_time":57,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-11T10:19:03.845Z","updated_at":"2026-06-11T03:31:01.606Z","avatar_url":"https://github.com/zahidalidev.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![banner](https://user-images.githubusercontent.com/19692245/115225089-1e5add80-a127-11eb-8585-3ef56d46a7ba.jpg)\n\u003ch4 align=\"center\"\u003e\nComplete 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.\n\u003cbr\u003e\n\u003c/br\u003e\n\n\n## Setup\n\n### 1. Install Front-end\n\nTo run the front-end:\n\n- Clone the repository. \n\n- Navigate to the cloned repository and install dependencies by running: \n```sh\nnpm install\n```\n- Now, start the server\n```sh\nnpm start\n```\n\n### 2. Install Back-end\n\n- The project requires python 3.7. Other versions may create issues.\n\n- Install MongoDB using their documentation and start the MongoDB server.\n\n- Navigate to `backend/` folder and install the python dependencies:\n```sh\npip install -r requirements.txt\n```\n- Run main.py\n\n### 3. Connect front-end to back-end\n\n- Note the local host url the backend server is running at (as given in the terminal output). \nPaste this url in `config/api.js` eg: \n```sh\n// End point of your flask api.\nexport const apiEndPoint = 'http://127.0.0.1:5000/';\n```\n\n\n\n## Preview\n\n\u003cimg width=\"1439\" alt=\"1login\" src=\"https://user-images.githubusercontent.com/19692245/120232315-c27a8d00-c26c-11eb-8d74-04dc8da8e3ab.png\"\u003e\n\n\u003cimg width=\"1440\" alt=\"1home\" src=\"https://user-images.githubusercontent.com/19692245/120232422-fd7cc080-c26c-11eb-9e28-2be85a2c81c5.png\"\u003e\n\n\u003cimg width=\"1439\" alt=\"1new\" src=\"https://user-images.githubusercontent.com/19692245/120232458-0a011900-c26d-11eb-8237-9ebd7a4dcf10.png\"\u003e\n\n\u003cimg width=\"1440\" alt=\"1sessions\" src=\"https://user-images.githubusercontent.com/19692245/120232470-0ff6fa00-c26d-11eb-88f9-7eaf50ae7079.png\"\u003e\n\n\u003cimg width=\"1440\" alt=\"1 1home\" src=\"https://user-images.githubusercontent.com/19692245/120232487-15544480-c26d-11eb-95d5-98537b43e48c.png\"\u003e\n\n\u003cimg width=\"1440\" alt=\"1mark2\" src=\"https://user-images.githubusercontent.com/19692245/120232601-53e9ff00-c26d-11eb-98b9-b845aaf6225e.png\"\u003e\n\n\u003cimg width=\"1440\" alt=\"1mark3\" src=\"https://user-images.githubusercontent.com/19692245/120233197-ad066280-c26e-11eb-94e8-e94f96bb93f2.png\"\u003e\n\n\n## WorkFlow\n\n- User(Teacher) signs in.\n- Teacher creates a new course by giving information, and dataset.\n- Dataset includes a folder having pictures of students enrolled in the course, shot by their webcams. \n- Upon creation, the data is sent to the backend and model is trained for the given course.\n- To take attendence, the teacher starts a new session of the course. \n- A unique code is generated which teacher sends out to the students.\n- Students navigate to `/markattendence` page and paste the code. \n- Students are then shown a page where they allow webcam, capture a shot and mark attendence. Using the trained model, their attendance is marked.\n- Teacher can download attendence reports of a course in form of csv from the sessions page. \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzahidalidev%2Fai-facial-attendence-python-reactjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzahidalidev%2Fai-facial-attendence-python-reactjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzahidalidev%2Fai-facial-attendence-python-reactjs/lists"}