Attendance Manager

A comprehensive attendance management system for students and educators, providing easy tracking and monitoring of class attendance.

Screenshots

Dashboard

Student dashboard showing attendance statistics and upcoming classes

Course Management

Interface for managing course information and attendance records

Attendance Analytics

Visual representation of attendance patterns and trends

Timetable Visuals

Visual representation of Timetable saved by user

Features

• User Authentication: Secure signup/login system
• Course Management: Add and manage multiple courses
• Timetable Setup: Configure weekly class schedules
• Attendance Tracking: Record and view attendance statistics
• Dashboard Analytics: Visualize attendance patterns with charts
• Push Notifications: Receive reminders for upcoming classes

Tech Stack

Frontend

• React 19
• React Router v7
• Axios for API requests
• Recharts for data visualization
• Vite as build tool

Backend

• Node.js with Express
• MongoDB with Mongoose
• JWT & Passport.js for authentication
• Express-session for session management
• Web-push for notifications

Project Structure

attendance-manager/
├── frontend/                # React application
│   ├── src/
│   │   ├── api/             # API integration
│   │   ├── assets/          # Static assets
│   │   ├── components/      # Reusable UI components
│   │   ├── context/         # React context providers
│   │   ├── hooks/           # Custom React hooks
│   │   ├── pages/           # Main application pages
│   │   └── utils/           # Helper functions
│   └── package.json         # Frontend dependencies
│
├── backend/                 # Express server
│   ├── config/              # Configuration files
│   ├── middleware/          # Express middleware
│   ├── models/              # Mongoose data models
│   ├── routes/              # API routes
│   ├── scripts/             # Utility scripts
│   ├── services/            # Business logic
│   └── server.js            # Server entry point

Getting Started

Prerequisites

• Node.js (v16+)
• MongoDB

Installation

1. Clone the repository

git clone https://github.com/yourusername/attendance-manager.git
cd attendance-manager

2. Install backend dependencies

cd backend
npm install

3. Install frontend dependencies

cd ../frontend
npm install

4. Start the development servers

Backend:

cd backend
npm start

Frontend:

cd frontend
npm run dev

5. Access the application at http://localhost:5173

Deployment

The application is configured for easy deployment:

• Backend is ready for deployment on services like Heroku, Railway, or Render
• Frontend can be deployed to Netlify, Vercel, or any static hosting service

License

This project is licensed under the MIT License.

Contributors

• @waghmarepranav2006