H0NEYP0T-466/RidePool-STRPS
π RidePool-STRPS β a smart π ride-pooling system β¨ with π real-time GPS tracking, π€ intelligent ride matching & pooling, π₯ multi-role dashboards (Rider/Driver/Admin π), β‘ Socket.IO live updates π, π JWT authentication, and π admin analytics for efficient transportation management π§©.
RidePool-STRPS
Smart Transportation & Ride-Pooling System (STRPS) β A comprehensive platform enabling efficient ride-sharing through real-time matching, live GPS tracking, and multi-role management.
π Abstract
RidePool-STRPS is a full-stack ride-pooling platform designed to optimize transportation through intelligent ride matching, real-time GPS tracking, and comprehensive multi-role management. The system caters to three primary user types: Riders (users requesting rides), Drivers (service providers), and Admins (platform managers).
Built with modern web technologies including React, TypeScript, FastAPI, and MongoDB, RidePool-STRPS leverages WebSocket connections for real-time updates and Leaflet maps for live location tracking. The platform implements secure JWT-based authentication, intelligent ride-matching algorithms, and dynamic fare calculation to provide an efficient, scalable solution for urban transportation needs.
Key Capabilities
- π Intelligent Ride Matching β Automatically matches riders with nearby drivers based on location, route compatibility, and pooling preferences
- π Live GPS Tracking β Real-time driver location updates and route visualization using Leaflet maps
- π₯ Multi-Role Architecture β Separate interfaces for riders, drivers, and administrators with role-based access control
- π Secure Authentication β JWT-based auth system with protected routes and token management
- β‘ Real-Time Updates β WebSocket-powered instant notifications for ride status changes, driver locations, and booking confirmations
- π Admin Dashboard β Comprehensive analytics, user management, and operational oversight tools
- π° Dynamic Pricing β Distance-based fare calculation with pooling discounts and surge pricing support
- π¦ Trip Management β Complete ride lifecycle management from booking to completion with status tracking
π Quick Links
- π Live Demo: https://ride-pool-strps.vercel.app
- π Documentation:
/docs - π Issues: github.com/H0NEYP0T-466/RidePool-STRPS/issues
- π€ Contributing: CONTRIBUTING.md
- π Security: SECURITY.md
π Table of Contents
- π Abstract
- π Quick Links
- β¨ Key Highlights
- π Architecture
- π Quick Start
- βοΈ Environment Configuration
- β‘ Usage
- π‘ API Documentation
- β¨ Features
- π Folder Structure
- π Deployment
- π§ Development Workflow
- πΈ Screenshots
- π Troubleshooting
- π Tech Stack
- π¦ Dependencies & Packages
- π€ Contributing
- π License
- π‘ Security
- π Code of Conduct
β¨ Key Highlights
- π Real-Time Ride Matching & Pooling β Advanced algorithms match riders with compatible routes for efficient carpooling
- π Live GPS Tracking β Real-time driver location updates with interactive Leaflet map visualization
- π₯ Three User Roles β Dedicated interfaces for Riders, Drivers, and Admins with role-based permissions
- π JWT Authentication & Security β Secure token-based authentication with protected API routes
- β‘ WebSocket Real-Time Updates β Instant notifications for ride status changes, driver locations, and bookings
- π Admin Analytics Dashboard β Comprehensive platform metrics, user management, and revenue tracking
- π° Dynamic Fare Calculation β Distance-based pricing with pooling discounts and surge pricing
- πΊοΈ Route Optimization β Intelligent routing for pooled rides with minimal detours
- π± Responsive Design β Mobile-first UI that works seamlessly across all devices
- π Automatic Ride Matching β Background service continuously matches available drivers with ride requests
π Architecture
System Overview
RidePool-STRPS follows a modern client-server architecture with real-time communication capabilities:
βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
β CLIENT LAYER β
β ββββββββββββββββ ββββββββββββββββ ββββββββββββββββ β
β β Rider App β β Driver App β β Admin Panel β β
β β (React) β β (React) β β (React) β β
β ββββββββ¬ββββββββ ββββββββ¬ββββββββ ββββββββ¬ββββββββ β
β β β β β
β ββββββββββββββββββββΌβββββββββββββββββββ β
β β β
ββββββββββββββββββββββββββββββΌββββββββββββββββββββββββββββββββββββββ
β
βββββββββββββ΄ββββββββββββ
β HTTP/WebSocket β
βββββββββββββ¬ββββββββββββ
β
ββββββββββββββββββββββββββββββΌββββββββββββββββββββββββββββββββββββββ
β SERVER LAYER β
β β β
β ββββββββββββββββββββ΄βββββββββββββββββββ β
β β FastAPI + Socket.IO β β
β β βββββββββββββββββββββββββββββββ β β
β β β Authentication Middleware β β β
β β βββββββββββββββββββββββββββββββ β β
β β ββββββββ ββββββββ ββββββββ β β
β β β Auth β β Ride β βAdmin β β β
β β β APIs β β APIs β β APIs β β β
β β ββββ¬ββββ ββββ¬ββββ ββββ¬ββββ β β
β β β β β β β
β β ββββββββββΌβββββββββ β β
β β β β β
β β ββββββββββ΄βββββββββ β β
β β β Business Logic β β β
β β β - Matching β β β
β β β - Pricing β β β
β β β - Routing β β β
β β ββββββββββ¬βββββββββ β β
β ββββββββββββββββΌβββββββββββββββββββββββ β
β β β
ββββββββββββββββββββββββββΌββββββββββββββββββββββββββββββββββββββββββ
β
βββββββββ΄ββββββββ
β MongoDB β
β Database β
βββββββββββββββββ
Frontend-Backend Communication
- HTTP REST APIs β CRUD operations for users, rides, bookings, and admin functions
- WebSocket (Socket.IO) β Real-time bidirectional communication for:
- Driver location updates
- Ride status notifications
- Live ride matching alerts
- Chat/messaging features
Authentication Flow
User Login Request
β
ββ> POST /api/auth/login
β
ββ> Validate credentials (bcrypt)
β
ββ> Generate JWT token (python-jose)
β
ββ> Return token + user data
β
ββ> Client stores token (localStorage)
Protected Request
β
ββ> Include token in Authorization header
β
ββ> Middleware validates token
β
ββ> Decode user from token
β
ββ> Check role permissions
β
ββ> Execute request or return 401/403
Database Schema
Collections:
usersβ User accounts (riders, drivers, admins)driversβ Driver-specific profiles (vehicle info, availability, ratings)bookingsβ Ride requests from ridersridesβ Accepted/active ride sessions (can have multiple passengers for pooling)feedbackβ Ratings and reviews
Key Relationships:
- User β Bookings (1:N)
- Driver β Rides (1:N)
- Ride β Bookings (1:N for pooled rides)
π Quick Start
Prerequisites
Before you begin, ensure you have the following installed:
- β Node.js 18+ (Download)
- β npm or yarn package manager
- β Python 3.10+ (Download)
- β MongoDB (Local or Atlas)
- β Git for version control
Installation Steps
1. Clone the Repository
git clone https://github.com/H0NEYP0T-466/RidePool-STRPS.git
cd RidePool-STRPS2. Frontend Setup
# Install dependencies
npm install
# Create .env file for frontend
cp .env.example .env # Or create manually
# Start development server
npm run devThe frontend will run at http://localhost:5173
3. Backend Setup
# Navigate to backend directory
cd backend
# Create virtual environment
python -m venv venv
# Activate virtual environment
# On Windows:
venv\Scripts\activate
# On macOS/Linux:
source venv/bin/activate
# Install dependencies
pip install -r requirements.txt
# Create .env file for backend
# Add your MongoDB URI and JWT secret (see Environment Configuration section)
# Start the FastAPI server
uvicorn app.main:socket_app --host 0.0.0.0 --port 8888 --reloadThe backend API will run at http://localhost:8888
4. Database Setup
# (Optional) Seed sample data
cd backend
python seed_data/seed.py5. Verification
β
Frontend: Open http://localhost:5173 β You should see the landing page
β
Backend: Visit http://localhost:8888/docs β FastAPI interactive documentation
β
Database: Check MongoDB connection β Verify collections are created
Common Gotchas
vite.config.ts or use --port flag
CORS_ORIGINS in backend .env includes your frontend URL
.env
βοΈ Environment Configuration
Frontend Environment Variables
Create a .env file in the project root:
# API Configuration
VITE_API_URL=http://localhost:8888
VITE_WS_URL=ws://localhost:8888
# Optional: Map Configuration
VITE_MAP_CENTER_LAT=28.6139
VITE_MAP_CENTER_LNG=77.2090
VITE_MAP_ZOOM=12Backend Environment Variables
Create a .env file in the backend/ directory:
# Database Configuration
MONGODB_URI=mongodb://localhost:27017/ridepool
# For MongoDB Atlas:
# MONGODB_URI=mongodb+srv://username:password@cluster.mongodb.net/ridepool?retryWrites=true&w=majority
# JWT Configuration
JWT_SECRET=09d25e094faa6ca2556c818166b7a9563b93f7099f6f0f4caa6cf63b88e8d3e7
JWT_ALGORITHM=HS256
ACCESS_TOKEN_EXPIRE_MINUTES=30
# CORS Configuration
CORS_ORIGINS=http://localhost:5173,https://ride-pool-strps.vercel.app
# Server Configuration
HOST=0.0.0.0
PORT=8888
# Optional: Redis (for production caching)
# REDIS_URL=redis://localhost:6379Security Note: Never commit .env files to version control. Use .env.example as a template.
β‘ Usage
For Riders (Users)
- Register/Login β Create an account or log in with existing credentials
- Request a Ride
- Enter pickup and dropoff locations on the map
- Choose whether to enable ride pooling (for discounted fares)
- View estimated fare
- Confirm booking
- Track Your Ride
- View real-time driver location on the map
- See estimated arrival time
- Receive notifications when driver is nearby
- Complete Ride
- Pay fare (cash or integrated payment)
- Rate your driver
- View ride history
For Drivers
- Register as Driver β Create account with
driverrole - Set Up Profile
- Add vehicle information (type, number, license)
- Upload required documents
- Toggle availability status
- Accept Rides
- View available ride requests nearby
- Accept rides that match your route
- View passenger details and destinations
- Complete Trip
- Update ride status (accepted β in-progress β completed)
- Share real-time location via WebSocket
- Collect payment
- View earnings and trip history
For Admins
- Login with Admin Credentials
- Dashboard Overview
- View total users, drivers, and rides
- Monitor active rides in real-time
- Track revenue and platform metrics
- User Management
- View all users and drivers
- Approve/suspend accounts
- Handle support requests
- Analytics
- Generate reports on rides, revenue, and user activity
- Identify peak hours and popular routes
- Monitor driver ratings and performance
π‘ API Documentation
Authentication Endpoints
| Method | Endpoint | Description | Auth Required |
|---|---|---|---|
POST |
/api/auth/register |
Register new user | β |
POST |
/api/auth/login |
User login | β |
GET |
/api/auth/me |
Get current user profile | β |
PUT |
/api/auth/profile |
Update user profile | β |
Example: Register User
curl -X POST http://localhost:8888/api/auth/register \
-H "Content-Type: application/json" \
-d '{
"name": "John Doe",
"email": "john@example.com",
"phone": "+1234567890",
"password": "securepassword",
"role": "user"
}'User/Rider Endpoints
| Method | Endpoint | Description | Auth Required |
|---|---|---|---|
GET |
/api/user/profile |
Get user profile | β |
PUT |
/api/user/profile |
Update user profile | β |
POST |
/api/user/ride/request |
Create new ride request | β |
GET |
/api/user/bookings |
Get user's booking history | β |
PUT |
/api/user/bookings/:id/cancel |
Cancel a booking | β |
Example: Request Ride
curl -X POST http://localhost:8888/api/user/ride/request \
-H "Authorization: Bearer <token>" \
-H "Content-Type: application/json" \
-d '{
"pickupLocation": {"lat": 28.6139, "lng": 77.2090, "address": "Connaught Place"},
"dropoffLocation": {"lat": 28.5355, "lng": 77.3910, "address": "Noida Sector 62"},
"wantPooling": true
}'Driver Endpoints
| Method | Endpoint | Description | Auth Required |
|---|---|---|---|
GET |
/api/driver/profile |
Get driver profile | β (Driver) |
PUT |
/api/driver/profile |
Update driver profile | β (Driver) |
PUT |
/api/driver/location |
Update current location | β (Driver) |
PUT |
/api/driver/availability |
Toggle availability | β (Driver) |
GET |
/api/driver/rides |
Get driver's ride history | β (Driver) |
PUT |
/api/driver/rides/:id/accept |
Accept a ride request | β (Driver) |
PUT |
/api/driver/rides/:id/complete |
Mark ride as completed | β (Driver) |
Ride Management
| Method | Endpoint | Description | Auth Required |
|---|---|---|---|
GET |
/api/rides/available-pools |
Get available pooling rides | β |
GET |
/api/rides/:id |
Get ride details | β |
PUT |
/api/rides/:id/status |
Update ride status | β |
POST |
/api/rides/:id/join |
Join a pooled ride | β |
Admin Endpoints
| Method | Endpoint | Description | Auth Required |
|---|---|---|---|
GET |
/api/admin/dashboard |
Get dashboard statistics | β (Admin) |
GET |
/api/admin/users |
Get all users | β (Admin) |
GET |
/api/admin/drivers |
Get all drivers | β (Admin) |
GET |
/api/admin/rides |
Get all rides | β (Admin) |
PUT |
/api/admin/users/:id |
Update user status | β (Admin) |
DELETE |
/api/admin/users/:id |
Delete user | β (Admin) |
Example: Get Admin Dashboard
curl -X GET http://localhost:8888/api/admin/dashboard \
-H "Authorization: Bearer <admin-token>"WebSocket Events
Client β Server Events:
| Event | Payload | Description |
|---|---|---|
connect |
{ userId, role } |
Establish WebSocket connection |
driver:location |
{ driverId, lat, lng } |
Driver location update |
driver:availability |
{ driverId, isAvailable } |
Driver availability toggle |
Server β Client Events:
| Event | Payload | Description |
|---|---|---|
ride:matched |
{ rideId, driverId, pickupETA } |
Ride matched with driver |
ride:status |
{ rideId, status, message } |
Ride status update |
driver:location:update |
{ driverId, lat, lng, timestamp } |
Real-time driver location |
booking:confirmed |
{ bookingId, rideId, fare } |
Booking confirmation |
Example: WebSocket Client (JavaScript)
import io from 'socket.io-client';
const socket = io('http://localhost:8888', {
auth: { token: 'your-jwt-token' }
});
// Listen for ride status updates
socket.on('ride:status', (data) => {
console.log('Ride status:', data.status);
});
// Send driver location update
socket.emit('driver:location', {
driverId: 'driver123',
lat: 28.6139,
lng: 77.2090
});API Response Format
All API responses follow this standard format:
Success Response:
{
"success": true,
"message": "Operation successful",
"data": { /* response data */ }
}Error Response:
{
"success": false,
"error": "Error message",
"details": { /* optional error details */ }
}Rate Limiting
- Default: 100 requests per minute per IP
- Authenticated: 500 requests per minute per user
- Admin: Unlimited
For complete API documentation with interactive examples, visit: http://localhost:8888/docs (FastAPI Swagger UI)
β¨ Features
π For Riders
- Easy Booking β Simple interface to request rides with pickup/dropoff selection
- Ride Pooling β Share rides with others heading in the same direction for reduced fares
- Live Tracking β Real-time driver location on interactive maps
- Fare Estimates β Transparent pricing before booking
- Ride History β Complete record of all past trips
- Driver Ratings β Rate drivers after each trip
- Instant Notifications β Real-time alerts for ride status updates
π For Drivers
- Flexible Availability β Toggle online/offline status anytime
- Smart Ride Matching β Receive ride requests based on your location and route
- Route Optimization β Efficient routing for pooled rides with minimal detours
- Earnings Tracking β Monitor your income and trip statistics
- Rating System β Build reputation through customer feedback
- Profile Management β Update vehicle details and documentation
- Real-Time Communication β Instant updates on ride status and passenger information
π¨βπΌ For Admins
- Comprehensive Dashboard β Real-time metrics on platform activity
- User Management β View, edit, and manage rider and driver accounts
- Ride Monitoring β Track all active and completed rides
- Revenue Analytics β Detailed financial reports and insights
- Driver Verification β Approve/reject driver registrations
- Support Tools β Handle disputes and customer support requests
- Platform Analytics β Insights into peak hours, popular routes, and user behavior
π§ Technical Features
- JWT Authentication β Secure token-based user authentication
- Role-Based Access Control β Different permissions for riders, drivers, and admins
- WebSocket Integration β Real-time bidirectional communication
- Responsive Design β Mobile-first approach that works on all devices
- RESTful API β Clean, well-documented API endpoints
- MongoDB Database β Scalable NoSQL database for flexible data modeling
- Leaflet Maps β Interactive map visualization with markers and routing
- Type-Safe Frontend β TypeScript for enhanced code quality and developer experience
π Folder Structure
Comprehensive overview of the project structure:
RidePool-STRPS/
βββ backend/ # Backend API (FastAPI + Socket.IO)
β βββ app/
β β βββ __init__.py
β β βββ main.py # FastAPI entry point with Socket.IO integration
β β βββ config.py # Configuration management
β β β
β β βββ models/ # Pydantic models & DB schemas
β β β βββ __init__.py
β β β βββ user.py # User model (UserCreate, UserLogin, UserUpdate)
β β β βββ driver.py # Driver model (DriverCreate, DriverUpdate)
β β β βββ booking.py # Booking model (BookingCreate)
β β β βββ ride.py # Ride model (RideCreate, RideUpdate)
β β β βββ feedback.py # Feedback model (FeedbackCreate)
β β β
β β βββ routes/ # API endpoints
β β β βββ __init__.py
β β β βββ auth.py # Authentication routes (/api/auth/*)
β β β βββ user.py # User/Rider routes (/api/user/*)
β β β βββ driver.py # Driver routes (/api/driver/*)
β β β βββ ride.py # Ride management routes (/api/rides/*)
β β β βββ admin.py # Admin routes (/api/admin/*)
β β β
β β βββ services/ # Business logic
β β β βββ auth_service.py # User registration, login, profile updates
β β β βββ ride_matching.py # Ride matching algorithms
β β β βββ payment_service.py # Fare calculation and payment logic
β β β
β β βββ utils/ # Helper functions
β β β βββ database.py # MongoDB connection and helpers
β β β βββ jwt_handler.py # JWT token generation and validation
β β β
β β βββ websocket/ # WebSocket handlers
β β βββ __init__.py
β β βββ socket_handler.py # Socket.IO event handlers
β β
β βββ seed_data/ # Sample data loaders
β β βββ seed.py # MongoDB seeding script
β β
β βββ .env # Environment variables (not committed)
β βββ requirements.txt # Python dependencies
β βββ run_commands.txt # Quick reference commands
β
βββ src/ # Frontend React application
β βββ assets/ # Images, icons, styles
β β βββ images/ # Image assets
β β βββ styles/ # Global CSS/SCSS files
β β
β βββ components/ # React components
β β βββ common/ # Shared/reusable components
β β β βββ Navbar.tsx # Navigation bar
β β β βββ Footer.tsx # Footer component
β β β βββ Map.tsx # Leaflet map wrapper
β β β βββ LoadingSpinner.tsx # Loading indicator
β β β
β β βββ user/ # Rider-specific components
β β β βββ BookingForm.tsx # Ride booking form
β β β βββ RideTracker.tsx # Live ride tracking
β β β βββ RideHistory.tsx # Past rides list
β β β
β β βββ driver/ # Driver-specific components
β β β βββ DriverDashboard.tsx # Driver main dashboard
β β β βββ RideRequests.tsx # Available ride requests
β β β βββ ActiveRides.tsx # Ongoing rides
β β β
β β βββ admin/ # Admin dashboard components
β β βββ AdminDashboard.tsx # Admin overview
β β βββ UserManagement.tsx # User management panel
β β βββ DriverManagement.tsx # Driver management panel
β β βββ Analytics.tsx # Platform analytics
β β
β βββ context/ # React Context providers
β β βββ AuthContext.tsx # Authentication state management
β β βββ RideContext.tsx # Ride/booking state management
β β
β βββ pages/ # Route-level pages
β β βββ Landing/
β β β βββ LandingPage.tsx # Landing page
β β βββ Login/
β β β βββ Login.tsx # Login page
β β βββ Register/
β β β βββ Register.tsx # Registration page
β β βββ user/ # Rider pages (not shown in detail)
β β βββ driver/ # Driver pages (not shown in detail)
β β βββ admin/ # Admin pages (not shown in detail)
β β
β βββ services/ # API clients
β β βββ api.ts # Axios instance configuration
β β βββ socket.ts # Socket.IO client setup
β β
β βββ types/ # TypeScript definitions
β β βββ user.ts # User-related types
β β βββ ride.ts # Ride-related types
β β βββ booking.ts # Booking-related types
β β
β βββ utils/ # Utility functions
β β βββ formatters.ts # Data formatting helpers
β β βββ validators.ts # Form validation utilities
β β
β βββ data/ # Static data/constants
β βββ App.tsx # Main App component with routing
β βββ App.css # App-level styles
β βββ main.tsx # React entry point
β βββ index.css # Global styles
β
βββ public/ # Static assets served by Vite
β βββ favicon.ico
β βββ vite.svg
β
βββ docs/ # Documentation
β βββ API.md # API documentation
β βββ SETUP.md # Setup instructions
β βββ DEPLOYMENT.md # Deployment guide
β
βββ .github/ # GitHub workflows and templates
β βββ workflows/ # GitHub Actions
β βββ ISSUE_TEMPLATE/ # Issue templates
β
βββ .env # Frontend environment variables (not committed)
βββ .env.example # Example environment file
βββ .gitignore # Git ignore rules
βββ package.json # Node.js dependencies
βββ package-lock.json # Locked dependency versions
βββ vite.config.ts # Vite configuration
βββ tsconfig.json # TypeScript configuration (base)
βββ tsconfig.app.json # TypeScript config for app
βββ tsconfig.node.json # TypeScript config for Node.js
βββ eslint.config.js # ESLint configuration
βββ index.html # HTML entry point
β
βββ README.md # This file
βββ CONTRIBUTING.md # Contribution guidelines
βββ CODE_OF_CONDUCT.md # Community standards
βββ SECURITY.md # Security policies
βββ LICENSE # MIT License
π Deployment
Frontend Deployment (Vercel)
- Push to GitHub β Ensure your code is pushed to GitHub
- Connect to Vercel
# Install Vercel CLI npm i -g vercel # Login and deploy vercel login vercel --prod
- Configure Environment Variables in Vercel dashboard:
VITE_API_URLβ Your production backend URLVITE_WS_URLβ Your production WebSocket URL
- Build Settings:
- Build Command:
npm run build - Output Directory:
dist - Install Command:
npm install
- Build Command:
Live Demo: https://ride-pool-strps.vercel.app
Backend Deployment (Railway/Render)
Option 1: Railway
- Create New Project on Railway
- Connect GitHub Repository
- Add Environment Variables:
MONGODB_URI=mongodb+srv://... JWT_SECRET=your-production-secret CORS_ORIGINS=https://ride-pool-strps.vercel.app
- Configure Start Command:
cd backend && pip install -r requirements.txt && uvicorn app.main:socket_app --host 0.0.0.0 --port $PORT
- Deploy β Railway will auto-deploy on push
Option 2: Render
- Create Web Service on Render
- Settings:
- Environment:
Python 3 - Build Command:
cd backend && pip install -r requirements.txt - Start Command:
cd backend && uvicorn app.main:socket_app --host 0.0.0.0 --port $PORT
- Environment:
- Add Environment Variables (same as Railway)
- Deploy
Database Deployment (MongoDB Atlas)
- Create Cluster on MongoDB Atlas
- Whitelist IPs or allow access from anywhere (
0.0.0.0/0) - Create Database User
- Get Connection String:
mongodb+srv://username:password@cluster.mongodb.net/ridepool?retryWrites=true&w=majority - Update
MONGODB_URIin backend environment variables - (Optional) Seed Data:
# Update MONGODB_URI in backend/.env to Atlas URI python backend/seed_data/seed.py
Post-Deployment Checklist
- β Test authentication flow (register, login)
- β Verify WebSocket connection (check browser console)
- β Test ride booking and matching
- β Check CORS settings (ensure frontend can access backend)
- β Monitor logs for errors
- β Set up domain (optional)
- β Enable HTTPS for secure WebSocket connections
π§ Development Workflow
Setting Up Development Environment
- Clone and Install (see Quick Start)
- Run Both Servers Concurrently:
# Terminal 1 - Frontend npm run dev # Terminal 2 - Backend cd backend source venv/bin/activate # or venv\Scripts\activate on Windows uvicorn app.main:socket_app --reload --port 8888
- Hot Reload β Both Vite and Uvicorn support hot reloading
Code Formatting and Linting
Frontend:
# Run ESLint
npm run lint
# Fix auto-fixable issues
npm run lint -- --fix
# Type checking
npx tsc --noEmitBackend:
# Format with Black (if configured)
black backend/app
# Type checking with mypy (if configured)
mypy backend/appGit Workflow
- Create Feature Branch
git checkout -b feature/your-feature-name
- Make Changes β Keep commits small and focused
- Commit with Meaningful Messages
git add . git commit -m "feat: add ride pooling algorithm"
- Push to Remote
git push origin feature/your-feature-name
- Create Pull Request on GitHub
Pull Request Process
- Ensure Code Quality:
- β All linting passes
- β TypeScript compiles without errors
- β No console errors in browser
- Write Clear PR Description:
- What does this PR do?
- Why is this change needed?
- How to test?
- Link Related Issues: Use
Fixes #123orCloses #456 - Request Review from maintainers
- Address Feedback and update PR
- Merge after approval
Testing (if configured)
# Frontend tests
npm run test
# Backend tests
cd backend
pytestπ Troubleshooting
MongoDB Connection Errors
Problem: MongoServerError: connect ECONNREFUSED
Solutions:
- β
Ensure MongoDB is running:
mongodor start MongoDB service - β
Check
MONGODB_URIin backend.envfile - β Verify MongoDB is listening on correct port (default: 27017)
- β For Atlas: Check network access whitelist and credentials
CORS Issues
Problem: Access to XMLHttpRequest blocked by CORS policy
Solutions:
- β
Add frontend URL to
CORS_ORIGINSin backend.env:CORS_ORIGINS=http://localhost:5173,http://localhost:3000
- β
Restart backend server after changing
.env - β Check that backend is running on expected port (8888)
WebSocket Connection Problems
Problem: WebSocket not connecting or disconnecting frequently
Solutions:
- β
Verify
VITE_WS_URLin frontend.envmatches backend URL - β Check browser console for WebSocket errors
- β
Ensure backend Socket.IO is properly configured in
app/main.py - β
For production: Use
wss://(secure WebSocket) instead ofws:// - β Check firewall/proxy settings blocking WebSocket connections
Port Conflicts
Problem: Error: listen EADDRINUSE: address already in use
Solutions:
- β
Frontend (5173):
# Use different port npm run dev -- --port 3000 - β
Backend (8888):
# Use different port uvicorn app.main:socket_app --port 8889 - β
Kill existing process:
# On macOS/Linux lsof -ti:5173 | xargs kill -9 # On Windows netstat -ano | findstr :5173 taskkill /PID <PID> /F
JWT Token Issues
Problem: 401 Unauthorized or Invalid token
Solutions:
- β Clear browser localStorage and login again
- β
Check token expiration time (
ACCESS_TOKEN_EXPIRE_MINUTES) - β
Verify
JWT_SECRETis set in backend.env - β
Ensure
Authorization: Bearer <token>header is sent correctly
Build Failures
Problem: npm run build fails
Solutions:
- β
Delete
node_modulesand reinstall:rm -rf node_modules package-lock.json npm install
- β
Check for TypeScript errors:
npx tsc --noEmit - β Ensure all environment variables are set (even for build)
Python Virtual Environment Issues
Problem: command not found: uvicorn or import errors
Solutions:
- β
Activate virtual environment:
source venv/bin/activate # macOS/Linux venv\Scripts\activate # Windows
- β
Reinstall dependencies:
pip install -r requirements.txt
- β
Verify Python version:
python --version(should be 3.10+)
Map Not Displaying
Problem: Leaflet map not rendering
Solutions:
- β
Include Leaflet CSS in
index.htmlor import in component:import 'leaflet/dist/leaflet.css';
- β Check browser console for Leaflet errors
- β Verify map container has defined height in CSS
Still Having Issues?
- π Check the Documentation
- π Open an Issue
- π¬ Start a Discussion
π€ Contributing
See CONTRIBUTING.md for setup, coding standards, and pull request guidance.
π License
Distributed under the MIT License.
π‘ Security
Security guidelines and reporting instructions are available in SECURITY.md.
π Code of Conduct
Participation in this project is governed by the CODE_OF_CONDUCT.md.
π Tech Stack
Languages
Frameworks & Libraries
Databases
DevOps / CI / Tools
Cloud / Hosting
π¦ Dependencies & Packages
Made with β€ by H0NEYP0T-466