Skip to content

MOHAMED-MUHNI/service-request-management-system

Repository files navigation

๐Ÿšš Service Request Management System

A complete, production-ready full-stack application for managing service requests with real-time analytics, assignment scheduling, and comprehensive admin dashboard.

๐Ÿ“‹ Internship Test Project - Built as an assessment for Octick Pvt Ltd. All requirements completed with production deployment.

Node.js React MySQL Docker Deploy License


๐ŸŽฏ Assignment Completion Status

This project was built as an internship technical assessment. All requirements completed successfully.

โœ… Core Requirements (100%)

  • โœ… Customer trip request submission form
  • โœ… Coordinator admin panel with authentication
  • โœ… Status management (pending โ†’ approved/rejected/scheduled)
  • โœ… Driver & vehicle assignment with scheduling
  • โœ… Search requests by customer name or phone
  • โœ… Daily analytics (request count for last 7 days)

โœ… Technical Requirements (100%)

  • โœ… REST API with CRUD operations (Create, Read, Update, Delete)
  • โœ… Input validation with clear error messages
  • โœ… Correct HTTP status codes (200, 201, 400, 404, 500)
  • โœ… Pagination on admin list endpoint
  • โœ… /api/analytics/dashboard endpoint for statistics
  • โœ… Seed data (7 drivers, 7 vehicles)
  • โœ… Consistent JSON error shape with message and errors fields

โœ… Frontend Requirements (100%)

  • โœ… Responsive customer form with client-side validation
  • โœ… Friendly error messages & success states
  • โœ… Admin authentication system
  • โœ… Requests table with status filter & inline actions
  • โœ… Analytics chart (bar chart for daily requests)
  • โœ… Modal for scheduling with driver/vehicle dropdowns
  • โœ… Loading states throughout application
  • โœ… Clean, readable components

โœ… Quality Gates (100%)

  • โœ… Clear commit history (50+ commits with descriptive messages)
  • โœ… Unit tests (backend/src/tests/unit.test.js)
  • โœ… API tests (backend/src/tests/api.test.js)
  • โœ… Logging middleware (method, path, status, duration)
  • โœ… .env.example files with safe defaults
  • โœ… npm scripts for easy setup (npm run dev, npm start)
  • โœ… Comprehensive documentation

๐ŸŒŸ Stretch Goals Completed (2/4)

  • โœ… Production Deployment - Live demo on Render.com
  • โœ… Docker Compose - Full containerization setup
  • โŒ Role-based access control (coordinator/viewer)
  • โŒ Live updates via WebSockets/SSE

โฑ๏ธ Development Timeline

  • Time Spent: ~12 hours over 5 days
  • Commit Count: 50+ commits
  • Lines of Code: Backend (~2,500), Frontend (~1,800)

๐Ÿ“‹ Table of Contents

๐Ÿ“š Documentation

๐ŸŽฏ Lost in too many docs?
๐Ÿ‘‰ Start here: docs/WHICH_FILE_TO_READ.md - Quick guide to find what you need!

Essential Docs:

๐Ÿ“ View all documentation โ†’


๐ŸŒ Live Demo

๐Ÿš€ Live Application Deployed!

Access the demo at:

Demo Credentials:

Username: admin
Password: admin123

โš ๏ธ Note: Free tier services may take 30-60 seconds to wake up after inactivity.

๐Ÿ“– Full Documentation: See docs/ folder for detailed guides.


โœจ Features

Customer Portal

  • โœ… Submit service requests with validation
  • โœ… Multiple service types (Package Delivery, Furniture Moving, etc.)
  • โœ… Real-time form validation
  • โœ… Success notifications

Admin Dashboard

  • โœ… Secure JWT authentication
  • โœ… Real-time analytics & statistics
  • โœ… 7-day service requests chart
  • โœ… Service request management (CRUD)
  • โœ… Advanced filtering and search
  • โœ… Pagination support
  • โœ… Assignment scheduling
  • โœ… Status tracking workflow
  • โœ… Driver and vehicle management

Technical Features

  • โœ… RESTful API with MVC architecture
  • โœ… MySQL database with proper indexing
  • โœ… JWT authentication & authorization
  • โœ… Request/Response logging
  • โœ… Error handling middleware
  • โœ… Unit and API tests
  • โœ… Docker containerization
  • โœ… Responsive design
  • โœ… Production-ready configuration

๐Ÿ›  Tech Stack

Backend

  • Node.js (v18+) - Runtime environment
  • Express.js (v4.18) - Web framework
  • MySQL (v8.0) - Database
  • JWT - Authentication
  • Bcrypt - Password hashing
  • Winston - Logging
  • Jest & Supertest - Testing

Frontend

  • React (v18.2) - UI library
  • React Router - Navigation
  • Axios - HTTP client
  • Recharts - Data visualization
  • CSS3 - Styling (responsive)

DevOps

  • Docker & Docker Compose - Containerization
  • Nginx - Reverse proxy
  • ESLint & Prettier - Code quality
  • Nodemon - Development

๐Ÿ— Architecture

โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
โ”‚   React SPA     โ”‚
โ”‚  (Frontend)     โ”‚
โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜
         โ”‚
    HTTP/REST
         โ”‚
โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ–ผโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
โ”‚   Express API   โ”‚
โ”‚   (Backend)     โ”‚
โ”‚  - Controllers  โ”‚
โ”‚  - Middleware   โ”‚
โ”‚  - Routes       โ”‚
โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜
         โ”‚
      MySQL
         โ”‚
โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ–ผโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
โ”‚  MySQL Database โ”‚
โ”‚  - Users        โ”‚
โ”‚  - Requests     โ”‚
โ”‚  - Assignments  โ”‚
โ”‚  - Drivers      โ”‚
โ”‚  - Vehicles     โ”‚
โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜

MVC Pattern

Model (Database) โ”€โ”€> Controller (Business Logic) โ”€โ”€> View (React Components)
                              โ”‚
                         Middleware
                     (Auth, Logging, Error)

๐Ÿ“ฆ Prerequisites

Required

  • Node.js v18 or higher
  • npm v9 or higher
  • MySQL v8.0 or higher
  • Git

Optional (for Docker deployment)

  • Docker v20+
  • Docker Compose v2+

๐Ÿš€ Quick Start

Option 1: Docker (Recommended)

# Clone the repository
git clone <repository-url>
cd internTask

# Start all services
docker-compose up -d

# Wait 30 seconds for database initialization
# Access the application:
# - Customer Portal: http://localhost:3000
# - Admin Dashboard: http://localhost:3000/admin/login
# - Backend API: http://localhost:5000/api

Option 2: Local Development

# Clone and install
git clone <repository-url>
cd internTask
npm run install:all

# Set up environment variables
cp .env.example .env
cd backend && cp .env backend/.env
cd ../frontend && cp .env frontend/.env

# Start MySQL (ensure it's running)
# Update backend/.env with your MySQL credentials

# Run migrations and seed data
cd backend
npm run migrate
npm run seed

# Start development servers (from root)
npm run dev

# Access:
# - Frontend: http://localhost:3000
# - Backend: http://localhost:5000

๐Ÿ“ฅ Installation

Step 1: Clone Repository

git clone <repository-url>
cd internTask

Step 2: Install Dependencies

# Install all dependencies
npm run install:all

# Or install individually
npm install              # Root
cd backend && npm install
cd ../frontend && npm install

Step 3: Environment Configuration

Create .env files:

backend/.env

NODE_ENV=development
PORT=5000

DB_HOST=localhost
DB_PORT=3306
DB_USER=admin
DB_PASSWORD=admin123
DB_NAME=service_requests_db

JWT_SECRET=your_super_secret_jwt_key_change_in_production
JWT_EXPIRES_IN=24h

CORS_ORIGIN=http://localhost:3000

frontend/.env

REACT_APP_API_URL=http://localhost:5000/api

Step 4: Database Setup

# Ensure MySQL is running
# Login to MySQL and create database (optional - migration does this)
mysql -u root -p
CREATE DATABASE service_requests_db;
EXIT;

# Run migrations
cd backend
npm run migrate

# Seed sample data
npm run seed

๐Ÿƒ Running the Application

Development Mode

# Option 1: Run both frontend and backend
npm run dev

# Option 2: Run separately
# Terminal 1 - Backend
cd backend
npm run dev

# Terminal 2 - Frontend
cd frontend
npm start

Production Mode

# Build frontend
cd frontend
npm run build

# Start backend in production
cd backend
NODE_ENV=production npm start

Using Docker

# Start all services
docker-compose up -d

# View logs
docker-compose logs -f

# Stop services
docker-compose down

# Rebuild and start
docker-compose up --build -d

Using Makefile

# View all commands
make help

# Install dependencies
make install

# Run development
make dev

# Run migrations
make migrate

# Seed database
make seed

# Run tests
make test

# Docker commands
make docker-up
make docker-down

๐Ÿงช Testing

Run All Tests

cd backend
npm test

Run Tests with Coverage

npm test -- --coverage

Run Specific Tests

# Unit tests only
npm test -- unit.test.js

# API tests only
npm test -- api.test.js

Test Results

  • Unit tests cover utility functions (password hashing, JWT)
  • API tests cover authentication and service request endpoints
  • Coverage reports generated in backend/coverage/

๐Ÿ“š API Documentation

Base URL

http://localhost:5000/api

Authentication

Login

POST /api/auth/login
Content-Type: application/json

{
  "username": "admin",
  "password": "admin123"
}

Response: 200 OK
{
  "token": "eyJhbGc...",
  "user": {
    "id": 1,
    "username": "admin",
    "email": "admin@example.com",
    "role": "admin"
  }
}

Register

POST /api/auth/register
Content-Type: application/json

{
  "username": "newuser",
  "password": "password123",
  "email": "user@example.com"
}

Service Requests

Create Request (Public)

POST /api/service-requests
Content-Type: application/json

{
  "customer_name": "John Doe",
  "customer_email": "john@example.com",
  "customer_phone": "555-1234",
  "service_type": "Package Delivery",
  "pickup_address": "123 Main St",
  "delivery_address": "456 Oak Ave",
  "preferred_date": "2024-12-01",
  "special_instructions": "Handle with care"
}

Get All Requests (Protected)

GET /api/service-requests?page=1&limit=10&status=pending&search=john
Authorization: Bearer <token>

Get Request by ID (Protected)

GET /api/service-requests/:id
Authorization: Bearer <token>

Update Request (Protected)

PUT /api/service-requests/:id
Authorization: Bearer <token>
Content-Type: application/json

{
  "status": "completed"
}

Update Status (Protected)

PATCH /api/service-requests/:id/status
Authorization: Bearer <token>
Content-Type: application/json

{
  "status": "completed"
}

Assignments

Create Assignment (Protected)

POST /api/assignments
Authorization: Bearer <token>
Content-Type: application/json

{
  "request_id": 1,
  "driver_id": 1,
  "vehicle_id": 1,
  "scheduled_date": "2024-12-01T10:00:00"
}

Get All Assignments (Protected)

GET /api/assignments?page=1&limit=10
Authorization: Bearer <token>

Analytics

Get Dashboard Stats (Protected)

GET /api/analytics/dashboard
Authorization: Bearer <token>

Response:
{
  "totalRequests": 25,
  "pendingRequests": 5,
  "completedRequests": 15,
  "activeAssignments": 3,
  "availableDrivers": 4,
  "availableVehicles": 3
}

Get Requests by Day (Protected)

GET /api/analytics/requests-by-day?days=7
Authorization: Bearer <token>

Response:
[
  { "date": "2024-11-20", "count": 3 },
  { "date": "2024-11-21", "count": 5 },
  ...
]

Status Codes

  • 200 - Success
  • 201 - Created
  • 400 - Bad Request (validation error)
  • 401 - Unauthorized (missing/invalid token)
  • 404 - Not Found
  • 500 - Internal Server Error

๐Ÿšข Deployment

Render.com Deployment (Recommended)

โœจ Complete deployment guide available in RENDER_DEPLOYMENT.md

Quick overview:

  1. Set up free MySQL database (Aiven)
  2. Deploy backend to Render
  3. Deploy frontend to Render
  4. Update README with live demo links

Total Cost: $0/month (Free tier) Deployment Time: 30-45 minutes


Docker Deployment

  1. Build and Start
docker-compose up -d --build
  1. Environment Variables Update docker-compose.yml with production values

  2. Access Application

Manual Deployment

Backend (Node.js)

cd backend
npm ci --production
npm run migrate
npm run seed
NODE_ENV=production npm start

Frontend (React)

cd frontend
npm ci
npm run build
# Serve the 'build' folder with Nginx/Apache

Environment Variables (Production)

NODE_ENV=production
DB_HOST=your-db-host
JWT_SECRET=change-this-to-random-secure-string
CORS_ORIGIN=https://your-domain.com

Nginx Configuration

server {
    listen 80;
    server_name your-domain.com;

    location / {
        root /path/to/frontend/build;
        try_files $uri /index.html;
    }

    location /api {
        proxy_pass http://localhost:5000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

๐Ÿ”ง Troubleshooting

Database Connection Issues

Problem: Can't connect to MySQL

Solution:

# Check MySQL is running
systemctl status mysql   # Linux
brew services list       # macOS

# Test connection
mysql -u admin -p

# Verify credentials in backend/.env

Port Already in Use

Problem: Port 3000 or 5000 already in use

Solution:

# Find and kill process (Linux/macOS)
lsof -ti:3000 | xargs kill -9
lsof -ti:5000 | xargs kill -9

# Windows
netstat -ano | findstr :3000
taskkill /PID <PID> /F

Docker Issues

Problem: Containers won't start

Solution:

# Clean up Docker
docker-compose down -v
docker system prune -a

# Rebuild
docker-compose build --no-cache
docker-compose up -d

Migration Errors

Problem: Migration fails

Solution:

# Drop database and retry
mysql -u admin -p
DROP DATABASE service_requests_db;
EXIT;

# Re-run migration
cd backend
npm run migrate
npm run seed

Frontend Build Errors

Problem: npm run build fails

Solution:

# Clear cache and reinstall
cd frontend
rm -rf node_modules package-lock.json
npm install
npm run build

๐Ÿ“Š Database Schema

Tables

users

  • id (PK)
  • username (unique)
  • password_hash
  • email (unique)
  • role (admin/user)
  • created_at, updated_at

service_requests

  • id (PK)
  • customer_name
  • customer_email
  • customer_phone
  • service_type
  • pickup_address
  • delivery_address
  • preferred_date
  • special_instructions
  • status (pending/assigned/in_progress/completed/cancelled)
  • created_at, updated_at

drivers

  • id (PK)
  • name
  • phone
  • email
  • license_number (unique)
  • status (available/assigned/off_duty)
  • created_at, updated_at

vehicles

  • id (PK)
  • model
  • plate_number (unique)
  • year
  • capacity
  • status (available/in_use/maintenance)
  • created_at, updated_at

assignments

  • id (PK)
  • request_id (FK)
  • driver_id (FK)
  • vehicle_id (FK)
  • scheduled_date
  • status (scheduled/in_progress/completed/cancelled)
  • created_at, updated_at

๐Ÿ” Default Credentials

Username: admin
Password: admin123

โš ๏ธ Change these credentials in production!

๐Ÿ“ License

This project is licensed under the ISC License.

๐Ÿ‘จโ€๐Ÿ’ป Author

Developed as a demonstration of full-stack development skills.

๐Ÿ™ Acknowledgments

  • Express.js community
  • React community
  • MySQL team
  • Docker team

Need Help? Check the Troubleshooting section or create an issue.

Happy Coding! ๐Ÿš€

โšก