Geo Face Attendance System
AI-powered attendance system using face recognition and geolocation with secure JWT authentication, admin dashboard, and MongoDB.
Preview Gallery
6 mediaTechnologies & Skills
Limited time offer
What's Included
Support & Customization
Resource Links
Purchase this project to unlock source and premium resources. Document/report remain secure preview-based on this page.
# Geo Face Attendance System
Geo Face Attendance System is a full-stack MERN application that enables secure and automated attendance using **Face Recognition** and **Geolocation Verification**.
The system verifies a user's identity through facial recognition and ensures attendance can only be marked from an authorized location. JWT authentication protects all user sessions, while the admin panel provides attendance management and user monitoring.
## Features
✅ Secure User Registration & Login (JWT Authentication)
✅ Face Recognition using Face-api.js
✅ Geolocation-based Attendance Verification
✅ Student Dashboard
✅ Admin Dashboard
✅ Protected REST APIs
✅ Attendance History
✅ MongoDB Atlas Database
✅ Responsive User Interface
## Tech Stack
### Frontend
- React.js (Vite)
- Axios
- HTML5
- CSS3
- Face-api.js
### Backend
- Node.js
- Express.js
- MongoDB Atlas
- Mongoose
- JWT
- bcrypt.js
### Deployment
- Render (Backend)
- Vercel (Frontend)
- MongoDB Atlas (Database)
## Challenges Solved
- Secure authentication with JWT
- Real-time face verification
- GPS-based attendance validation
- REST API integration
- Cloud deployment using Render & Vercel
## Future Improvements
- Attendance analytics dashboard
- Email notifications
- QR Code attendance
- Multi-face detection
- Mobile application
- AI-based liveness detection
Future Enhancements
- AI-based liveness detection to prevent spoofing.
- QR code-based attendance as an alternative verification method.
- Email and push notifications.
- Attendance analytics and reporting dashboard.
- Export attendance records to PDF and Excel.
- Mobile application for Android and iOS.
- Multi-factor authentication.
- Facial recognition performance optimization.
Known Issues
- Face recognition accuracy depends on lighting conditions and camera quality.
- Geolocation accuracy varies based on the device and browser.
- The free Render service may take 30–60 seconds to wake up after inactivity.
- Camera permission must be granted before attendance can be marked.
Installation
Prerequisites
- Node.js (v18 or later)
- npm
- MongoDB Atlas account
- Git
Clone the Repository
git clone https://github.com/AdiCoder0721/geo-face-attendance.git cd geo-face-attendance
Backend Setup
cd server npm install
Create a .env file inside the server directory:
MONGO_URI=your_mongodb_connection_string ADMIN_KEY=your_admin_secret_key
Start the backend server:
npm run dev
Frontend Setup
Open a new terminal:
cd client npm install
Create a .env file:
VITE_API_URL=http://localhost:5000
Start the frontend:
npm run dev
Open your browser and visit:
http://localhost:5173
Usage
- Register a new user account or log in with existing credentials.
- Allow the browser to access your webcam and location.
- The application verifies the user's face and current location.
- If verification is successful, attendance is recorded in MongoDB Atlas.
- Users can view their attendance history from the dashboard.
- Administrators can manage users and monitor attendance records through the admin dashboard.
- The backend REST API is hosted on Render, while the frontend is deployed on Vercel.
System Requirements
Operating System:
- Windows 10/11, macOS, or Linux
Software Requirements:
- Node.js v18 or later
- npm
- Modern Web Browser (Chrome, Edge, Firefox)
Database:
- MongoDB Atlas
Hardware Requirements:
- Minimum 4 GB RAM
- 2 GB Free Disk Space
- Webcam (required for face verification)
- Internet Connection
- GPS/Location access enabled in the browser
Slides Open in New Tab
For better readability, slides are opened directly. Documents remain preview-only with secure backend rendering.
Showing preview pages only. Purchase for full access to all pages and complete source package.
Login for Full AccessNo Q&A available yet
Be the first to ask a question!
Ask a Question
Customer Reviews
Write Your Review
No reviews yet
Be the first to review this project!
Similar Projects
You might also be interested in these projects
Full Stack Bhautika-_Portfolio-application-
Booking-enabled portfolio site for physiotherapist Nirupama Bhatt, built with React, Firebase, and Gemini AI lets clients view her work and book slot
StayNext - Pg Discovery Platform
Built a full-stack PG platform where users discover PGs and owners manage listings, rooms, and tenant details.
Full-Stack E-Commerce website with MERN
Artisan Bazaar is a full-stack e-commerce website designed to connect local artisans with digital shoppers.
Task Manager App – MERN Stack
A full-stack Task Manager app built with MERN stack featuring priority levels, due dates, dark mode, and live deployment.