A comprehensive administrative control panel for event management, user administration, and real-time system monitoring. Built with React, Node.js, Express, and MongoDB.
- Features
- Tech Stack
- Architecture
- Prerequisites
- Installation
- Configuration
- Running the Application
- Project Structure
- API Endpoints
- Environment Variables
- Security Features
- Development
- Contributing
- License
- Event Creation & Management: Create, update, and delete events
- Event Registration System: Handle participant registrations
- Event Overview Dashboard: Monitor all events at a glance
- Event Coordinator Panel: Specialized view for event coordinators
- User Authentication: Secure login and session management
- Role-Based Access Control: Different access levels (admin, coordinator, etc.)
- User Overview: Comprehensive user management dashboard
- Bulk User Operations: Add and manage multiple users efficiently
- Live Dashboard Updates: Real-time metrics and statistics via WebSocket
- System Monitoring: Track server health, CPU, memory usage, and uptime
- Live Event Updates: Automatic updates for event changes
- Room Management: Real-time room allocation and updates
- Server Status Control: Dynamic server mode switching (online, restricted, offline)
- Email Management: Built-in mailing system
- Analytics Dashboard: Visualizations with charts and graphs
- Samridhi Integration: Special module for Samridhi event management
- Framework: React 18.2
- UI Components: Material-UI (MUI)
- Routing: React Router DOM
- Real-time Communication: Socket.io Client
- Charts & Visualizations:
- Chart.js with React-Chartjs-2
- D3.js
- Recharts
- Animations: React Spring
- State Management: React Context API
- HTTP Client: Axios
- Build Tool: Next.js 14
- Runtime: Node.js
- Framework: Express.js
- Database: MongoDB with Mongoose ODM
- Real-time: Socket.io
- Authentication: Express Session with bcryptjs
- File Upload: Multer
- System Monitoring:
- pidusage
- systeminformation
- Security: CORS, HTTPS enforcement
- Process Management: Concurrently, Nodemon
- Linting: ESLint
- Environment Management: dotenv
βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
β Frontend (React) β
β ββββββββββββββββ ββββββββββββββββ ββββββββββββββββ β
β β Dashboard β β Events β β Users β β
β ββββββββββββββββ ββββββββββββββββ ββββββββββββββββ β
β β β
β WebSocket / REST API β
ββββββββββββββββββββββββββββ¬βββββββββββββββββββββββββββββββ
β
ββββββββββββββββββββββββββββ΄βββββββββββββββββββββββββββββββ
β Backend (Express.js) β
β ββββββββββββββββ ββββββββββββββββ ββββββββββββββββ β
β β Auth β β Events β β Real-time β β
β ββββββββββββββββ ββββββββββββββββ ββββββββββββββββ β
β β β
ββββββββββββββββββββββββββββ¬βββββββββββββββββββββββββββββββ
β
ββββββββ΄βββββββ
β MongoDB β
βββββββββββββββ
- Node.js: v18.0.0 or higher
- npm: v8.0.0 or higher
- MongoDB: v6.0 or higher (local or cloud instance)
- Git: For version control
git clone https://github.com/ErickXavier-dev/Savishkaara-Control-Panel.git
cd Savishkaara-Control-PanelInstall root dependencies:
npm installInstall backend dependencies:
cd backend
npm install
cd ..Install frontend dependencies:
cd frontend
npm install
cd ..Or use the convenient update script:
npm run updateCreate a .env file in the backend directory:
# Server Configuration
PORT=5000
NODE_ENV=development
# MongoDB Connection
MONGO_URI=mongodb://localhost:27017/savishkaara
# Or for MongoDB Atlas:
# MONGO_URI=mongodb+srv://<username>:<password>@cluster.mongodb.net/savishkaara
# Session Configuration
COOKIE_NAME=savishkaara_session
SESSION_SECRET=your-secure-session-secret-here
# CORS Origins (comma-separated)
ALLOWED_ORIGINS=http://localhost:3000,https://control.savishkaara.in
# Production Settings (if applicable)
# FORCE_HTTPS=trueCreate a .env file in the frontend directory:
# API Configuration
REACT_APP_API_URL=http://localhost:5000
REACT_APP_PROD_API_URL=https://testapi.amritaiedc.site
# WebSocket Configuration
REACT_APP_SOCKET_URL=http://localhost:5000Ensure MongoDB is running:
Local MongoDB:
mongod --dbpath /path/to/your/data/directoryOr use MongoDB Atlas (cloud) and update the MONGO_URI in your .env file.
Run both frontend and backend concurrently:
npm startThis will start:
- Backend server on
http://localhost:5000 - Frontend development server on
http://localhost:3000
Run backend only:
npm run serverRun frontend only:
npm run clientBuild and run in production:
npm run testThis will:
- Set
NODE_ENV=productionfor the backend - Build the frontend for production
- Serve the built frontend using
serve
Savishkaara-Control-Panel/
βββ backend/ # Backend application
β βββ db/
β β βββ mongodb.js # MongoDB connection setup
β βββ models/ # Mongoose models
β β βββ event_registration.js
β β βββ events.js
β β βββ User.js
β βββ routes/ # API routes
β β βββ addusers.js # User creation routes
β β βββ auth.js # Authentication routes
β β βββ eventManager.js # Event management routes
β β βββ realTime.js # Real-time WebSocket handlers
β β βββ roomUpdater.js # Room management
β β βββ userOVERVIEW.js # User overview routes
β β βββ users.js # User management routes
β β βββ verify.js # Verification routes
β βββ server.js # Express server entry point
β βββ package.json
β
βββ frontend/ # Frontend application
β βββ public/ # Static files
β β βββ icons/
β β βββ images/
β β βββ profile/
β βββ src/
β β βββ components/ # Reusable components
β β β βββ blurText.js
β β β βββ header.js
β β β βββ metricCard.js
β β β βββ metricCardData.js
β β β βββ sidebar.js
β β β βββ visualizationCard.js
β β βββ css/ # Component styles
β β βββ layouts/ # Layout components
β β β βββ layout.js
β β βββ pages/ # Page components
β β β βββ addEvent.js
β β β βββ addUser.js
β β β βββ dashboard.js
β β β βββ eventOverview.js
β β β βββ eventReg.js
β β β βββ forbidden.js
β β β βββ login.js
β β β βββ mailer.js
β β β βββ myEvent.js
β β β βββ samridhi.js
β β β βββ server.js
β β β βββ updatePassword.js
β β β βββ userOverview.js
β β βββ utils/ # Utility functions
β β β βββ roomManager.js
β β β βββ socketConnector.js
β β βββ App.js # Main application component
β β βββ index.js # React entry point
β βββ package.json
β
βββ package.json # Root package.json
βββ LICENSE # MIT License
βββ README.md # This file
The API follows RESTful principles and uses JSON for request/response bodies. All endpoints require appropriate authentication unless otherwise specified.
- Development:
http://localhost:5000 - Production:
https://testapi.amritaiedc.site
{
"Content-Type": "application/json",
"X-Allowed-Origin": "savishkaara.in" // Required in production
}Authenticate a user and create a session.
Endpoint: POST /login-auth
Request Body:
{
"username": "string",
"password": "string"
}Success Response (200 OK):
{
"message": "Login successful",
"objectID": "507f1f77bcf86cd799439011",
"name": "John Doe",
"gender": "male",
"department": "CSE",
"role": "admin"
}Password Reset Required (200 OK):
{
"redirectToUpdatePassword": true,
"objectID": "507f1f77bcf86cd799439011",
"name": "John Doe",
"gender": "male",
"department": "CSE",
"role": "coor"
}Error Response (401 Unauthorized):
{
"error": "Invalid username or password"
}Verify if the current session is authenticated.
Endpoint: GET /check-auth
Success Response (200 OK):
{
"isAuthenticated": true,
"objectID": "507f1f77bcf86cd799439011",
"name": "John Doe",
"gender": "male",
"department": "CSE",
"role": "admin"
}Unauthenticated Response (200 OK):
{
"isAuthenticated": false
}Update user password (typically after first login).
Endpoint: POST /update-password
Authentication: Required (Session-based)
Request Body:
{
"password": "newSecurePassword123"
}Success Response (200 OK):
{
"message": "Password updated successfully"
}Error Response (404 Not Found):
{
"error": "User not found"
}End the current user session.
Endpoint: POST /logout
Authentication: Required
Success Response (200 OK):
{
"message": "Logged out successfully"
}Retrieve list of all events with basic information.
Endpoint: GET /events
Success Response (200 OK):
[
{
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"venue": "Main Auditorium",
"coordinators": ["John Doe", "Jane Smith"],
"status": "upcoming",
"date_time": "2025-12-20T10:00:00.000Z"
}
]Retrieve detailed information about a specific event.
Endpoint: GET /events/:eventId
Parameters:
eventId(string, required): MongoDB ObjectId of the event
Success Response (200 OK):
{
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"venue": "Main Auditorium",
"date_time": "2025-12-20T10:00:00.000Z",
"fee": 500,
"coordinators": ["John Doe", "Jane Smith"],
"faculty_coordinators": ["Dr. Kumar", "Prof. Sharma"],
"form_link": "https://forms.example.com/techfest",
"excel_link": "https://docs.example.com/excel",
"status": "upcoming"
}Error Response (400 Bad Request):
{
"error": "Invalid event ID"
}Error Response (404 Not Found):
{
"error": "Event not found"
}Retrieve event details by event name.
Endpoint: GET /events/by-name/:name
Parameters:
name(string, required): Event name
Success Response (200 OK):
{
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"venue": "Main Auditorium",
"date_time": "2025-12-20T10:00:00.000Z",
"fee": 500,
"coordinators": ["John Doe", "Jane Smith"],
"faculty_coordinators": ["Dr. Kumar", "Prof. Sharma"],
"status": "upcoming"
}Retrieve all events managed by a specific coordinator.
Endpoint: GET /events/by-coordinator/:username
Parameters:
username(string, required): Coordinator's username
Success Response (200 OK):
[
{
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"venue": "Main Auditorium",
"coordinators": ["johncoord"],
"faculty_coordinators": ["Dr. Kumar"],
"status": "upcoming"
}
]Error Response (404 Not Found):
{
"error": "No events found for this username",
"details": "Username 'john' not found in coordinators or faculty coordinators"
}Add a new event to the system.
Endpoint: POST /addEvent
Authentication: Required (Admin/Super role)
Request Body:
{
"name": "Tech Fest 2025",
"venue": "Main Auditorium",
"dateAndTime": "2025-12-20T10:00:00.000Z",
"fee": 500,
"coordinators": ["John Doe", "Jane Smith"],
"facultyCoordinators": ["Dr. Kumar", "Prof. Sharma"],
"registrationLink": "https://forms.example.com/techfest",
"excelLink": "https://docs.example.com/excel"
}Success Response (201 Created):
{
"message": "Event added successfully",
"event": {
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"venue": "Main Auditorium",
"date_time": "2025-12-20T10:00:00.000Z",
"fee": 500,
"coordinators": ["John Doe", "Jane Smith"],
"faculty_coordinators": ["Dr. Kumar", "Prof. Sharma"],
"form_link": "https://forms.example.com/techfest",
"excel_link": "https://docs.example.com/excel",
"status": "upcoming"
}
}Error Response (400 Bad Request):
{
"error": "All required fields must be provided"
}Change the status of an event (upcoming, ongoing, completed).
Endpoint: POST /events/update-status-by-name
Authentication: Required
Request Body:
{
"name": "Tech Fest 2025",
"status": "ongoing"
}Success Response (200 OK):
{
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"status": "ongoing",
"venue": "Main Auditorium"
}Update comprehensive event information.
Endpoint: POST /events/update-details-by-name
Authentication: Required
Request Body:
{
"name": "Tech Fest 2025",
"venue": "New Auditorium",
"date_time": "2025-12-21T10:00:00.000Z",
"fee": 600,
"coordinators": ["John Doe", "Jane Smith", "Bob Wilson"],
"faculty_coordinators": ["Dr. Kumar"],
"form_link": "https://forms.example.com/techfest-updated",
"excel_link": "https://docs.example.com/excel-updated"
}Success Response (200 OK):
{
"message": "Event updated successfully",
"event": {
"_id": "507f1f77bcf86cd799439011",
"name": "Tech Fest 2025",
"venue": "New Auditorium",
"date_time": "2025-12-21T10:00:00.000Z",
"fee": 600
}
}Get registration and revenue summary for a specific event.
Endpoint: GET /events/summary/:eventName
Parameters:
eventName(string, required): URL-encoded event name
Success Response (200 OK):
{
"totalRegistrations": 150,
"totalRevenue": 75000
}Retrieve total and verified registration counts.
Endpoint: GET /events-count
Success Response (200 OK):
{
"totalRegistrations": 500,
"verifiedRegistrations": 450
}Calculate revenue for all events.
Endpoint: GET /events-revenue
Success Response (200 OK):
[
{
"name": "Tech Fest 2025",
"revenue": 75000
},
{
"name": "Cultural Night",
"revenue": 45000
}
]Get total revenue for a specific event.
Endpoint: GET /events-revenueper/:eventName
Parameters:
eventName(string, required): URL-encoded event name
Success Response (200 OK):
{
"eventName": "Tech Fest 2025",
"totalRevenue": 75000
}Get registration counts grouped by event.
Endpoint: GET /registration-trend
Success Response (200 OK):
[
{
"event": "Tech Fest 2025",
"count": 150
},
{
"event": "Cultural Night",
"count": 90
}
]Retrieve top 5 events by registration count.
Endpoint: GET /top-events
Success Response (200 OK):
[
{
"event": "Tech Fest 2025",
"count": 150
},
{
"event": "Cultural Night",
"count": 90
}
]Retrieve all currently ongoing events.
Endpoint: GET /ongoing-events
Success Response (200 OK):
[
{
"name": "Tech Fest 2025",
"venue": "Main Auditorium"
}
]Retrieve all event registrations.
Endpoint: GET /event-registrations
Success Response (200 OK):
[
{
"_id": "507f1f77bcf86cd799439011",
"ticket_number": "TKT001",
"timestamp": "2025-12-15T10:30:00.000Z",
"ticket_details": {
"event": "Tech Fest 2025",
"amount": "500"
},
"verified": true
}
]Remove a specific registration.
Endpoint: POST /delete-event-registrations/:id
Parameters:
id(string, required): MongoDB ObjectId of the registration
Success Response (200 OK):
{
"message": "Registration deleted successfully",
"deletedId": "507f1f77bcf86cd799439011"
}Error Response (400 Bad Request):
{
"error": "Invalid registration ID format"
}Forward ticket generation request to ticket service.
Endpoint: POST /request_ticket
Request Body:
{
"name": "John Doe",
"email": "john@example.com",
"event": "Tech Fest 2025",
"amount": 500
}Success Response: Forwards response from ticket generation service
Mark participant attendance for an event.
Endpoint: POST /verify-ticket
Request Body:
{
"ticketID": "TKT001"
}Success Response (200 OK):
{
"message": "Participant attendance marked successfully"
}Error Response (404 Not Found):
{
"error": "Participant not found"
}Retrieve all users with coordinator role.
Endpoint: GET /coordinators
Success Response (200 OK):
{
"coordinators": [
{
"name": "John Doe",
"username": "johndoe"
},
{
"name": "Jane Smith",
"username": "janesmith"
}
]
}Retrieve list of all unique event names.
Endpoint: GET /distinctEvents
Success Response (200 OK):
{
"events": [
"Tech Fest 2025",
"Cultural Night",
"Sports Day"
]
}Create a new user account.
Endpoint: POST /addUser
Authentication: Required (Admin/Super role)
Request Body (Admin/Super):
{
"name": "John Doe",
"username": "johndoe",
"gender": "male",
"role": "admin",
"mobile": "9876543210",
"dept": "CSE"
}Request Body (Coordinator):
{
"name": "Jane Smith",
"username": "janesmith",
"gender": "female",
"role": "coor",
"mobile": "9876543211",
"event_relation": "Tech Fest 2025"
}Success Response (201 Created):
{
"message": "User added successfully",
"user": {
"_id": "507f1f77bcf86cd799439011",
"name": "John Doe",
"username": "johndoe",
"mobile": 9876543210,
"role": "admin",
"dept": "CSE",
"status": -1,
"gender": "male"
}
}Error Response (400 Bad Request):
{
"error": "Name, username, gender, role, and mobile are required."
}Error Response (400 Bad Request - Duplicate):
{
"error": "User already exists"
}Retrieve details for all admins and coordinators.
Endpoint: GET /overview/details
Success Response (200 OK):
{
"users": [
{
"_id": "507f1f77bcf86cd799439011",
"name": "John Doe",
"role": "admin",
"event_relation": "none",
"mobile": "9876543210"
},
{
"_id": "507f1f77bcf86cd799439012",
"name": "Jane Smith",
"role": "coor",
"event_relation": "Tech Fest 2025",
"mobile": "9876543211"
}
]
}Retrieve department information for multiple users.
Endpoint: POST /users/depts-by-name
Request Body:
{
"names": ["John Doe", "Jane Smith", "Bob Wilson"]
}Success Response (200 OK):
{
"John Doe": "CSE",
"Jane Smith": "ECE",
"Bob Wilson": "ME"
}Reset user status and password to default.
Endpoint: POST /overview/reset-status/:mobile
Parameters:
mobile(string, required): User's mobile number
Success Response (200 OK):
{
"message": "Status reset and password updated for 9876543210"
}Error Response (404 Not Found):
{
"error": "User not found"
}Retrieve comprehensive server health metrics.
Endpoint: GET /status
Success Response (200 OK):
{
"status": "online",
"uptime": "2d 5h 30m",
"cpu": {
"usage": 45.2,
"cores": 8
},
"memory": {
"total": 16384,
"used": 8192,
"free": 8192,
"usagePercent": 50
},
"process": {
"cpu": 12.5,
"memory": 256
}
}Change server operational mode.
Endpoint: POST /update-server-status
Authentication: Required (Admin/Super role)
Request Body:
{
"status": "restricted"
}Allowed Values:
online- Full access to all pagesrestricted- Limited access to specific pages onlyoffline- API only, all pages blocked
Success Response (200 OK):
Status code 200 with no body
The application uses Socket.io for real-time communication.
Client connects to WebSocket server.
Event: connection
Server acknowledges:
socket.emit('connected', { message: 'Connected to WebSocket server' });Subscribe to specific room for updates.
Event: join-room
Emit:
socket.emit('join-room', { room: 'dashboard' });Available Rooms:
dashboard- Main dashboard updatessamridhi- Samridhi event updatesserver- Server status updateseventso- Events overview updateseventsa- Events admin updatesuserso- Users overview updatesusersa- Users admin updatesvevents- Verified events updatesmyevent- Individual event updates
Listen for real-time updates in subscribed room.
Event: update
Server emits:
socket.on('update', (data) => {
// Handle update data
console.log('Received update:', data);
});All error responses follow a consistent format:
{
"error": "Human-readable error message",
"details": "Technical details (optional)"
}- 200 OK - Request successful
- 201 Created - Resource created successfully
- 400 Bad Request - Invalid request parameters
- 401 Unauthorized - Authentication required or failed
- 403 Forbidden - Insufficient permissions
- 404 Not Found - Resource not found
- 500 Internal Server Error - Server error
The API uses Express sessions with HTTP-only cookies. After successful login, a session is created and maintained through cookies.
Roles:
super- Full system access, can manage all resourcesadmin- Administrative access, can manage events and userscoor/coordinator- Limited access to assigned events only
Protected Endpoints:
All endpoints except /login-auth and /check-auth require authentication.
objectID- User's MongoDB ObjectIdusername- User's usernameuser_role- User's role (super/admin/coor)name- User's full namedepartment- User's departmentevent- Assigned event (for coordinators)gender- User's gender
| Variable | Description | Required | Default |
|---|---|---|---|
PORT |
Server port | No | 5000 |
NODE_ENV |
Environment (development/production) | No | development |
MONGO_URI |
MongoDB connection string | Yes | - |
COOKIE_NAME |
Session cookie name | No | default |
SESSION_SECRET |
Session encryption secret | Yes (auto-generated) | - |
ALLOWED_ORIGINS |
CORS allowed origins | No | - |
| Variable | Description | Required | Default |
|---|---|---|---|
REACT_APP_API_URL |
Backend API URL (dev) | Yes | http://localhost:5000 |
REACT_APP_PROD_API_URL |
Backend API URL (prod) | Yes | - |
REACT_APP_SOCKET_URL |
WebSocket server URL | Yes | http://localhost:5000 |
- HTTPS Enforcement: Automatic redirect to HTTPS in production
- Session Management: Secure session handling with HTTP-only cookies
- Password Hashing: bcryptjs for password encryption
- CORS Protection: Configurable CORS policy
- Origin Validation: Custom origin header validation
- Role-Based Access Control: Different permission levels
- Protected Routes: Authentication-required routes in frontend
- Server Mode Control: Restrict access during maintenance
npm start- Run both frontend and backendnpm run server- Run backend onlynpm run client- Run frontend onlynpm run update- Install all dependenciesnpm run test- Run production build and test
npm start- Start production servernpm run demo- Start development server with nodemon
npm run dev- Start Next.js development servernpm run build- Build for productionnpm start- Run Next.js development servernpm run start:prod- Run production server
This project uses ESLint for code quality. Run linting with:
npm run lint- Create a new route in
backend/routes/ - Add model if needed in
backend/models/ - Create page component in
frontend/src/pages/ - Update routing in
frontend/src/App.js - Add to sidebar if needed in
frontend/src/components/sidebar.js
Contributions are welcome! Please follow these steps:
- Fork the repository
- Create a feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
- Follow the existing code style
- Write clear commit messages
- Add tests for new features
- Update documentation as needed
- Ensure all tests pass before submitting PR
This project is licensed under the MIT License - see the LICENSE file for details.
- Erick Xavier - Initial work - ErickXavier-dev
- Meenakshi B - Intial work - Meenakshi2002-26
- Akshay Sunith - Intial Work - Thanasis504
- Chinmay Shashedaran - Initial work - Obito8010
- Material-UI for the component library
- MongoDB team for the excellent database
- Socket.io for real-time functionality
- All contributors who have helped shape this project
For support, email: support@savishkaara.in
- Repository: https://github.com/ErickXavier-dev/Savishkaara-Control-Panel
- Production: https://control.savishkaara.in
- API Documentation: Coming soon
Made with β€οΈ by the Savishkaara Team