Student Management System (SMS)

A complete, production-ready Student Management System built with Node.js, Express, MongoDB, React, and Tailwind CSS.

Features

👥 User Management

• Role-based access: Super Admin, Admin, Teacher, Student, Parent
• JWT authentication with secure login/register
• Profile management & password reset

📚 Student Management

• Add/Edit/Delete students with full profiles
• Automatic student ID generation
• Upload photos & documents
• Parent/guardian information
• Emergency contacts & medical info
• Search & filter with pagination

👨‍🏫 Teacher Management

• Full teacher profiles with qualifications
• Subject & class assignment
• Employment type & salary tracking
• Document management

📖 Class & Subject Management

• Create classes with multiple sections
• Assign class teachers
• Subject creation with pass/fail criteria
• Academic year tracking

✅ Attendance Management

• Daily attendance marking (Present/Absent/Late/Half-day)
• Bulk mark all present/absent
• Monthly attendance reports
• Student-wise attendance percentage
• Attendance analytics with charts

📝 Exam & Results

• Create exams (Midterm, Final, Quiz, Weekly, Monthly, Practical)
• Marks entry per subject per student
• Automatic grade calculation (A+ to F)
• Report card generation
• Pass/Fail status tracking

💰 Fee Management

• Fee collection with receipt generation
• Multiple fee types (Tuition, Hostel, Transport, etc.)
• Payment tracking (Paid/Partial/Pending/Overdue)
• Discount & fine management
• Payment methods (Cash, Card, Online, Cheque)

📅 Timetable Management

• Class-wise & teacher-wise timetable
• Day/subject period management
• Room assignment
• Bulk entry support

📄 Assignment Management

• Create & submit assignments
• Grade submissions with feedback
• Late submission detection

📚 Library Management

• Book catalog with search
• Issue/Return tracking
• Fine calculation for overdue books
• Real-time availability tracking

🔔 Notification System

• In-app notifications
• Role-based broadcasting
• Priority levels (Low/Medium/High/Urgent)
• Read/unread tracking

📊 Reports & Dashboards

• Admin dashboard with stats & charts
• Teacher dashboard with quick actions
• Student dashboard with attendance & fee status
• Attendance reports with visual charts
• Fee collection summary

🎨 UI/UX

• Modern, responsive design
• Dark mode / Light mode toggle
• Smooth animations & transitions
• Mobile-friendly layout
• Toast notifications
• Loading skeletons

Tech Stack

Layer	Technology
Frontend	React 18, React Router 6, Tailwind CSS, Chart.js, Axios
Backend	Node.js, Express.js
Database	MongoDB with Mongoose ODM
Auth	JWT (JSON Web Tokens), bcryptjs
Security	Helmet, CORS, Rate Limiting, XSS Clean, Input Validation
File Upload	Multer
Email	Nodemailer

Project Structure

StudentManagementSystem/
├── backend/
│   ├── src/
│   │   ├── config/          # Database & app config
│   │   ├── controllers/     # Route handlers
│   │   ├── middleware/       # Auth, validation, upload, error handling
│   │   ├── models/          # Mongoose schemas
│   │   ├── routes/          # Express routes
│   │   ├── utils/           # Helpers
│   │   ├── validators/      # Express-validator rules
│   │   ├── server.js        # Entry point
│   │   └── seed.js          # Database seeder
│   ├── .env
│   └── package.json
│
├── frontend/
│   ├── src/
│   │   ├── assets/css/      # Tailwind styles
│   │   ├── components/
│   │   │   ├── auth/        # Login, Register
│   │   │   ├── dashboard/   # Admin, Teacher, Student dashboards
│   │   │   ├── layout/      # MainLayout, Sidebar, Header
│   │   │   ├── students/    # List, Form
│   │   │   ├── teachers/    # List, Form
│   │   │   ├── classes/     # ClassList, SubjectList
│   │   │   ├── attendance/  # Mark, Reports
│   │   │   ├── exams/       # List, Form, MarksEntry, Results
│   │   │   ├── fees/        # List, Collect
│   │   │   ├── timetable/   # TimetableView
│   │   │   ├── assignments/ # AssignmentList
│   │   │   ├── library/     # LibraryView
│   │   │   ├── notifications/ # NotificationList
│   │   │   └── common/      # Settings
│   │   ├── contexts/        # AuthContext, ThemeContext
│   │   ├── services/        # API service (Axios)
│   │   ├── App.jsx          # Router
│   │   └── main.jsx         # Entry point
│   ├── index.html
   ├── vite.config.js
│   └── package.json

Quick Start

Prerequisites

• Node.js 18+
• MongoDB (local or Atlas)

1. Clone & Install

cd StudentManagementSystem

# Install backend dependencies
cd backend
npm install

# Install frontend dependencies
cd ../frontend
npm install

2. Configure Environment

# Backend: Edit backend/.env
PORT=5000
MONGODB_URI=mongodb://localhost:27017/student_management
JWT_SECRET=your_jwt_secret_key_change_this
JWT_EXPIRE=7d

3. Seed Database

cd backend
npm run seed

4. Start Development

# Terminal 1 - Backend
cd backend
npm run dev

# Terminal 2 - Frontend
cd frontend
npm run dev

Visit http://localhost:3000

Demo Credentials

Role	Email	Password
Super Admin	admin@sms.com	Admin123!
Teacher	teacher@sms.com	Teacher123!
Student	student@sms.com	Student123!
Parent	parent@sms.com	Parent123!

API Endpoints

Authentication

Method	Endpoint	Description
POST	/api/auth/register	Register new user
POST	/api/auth/login	Login
GET	/api/auth/me	Get current user
PUT	/api/auth/profile	Update profile
POST	/api/auth/forgot-password	Forgot password
PUT	/api/auth/reset-password/:token	Reset password

Students

Method	Endpoint	Description
GET	/api/students	List (paginated, filterable)
GET	/api/students/:id	Get single
POST	/api/students	Create
PUT	/api/students/:id	Update
DELETE	/api/students/:id	Deactivate

Teachers, Classes, Subjects, Attendance, Exams, Results, Fees, Timetable, Assignments, Library, Notifications, Dashboard

• All follow similar RESTful patterns under /api/teachers, /api/classes, etc.

Deployment

Backend (Render / Railway / Vercel)

cd backend
# Set environment variables on platform
npm start

Frontend (Vercel / Netlify)

cd frontend
npm run build
# Deploy dist/ folder

Security Features

• ✅ Password hashing with bcryptjs (12 rounds)
• ✅ JWT-based authentication with expiry
• ✅ Input validation & sanitization (express-validator, xss)
• ✅ HTTP headers protection (helmet)
• ✅ Cross-Origin Resource Sharing (cors)
• ✅ Rate limiting (express-rate-limit)
• ✅ Request logging (morgan)
• ✅ File upload validation (multer)

API Documentation

Full API documentation is available at /api/health endpoint when the server is running.