Project Introduction

The Smart Attendance System is a web application designed to streamline the process of tracking student attendance in educational institutions. Built using Node.js, this platform allows teachers to manage classes and attendance records efficiently while providing students with a way to view their attendance status. The system supports multiple user roles, including admin, teacher, and student, ensuring a tailored experience for each user type. The underlying MySQL database schema is structured to manage users, classes, attendance records, student profiles, notifications, and feedback, providing a robust foundation for effective attendance management.

Project Objectives

• To develop a user-friendly interface for teachers to manage classes and record attendance.
• To allow students to view their attendance records and receive notifications.
• To implement a secure user authentication system for managing user roles and permissions.
• To facilitate the recording of attendance, including statuses such as present, absent, and late.
• To manage student profiles, including enrollment dates and contact information.
• To provide a feedback mechanism for users to comment on the system and rate their experience.
• To send notifications to users regarding important updates, such as attendance alerts.
• To ensure the application is scalable and maintainable for future enhancements.

Project Modules

1. User Management Module:

   This module handles user registration, authentication, and role management, allowing users to manage their accounts securely.

2. Class Management Module:

   This module allows teachers to create, update, and manage classes, including details such as class name, subject, and schedule.

3. Attendance Management Module:

   This module facilitates the recording and tracking of student attendance for each class.

4. Student Profile Management Module:

   This module allows for the creation and management of student profiles, including enrollment dates and contact information.

5. Notification Module:

   This module sends notifications to users regarding important updates, such as attendance records and alerts.

6. Feedback Management Module:

   This module allows users to provide feedback on the system, including comments and ratings.

Steps Overview

Set Up the Project: Initialize a new Node.js project and install the required packages.

Configure Sequelize: Set up Sequelize to connect to your database.

Define Models: Create Sequelize models based on the provided SQL tables.

Create Repositories: Implement repository functions for CRUD operations.

Set Up Controllers: Create controllers to handle requests and responses.

Define Routes: Set up routes to map URLs to controller functions.

Create Views: Use EJS to create views for displaying data and forms.

Implement Bootstrap 5: Style the application using Bootstrap 5.

Step 1: Set Up the Project

mkdir attendance-app
cd attendance-app
npm init -y
npm install express sequelize mysql2 ejs body-parser

Step 2: Configure Sequelize

Create a file named config.js for database configuration.

// config.js
const { Sequelize } = require('sequelize');
const sequelize = new Sequelize('database_name', 'username', 'password', {
    host: 'localhost',
    dialect: 'mysql',
});
module.exports = sequelize;

Step 3: Define Models

Create a folder named models and create model files for each table.

models/User.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class User extends Model {}
User .init({
    UserId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    Username: { type: DataTypes.STRING, unique: true, allowNull: false },
    PasswordHash: { type: DataTypes.STRING, allowNull: false },
    Email: { type: DataTypes.STRING, unique: true, allowNull: false },
    FirstName: { type: DataTypes.STRING, allowNull: false },
    LastName: { type: DataTypes.STRING, allowNull: false },
    RoleId: { type: DataTypes.INTEGER, allowNull: false },
}, { sequelize, modelName: 'User ' });
module.exports = User;

Repeat similar structure for Roles, Classes, Sessions, Attendance, Reports, Notifications, Feedback, Backups.

Step 4: Create Repositories

Create a folder named repositories and implement CRUD operations.

// repositories/userRepository.js
const User = require('../models/User');
const userRepository = {
    create: async (userData) => {
        return await User.create(userData);
    },
    findAll: async () => {
        return await User.findAll();
    },
    findById: async (id) => {
        return await User.findByPk(id);
    },
    update: async (id, userData) => {
        return await User.update(userData, { where: { UserId: id } });
    },
    delete: async (id) => {
        return await User.destroy({ where: { UserId: id } });
    },
};
module.exports = userRepository;

Repeat similar structure for other entities.

Step 5: Set Up Controllers

Create a folder named controllers and implement the logic for handling requests.

// controllers/userController.js
const userRepository = require('../repositories/userRepository');
const userController = {
    create:User  async (req, res) => {
        const user = await userRepository.create(req.body);
        res.redirect('/users');
    },
    getAllUsers: async (req, res) => {
        const users = await userRepository.findAll();
        res.render('users/index', { users });
    },
    get:User  async (req, res) => {
        const user = await userRepository.findById(req.params.id);
        res.render('users/edit', { user });
    },
    update:User  async (req, res) => {
        await userRepository.update(req.params.id, req.body);
        res.redirect('/users');
    },
    delete:User  async (req, res) => {
        await userRepository.delete(req.params.id);
        res.redirect('/users');
    },
};
module.exports = userController;

Repeat similar structure for other entities.

Step 6: Define Routes

Create a folder named routes and set up the routes.

// routes/userRoutes.js
const express = require('express');
const userController = require('../controllers/userController');
const router = express.Router();
router.get('/', userController.getAllUsers);
router.get('/create', (req, res) => res.render('users/create'));
router.post('/', userController.createUser );
router.get('/:id', userController.getUser );
router.post('/:id', userController.updateUser );
router.post('/:id/delete', userController .deleteUser );
module.exports = router;

Repeat similar structure for other entities.

Step 7: Create Views

Create a folder named views and set up EJS templates for each entity.

<!-- views/users/index.ejs -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Users</title>
</head>
<body>
    <div class="container">
        <h1>Users</h1>
        <a href="/users/create" class="btn btn-primary">Create User</a>
        <table class="table">
            <thead>
                <tr>
                    <th>Username</th>
                    <th>Email</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% users.forEach(user => { %>
                    <tr>
                        <td><%= user.Username %></td>
                        <td><%= user.Email %></td>
                        <td>
                            <a href="/users/<%= user.UserId %>" class="btn btn-warning">Edit</a>
                            <form action="/users/<%= user.UserId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

Step 8: Implement Bootstrap 5

Ensure that all views utilize Bootstrap 5 for styling. You can include Bootstrap's CSS in the head of your EJS templates as shown in the example above.

Final Step: Initialize the Application

In your main application file (e.g., app.js), set up the Express server and integrate all components.

// app.js
const express = require('express');
const bodyParser = require('body-parser');
const sequelize = require('./config');
const userRoutes = require('./routes/userRoutes');
const app = express();
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({ extended: true }));
app.use('/users', userRoutes);
const PORT = process.env.PORT || 3000;
sequelize.sync().then(() => {
    app.listen(PORT, () => {
        console.log(`Server is running on http://localhost:${PORT}`);
    });
});

This setup provides a complete CRUD application for managing users, and similar steps can be followed for other entities like Roles, Classes, Sessions, Attendance, Reports, Notifications, Feedback, and Backups.

Complete Setup for Remaining Entities

Following are the complete setup for the remaining entities: Roles, Classes, Sessions, Attendance, Reports, Notifications, Feedback, and Backups. This will include models, repositories, controllers, routes, and views for each entity.

Step 1: Define Models

Create model files for each remaining entity in the models folder.

models/Role.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Role extends Model {}
Role.init({
    RoleId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    RoleName: { type: DataTypes.STRING, unique: true, allowNull: false },
}, { sequelize, modelName: 'Role' });
module.exports = Role;

models/Class.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Class extends Model {}
Class.init({
    ClassId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    ClassName: { type: DataTypes.STRING, allowNull: false },
}, { sequelize, modelName: 'Class' });
module.exports = Class;

models/Session.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Session extends Model {}
Session.init({
    SessionId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    ClassId: { type: DataTypes.INTEGER, allowNull: false },
    SessionDate: { type: DataTypes.DATE, allowNull: false },
}, { sequelize, modelName: 'Session' });
module.exports = Session;

models/Attendance.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Attendance extends Model {}
Attendance.init({
    AttendanceId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    UserId: { type: DataTypes.INTEGER, allowNull: false },
    SessionId: { type: DataTypes.INTEGER, allowNull: false },
    Status: { type: DataTypes.STRING, allowNull: false },
}, { sequelize, modelName: 'Attendance' });
module.exports = Attendance;

models/Report.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Report extends Model {}
Report.init({
    ReportId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    UserId: { type: DataTypes.INTEGER, allowNull: false },
    ReportDate: { type: DataTypes.DATE, allowNull: false },
    ReportContent: { type: DataTypes.TEXT },
}, { sequelize, modelName: 'Report' });
module.exports = Report;

models/Notification.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Notification extends Model {}
Notification.init({
    NotificationId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    UserId: { type: DataTypes.INTEGER, allowNull: false },
    Message: { type: DataTypes.STRING, allowNull: false },
    IsRead: { type: DataTypes.BOOLEAN, defaultValue: false },
}, { sequelize, modelName: 'Notification' });
module.exports = Notification;

models/Feedback.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Feedback extends Model {}
Feedback.init({
    FeedbackId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    UserId: { type: DataTypes.INTEGER, allowNull: false },
    FeedbackContent: { type: DataTypes.TEXT, allowNull: false },
}, { sequelize, modelName: 'Feedback' });
module.exports = Feedback;

models/Backup.js

const { Model, DataTypes } = require('sequelize');
const sequelize = require('../config');
class Backup extends Model {}
Backup.init({
    BackupId: { type: DataTypes.INTEGER, primaryKey: true, autoIncrement: true },
    UserId: { type: DataTypes.INTEGER, allowNull: false },
    BackupDate: { type: DataTypes.DATE, defaultValue: DataTypes.NOW },
    BackupFile: { type: DataTypes.STRING, allowNull: false },
}, { sequelize, modelName: 'Backup' });
module.exports = Backup;

Step 2: Create Repositories

Create repository files for each entity in the repositories folder.

repositories/roleRepository.js

const Role = require('../models/Role');
const roleRepository = {
    create: async (roleData) => return await Role.create(roleData);
    },
    findAll: async () => {
        return await Role.findAll();
    },
    findById: async (id) => {
        return await Role.findByPk(id);
    },
    update: async (id, roleData) => {
        return await Role.update(roleData, { where: { RoleId: id } });
    },
    delete: async (id) => {
        return await Role.destroy({ where: { RoleId: id } });
    },
};
module.exports = roleRepository;

repositories/classRepository.js

const Class = require('../models/Class');
const classRepository = {
    create: async (classData) => {
        return await Class.create(classData);
    },
    findAll: async () => {
        return await Class.findAll();
    },
    findById: async (id) => {
        return await Class.findByPk(id);
    },
    update: async (id, classData) => {
        return await Class.update(classData, { where: { ClassId: id } });
    },
    delete: async (id) => {
        return await Class.destroy({ where: { ClassId: id } });
    },
};
module.exports = classRepository;

repositories/sessionRepository.js

const Session = require('../models/Session');
const sessionRepository = {
    create: async (sessionData) => {
        return await Session.create(sessionData);
    },
    findAll: async () => {
        return await Session.findAll();
    },
    findById: async (id) => {
        return await Session.findByPk(id);
    },
    update: async (id, sessionData) => {
        return await Session.update(sessionData, { where: { SessionId: id } });
    },
    delete: async (id) => {
        return await Session.destroy({ where: { SessionId: id } });
    },
};
module.exports = sessionRepository;

repositories/attendanceRepository.js

const Attendance = require('../models/Attendance');
const attendanceRepository = {
    create: async (attendanceData) => {
        return await Attendance.create(attendanceData);
    },
    findAll: async () => {
        return await Attendance.findAll();
    },
    findById: async (id) => {
        return await Attendance.findByPk(id);
    },
    update: async (id, attendanceData) => {
        return await Attendance.update(attendanceData, { where: { AttendanceId: id } });
    },
    delete: async (id) => {
        return await Attendance.destroy({ where: { AttendanceId: id } });
    },
};
module.exports = attendanceRepository;

repositories/reportRepository.js

const Report = require('../models/Report');
const reportRepository = {
    create: async (reportData) => {
        return await Report.create(reportData);
    },
    findAll: async () => {
        return await Report.findAll();
    },
    findById: async (id) => {
        return await Report.findByPk(id);
    },
    update: async (id, reportData) => {
        return await Report.update(reportData, { where: { ReportId: id } });
    },
    delete: async (id) => {
        return await Report.destroy({ where: { ReportId: id } });
    },
};
module.exports = reportRepository;

repositories/notificationRepository.js

const Notification = require('../models/Notification');
const notificationRepository = {
    create: async (notificationData) => {
        return await Notification.create(notificationData);
    },
    findAll: async () => {
        return await Notification.findAll();
    },
    findById: async (id) => {
        return await Notification.findByPk(id);
    },
    update: async (id, notificationData) => {
        return await Notification.update(notificationData, { where: { NotificationId: id } });
    },
    delete: async (id) => {
        return await Notification.destroy({ where: { NotificationId: id } });
    },
};
module.exports = notificationRepository;

repositories/feedbackRepository.js

const Feedback = require('../models/Feedback');
const feedbackRepository = {
    create: async (feedbackData) => {
        return await Feedback.create(feedbackData);
    },
    findAll: async () => {
        return await Feedback.findAll();
    },
    findById: async (id) => {
        return await Feedback.findByPk(id);
    },
    update: async (id, feedbackData) => {
        return await Feedback.update(feedbackData, { where: { FeedbackId: id } });
    },
    delete: async (id) => {
        return await Feedback.destroy({ where: { FeedbackId: id } });
    },
};
module.exports = feedbackRepository;

repositories/backupRepository.js

const Backup = require('../models/Backup');
const backupRepository = {
    create: async (backupData) => {
        return await Backup.create(backupData);
    },
    findAll: async () => {
        return await Backup.findAll();
    },
    findById: async (id) => {
        return await Backup.findByPk(id);
    },
    update: async (id, backupData) => {
        return await Backup.update(backupData, { where: { BackupId: id } });
    },
    delete: async (id) => {
        return await Backup.destroy({ where: { BackupId: id } });
    },
};
module.exports = backupRepository;

Step 3: Set Up Controllers

Create controller files for each entity in the controllers folder.

controllers/roleController.js

const roleRepository = require('../repositories/roleRepository');
const roleController = {
    create: async (req, res) => {
        await roleRepository.create(req.body);
        res.redirect('/roles');
    },
    getAllRoles: async (req, res) => {
        const roles = await roleRepository.findAll();
        res.render('roles/index', { roles });
    },
    get: async (req, res) => {
        const role = await roleRepository.findById(req.params.id);
        res.render('roles/edit', { role });
    },
    update: async (req, res) => {
        await roleRepository.update(req.params.id, req.body);
        res.redirect('/roles');
    },
    delete: async (req, res) => {
        await roleRepository.delete(req.params.id);
        res.redirect('/roles');
    },
};
module.exports = roleController;

controllers/classController.js

const classRepository = require('../repositories/classRepository');
const classController = {
    create: async (req, res) => {
        await classRepository.create(req.body);
        res.redirect('/classes');
    },
    getAllClasses: async (req, res) => {
        const classes = await classRepository.findAll();
        res.render('classes/index', { classes });
    },
    get: async (req, res) => {
        const classData = await classRepository.findById(req.params.id);
        res.render('classes/edit', { classData });
    },
    update: async (req, res) => {
        await classRepository.update(req.params.id, req.body);
        res.redirect('/classes');
    },
    delete: async (req, res) => {
        await classRepository.delete(req.params.id);
        res.redirect('/classes');
    },
};
module.exports = classController;

controllers/sessionController.js

const sessionRepository = require('../repositories/sessionRepository');
const sessionController = {
    create: async (req, res) => {
        await sessionRepository.create(req.body);
        res.redirect('/sessions');
    },
    getAllSessions: async (req, res) => {
        const sessions = await sessionRepository.findAll();
        res.render('sessions/index', { sessions });
    },
    get: async (req, res) => {
        const session = await sessionRepository.findById(req.params.id);
        res.render('sessions/edit', { session });
    },
    update: async (req, res) => {
        await sessionRepository.update(req.params.id, req.body);
        res.redirect('/sessions');
    },
    delete: async (req, res) => {
        await sessionRepository.delete(req.params.id);
        res.redirect('/sessions');
    },
};
module.exports = sessionController;

controllers/attendanceController.js

const attendanceRepository = require('../repositories/attendanceRepository');
const attendanceController = {
    create: async (req, res) => {
        await attendanceRepository.create(req.body);
        res.redirect('/attendance');
    },
    getAllAttendance: async (req, res) => {
        const attendanceRecords = await attendanceRepository.findAll();
        res.render('attendance/index', { attendanceRecords });
    },
    get: async (req, res) => {
        const attendance = await attendanceRepository.findById(req.params.id);
        res.render('attendance/edit', { attendance });
    },
    update: async (req, res) => {
        await attendanceRepository.update(req.params.id, req.body);
        res.redirect('/attendance');
    },
    delete: async (req, res) => {
        await attendanceRepository.delete(req.params.id);
        res.redirect('/attendance');
    },
};
module.exports = attendanceController;

controllers/reportController.js

const reportRepository = require('../repositories/reportRepository');
const reportController = {
    create: async (req, res) => {
        await reportRepository.create(req.body);
        res.redirect('/reports');
    },
    getAllReports: async (req, res) => {
        const reports = await reportRepository findAll();
        res.render('reports/index', { reports });
    },
    get: async (req, res) => {
        const report = await reportRepository.findById(req.params.id);
        res.render('reports/edit', { report });
    },
    update: async (req, res) => {
        await reportRepository.update(req.params.id, req.body);
        res.redirect('/reports');
    },
    delete: async (req, res) => {
        await reportRepository.delete(req.params.id);
        res.redirect('/reports');
    },
};
module.exports = reportController;

controllers/notificationController.js

const notificationRepository = require('../repositories/notificationRepository');
const notificationController = {
    create: async (req, res) => {
        await notificationRepository.create(req.body);
        res.redirect('/notifications');
    },
    getAllNotifications: async (req, res) => {
        const notifications = await notificationRepository.findAll();
        res.render('notifications/index', { notifications });
    },
    get: async (req, res) => {
        const notification = await notificationRepository.findById(req.params.id);
        res.render('notifications/edit', { notification });
    },
    update: async (req, res) => {
        await notificationRepository.update(req.params.id, req.body);
        res.redirect('/notifications');
    },
    delete: async (req, res) => {
        await notificationRepository.delete(req.params.id);
        res.redirect('/notifications');
    },
};
module.exports = notificationController;

controllers/feedbackController.js

const feedbackRepository = require('../repositories/feedbackRepository');
const feedbackController = {
    create: async (req, res) => {
        await feedbackRepository.create(req.body);
        res.redirect('/feedback');
    },
    getAllFeedback: async (req, res) => {
        const feedbacks = await feedbackRepository.findAll();
        res.render('feedback/index', { feedbacks });
    },
    get: async (req, res) => {
        const feedback = await feedbackRepository.findById(req.params.id);
        res.render('feedback/edit', { feedback });
    },
    update: async (req, res) => {
        await feedbackRepository.update(req.params.id, req.body);
        res.redirect('/feedback');
    },
    delete: async (req, res) => {
        await feedbackRepository.delete(req.params.id);
        res.redirect('/feedback');
    },
};
module.exports = feedbackController;

controllers/backupController.js

const backupRepository = require('../repositories/backupRepository');
const backupController = {
    create: async (req, res) => {
        await backupRepository.create(req.body);
        res.redirect('/backups');
    },
    getAllBackups: async (req, res) => {
        const backups = await backupRepository.findAll();
        res.render('backups/index', { backups });
    },
    get: async (req, res) => {
        const backup = await backupRepository.findById(req.params.id);
        res.render('backups/edit', { backup });
    },
    update: async (req, res) => {
        await backupRepository.update(req.params.id, req.body);
        res.redirect('/backups');
    },
    delete: async (req, res) => {
        await backupRepository.delete(req.params.id);
        res.redirect('/backups');
    },
};
module.exports = backupController;

Step 4: Define Routes

Create route files for each entity in the routes folder.

routes/roleRoutes.js

const express = require('express');
const roleController = require('../controllers/roleController');
const router = express.Router();
router.get('/', roleController.getAllRoles);
router.get('/create', (req, res) => res.render('roles/create'));
router.post('/', roleController.create);
router.get('/:id', roleController.get);
router.post('/:id', roleController.update);
router.post('/:id/delete', roleController.delete);
module.exports = router;

routes/classRoutes.js

const express = require('express');
const classController = require('../controllers/classController');
const router = express.Router();
router.get('/', classController.getAllClasses);
router.get('/create', (req, res) => res.render('classes/create'));
router.post('/', classController.create);
router.get('/:id', classController.get);
router.post('/:id', classController.update);
router.post('/:id/delete', classController.delete);
module.exports = router;

routes/sessionRoutes.js

const express = require('express');
const sessionController = require('../controllers/sessionController');
const router = express.Router();
router.get('/', sessionController.getAllSessions);
router.get('/create', (req, res) => res.render('sessions/create'));
router.post('/', sessionController.create);
router.get('/:id', sessionController.get);
router.post('/:id', sessionController.update);
router.post('/:id/delete ', sessionController.delete);
module.exports = router;

routes/attendanceRoutes.js

const express = require('express');
const attendanceController = require('../controllers/attendanceController');
const router = express.Router();
router.get('/', attendanceController.getAllAttendance);
router.get('/create', (req, res) => res.render('attendance/create'));
router.post('/', attendanceController.create);
router.get('/:id', attendanceController.get);
router.post('/:id', attendanceController.update);
router.post('/:id/delete', attendanceController.delete);
module.exports = router;

routes/reportRoutes.js

const express = require('express');
const reportController = require('../controllers/reportController');
const router = express.Router();
router.get('/', reportController.getAllReports);
router.get('/create', (req, res) => res.render('reports/create'));
router.post('/', reportController.create);
router.get('/:id', reportController.get);
router.post('/:id', reportController.update);
router.post('/:id/delete', reportController.delete);
module.exports = router;

routes/notificationRoutes.js

const express = require('express');
const notificationController = require('../controllers/notificationController');
const router = express.Router();
router.get('/', notificationController.getAllNotifications);
router.get('/create', (req, res) => res.render('notifications/create'));
router.post('/', notificationController.create);
router.get('/:id', notificationController.get);
router.post('/:id', notificationController.update);
router.post('/:id/delete', notificationController.delete);
module.exports = router;

routes/feedbackRoutes.js

const express = require('express');
const feedbackController = require('../controllers/feedbackController');
const router = express.Router();
router.get('/', feedbackController.getAllFeedback);
router.get('/create', (req, res) => res.render('feedback/create'));
router.post('/', feedbackController.create);
router.get('/:id', feedbackController.get);
router.post('/:id', feedbackController.update);
router.post('/:id/delete', feedbackController.delete);
module.exports = router;

routes/backupRoutes.js

const express = require('express');
const backupController = require('../controllers/backupController');
const router = express.Router();
router.get('/', backupController.getAllBackups);
router.get('/create', (req, res) => res.render('backups/create'));
router.post('/', backupController.create);
router.get('/:id', backupController.get);
router.post('/:id', backupController.update);
router.post('/:id/delete', backupController.delete);
module.exports = router;

Step 5: Create Views

Create EJS templates for each entity in the views folder.

views/roles/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Roles</title>
</head>
<body>
    <div class="container">
        <h1>Roles</h1>
        <a href="/roles/create" class="btn btn-primary">Create Role</a>
        <table class="table">
            <thead>
                <tr>
                    <th>Role Name</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% roles.forEach(role => { %>
                    <tr>
                        <td><%= role.RoleName %></td>
                        <td>
                            <a href="/roles/<%= role.RoleId %>" class="btn btn-warning">Edit</a>
                            <form action="/roles/<%= role.RoleId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/classes/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Classes</title>
</head>
<body>
    <div class="container">
        <h1>Classes</h1>
        <a href="/classes/create" class="btn btn-primary">Create Class</a>
        <table class="table">
            <thead>
                <tr>
                    <th>Class Name</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody <% classes.forEach(classData => { %>
                    <tr>
                        <td><%= classData.ClassName %></td>
                        <td>
                            <a href="/classes/<%= classData.ClassId %>" class="btn btn-warning">Edit</a>
                            <form action="/classes/<%= classData.ClassId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/sessions/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Sessions</title>
</head>
<body>
    <div class="container">
        <h1>Sessions</h1>
        <a href="/sessions/create" class="btn btn-primary">Create Session</a>
        <table class="table">
            <thead>
                <tr>
                    <th>Session Date</th>
                    <th>Class ID</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% sessions.forEach(session => { %>
                    <tr>
                        <td><%= session.SessionDate %></td>
                        <td><%= session.ClassId %></td>
                        <td>
                            <a href="/sessions/<%= session.SessionId %>" class="btn btn-warning">Edit</a>
                            <form action="/sessions/<%= session.SessionId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/attendance/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Attendance</title>
</head>
<body>
    <div class="container">
        <h1>Attendance</h1>
        <a href="/attendance/create" class="btn btn-primary">Create Attendance Record</a>
        <table class="table">
            <thead>
                <tr>
                    <th>User ID</th>
                    <th>Session ID</th>
                    <th>Status</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% attendanceRecords.forEach(record => { %>
                    <tr>
                        <td><%= record.UserId %></td>
                        <td><%= record.SessionId %></td>
                        <td><%= record.Status %></td>
                        <td>
                            <a href="/attendance/<%= record.AttendanceId %>" class="btn btn-warning">Edit</a>
                            <form action="/attendance/<%= record.AttendanceId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/reports/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Reports</title>
</head>
<body>
    <div class="container">
        <h1>Reports</h1>
        <a href="/reports/create" class="btn btn-primary">Create Report</a>
        <table class="table">
            <thead>
                <tr>
                    <th>User ID</th>
                    <th>Report Date</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% reports.forEach(report => { %>
                    <tr>
                        <td><%= report.UserId %></td>
                        <td><%= report.ReportDate %></td <td>
                            <a href="/reports/<%= report.ReportId %>" class="btn btn-warning">Edit</a>
                            <form action="/reports/<%= report.ReportId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/notifications/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Notifications</title>
</head>
<body>
    <div class="container">
        <h1>Notifications</h1>
        <a href="/notifications/create" class="btn btn-primary">Create Notification</a>
        <table class="table">
            <thead>
                <tr>
                    <th>User ID</th>
                    <th>Message</th>
                    <th>Is Read</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% notifications.forEach(notification => { %>
                    <tr>
                        <td><%= notification.UserId %></td>
                        <td><%= notification.Message %></td>
                        <td><%= notification.IsRead ? 'Yes' : 'No' %></td>
                        <td>
                            <a href="/notifications/<%= notification.NotificationId %>" class="btn btn-warning">Edit</a>
                            <form action="/notifications/<%= notification.NotificationId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/feedback/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Feedback</title>
</head>
<body>
    <div class="container">
        <h1>Feedback</h1>
        <a href="/feedback/create" class="btn btn-primary">Create Feedback</a>
        <table class="table">
            <thead>
                <tr>
                    <th>User ID</th>
                    <th>Feedback Content</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% feedbacks.forEach(feedback => { %>
                    <tr>
                        <td><%= feedback.UserId %></td>
                        <td><%= feedback.FeedbackContent %></td>
                        <td>
                            <a href="/feedback/<%= feedback.FeedbackId %>" class="btn btn-warning">Edit</a>
                            <form action="/feedback/<%= feedback.FeedbackId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

views/backups/index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Backups</title>
</head>
<body>
    <div class="container">
        <h1>Backups</h1>
        <a href="/backups/create" class="btn btn-primary">Create Backup</a>
        <table class="table">
            <thead>
                <tr>
                    <th>User ID</th>
                    <th>Backup Date</th>
                    <th>Backup File</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                <% backups.forEach(backup => { %>
                    <tr>
                        <td><%= backup.UserId %></td>
                        <td><%= backup.BackupDate %></td>
                        <td><%= backup .BackupFile %></td>
                        <td>
                            <a href="/backups/<%= backup.BackupId %>" class="btn btn-warning">Edit</a>
                            <form action="/backups/<%= backup.BackupId %>/delete" method="POST" style="display:inline;">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </form>
                        </td>
                    </tr>
                <% }) %>
            </tbody>
        </table>
    </div>
</body>
</html>

Final Step: Initialize the Application

In your main application file (e.g., app.js), set up the Express server and integrate all components.

// app.js
const express = require('express');
const bodyParser = require('body-parser');
const sequelize = require('./config');
const userRoutes = require('./routes/userRoutes');
const roleRoutes = require('./routes/roleRoutes');
const classRoutes = require('./routes/classRoutes');
const sessionRoutes = require('./routes/sessionRoutes');
const attendanceRoutes = require('./routes/attendanceRoutes');
const reportRoutes = require('./routes/reportRoutes');
const notificationRoutes = require('./routes/notificationRoutes');
const feedbackRoutes = require('./routes/feedbackRoutes');
const backupRoutes = require('./routes/backupRoutes');
const app = express();
app.set('view engine', 'ejs');
app.use(bodyParser.urlencoded({ extended: true }));
app.use('/users', userRoutes);
app.use('/roles', roleRoutes);
app.use('/classes', classRoutes);
app.use('/sessions', sessionRoutes);
app.use('/attendance', attendanceRoutes);
app.use('/reports', reportRoutes);
app.use('/notifications', notificationRoutes);
app.use('/feedback', feedbackRoutes);
app.use('/backups', backupRoutes);
const PORT = process.env.PORT || 3000;
sequelize.sync().then(() => {
    app.listen(PORT, () => {
        console.log(`Server is running on http://localhost:${PORT}`);
    });
});

This completes the setup for a complete CRUD application using Node.js, Sequelize, Express, and EJS with Bootstrap 5 templates for all entities: Users, Roles, Classes, Sessions, Attendance, Reports, Notifications, Feedback, and Backups.

Folder Structure for NodeJS & ExpressJS Project

Creating a Login Page in Node.js with MySQL in Express

Creating a Dashboard Page

To create a dashboard page in your Node.js project using Sequelize and EJS, you'll need to follow these steps:

Step 1: Define the Dashboard Model

If you need to consolidate data from multiple models, you might want to create a service or a method that fetches and aggregates this data.

Step 2: Create the Dashboard Controller

Create a controller file for the dashboard in the controllers folder.

controllers/dashboardController.js

const { User, Role, Class, Attendance } = require('../models'); // Import your models
const dashboardController = {
    getDashboard: async (req, res) => {
        try {
            const userCount = await User.count();
            const roleCount = await Role.count();
            const classCount = await Class.count();
            const attendanceCount = await Attendance.count();
            res.render('dashboard', {
                userCount,
                roleCount,
                classCount,
                attendanceCount,
            });
        } catch (error) {
            console.error(error);
            res.status(500).send('Server Error');
        }
    },
};
module.exports = dashboardController;

Step 3: Define Routes for the Dashboard

Create a route file for the dashboard in the routes folder.

routes/dashboardRoutes.js

const express = require('express');
const dashboardController = require('../controllers/dashboardController');
const router = express.Router();
router.get('/', dashboardController.getDashboard);
module.exports = router;

Step 4: Create the Dashboard View

Create an EJS template for the dashboard in the views folder.

views/dashboard.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/5.0.0-beta1/css/bootstrap.min.css">
    <title>Dashboard</title>
</head>
<body>
    <div class="container">
        <h1>Dashboard</h1>
        <div class="row">
            <div class="col-md-3">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">Users</h5>
                        <p class="card-text"><%= userCount %></p>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">Roles</h5>
                        <p class="card-text"><%= roleCount %></p>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">Classes</h5>
                        <p class="card-text"><%= classCount %></p>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">Attendance</h5>
                        <p class="card-text"><%= attendanceCount %></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

Step 5: Integrate the Dashboard Route

In your main application file (e.g., app.js), include the dashboard routes.

const dashboardRoutes = require('./routes/dashboardRoutes');
app.use('/dashboard', dashboardRoutes);

Final Step: Run Your Application

Start your application and navigate to /dashboard to see the consolidated data displayed on your dashboard page.

This setup will give you a basic dashboard that displays counts of users, roles, classes, and attendance records. You can expand this by adding more data or visualizations as needed.