QuickRide is a feature-rich project built using modern web technologies. It replicates the core features and functionalities of the existing ride booking platforms, including user authentication, ride booking, real-time location tracking, fare calculation and real-time communication. The application features a clean and responsive user interface, ensuring an intuitive user experience. Designed as a learning and portfolio project, it showcases skills in frontend and backend development, API integration, and real-time features.
⭐ If you found this project helpful or interesting, please consider giving it a star on GitHub! It helps others discover the project and keeps me motivated to improve it. ⭐
| Category | Technologies / Tools |
|---|---|
| Frontend | HTML, CSS, React.js, Tailwind CSS, Google Maps |
| Backend | Node.js, Express.js, MongoDB, Socket IO, NodeMailer, Google Maps APIs |
| Authentication | JWT (JSON Web Token), bcrypt |
| Deployment | Vercel, Render |
| Dev Tools | Postman, npm, Nodemon, ESLint, Custom Logger |
- Secure email/password login with full form validation
- Email verification and logout functionality
- Forgot and change password support
- Role-based access control (User and Captain)
- Session handling and route protection (unauthorized access is blocked)
- Edit personal profile details (name, email, phone)
- Ride history tracking
- Form validation for all user inputs
- Pickup and destination selection with address auto-complete
- Real-time location tracking on interactive maps
- Route visualization with distance and estimated time calculation
- Supports multiple ride types: Car, Bike, and Auto
- Live ride status updates: Pending, Accepted, Ongoing, Completed, Cancelled
- Concurrency control: A ride request can only be accepted by one captain
- Automatic ride cancellation after timeout
- Accurate fare estimation based on distance and time
- Socket-based updates for ride status and live locations
- Real-time in-app chat between rider and captain
- Chat messages are stored in the database with timestamps
- Access control ensures only assigned rider and captain can view the conversation
- Accept or reject incoming ride requests
- Real-time updates for trip progress
- Role-specific access to ride-related actions
- Custom logger to persist frontend and backend logs in the database
- Force reset feature to clear all local app data and recover from unstable states
- Popup alert system for immediate feedback (success, error, warning)
Authentication
Sidebar Navigation
User Module
Captain Module
📂 Backend // Node.js + Express server
📂 Frontend // React.js application
git clone https://github.com/asif-khan-2k19/QuickRide.git
cd QuickRidecd Frontend
npm installcd ../Backend
npm installnpm run devnpm run dev- Frontend: http://localhost:5173
- Backend: http://localhost:3000
Create .env files in both Frontend/ and Backend/ directories.
.env.example files are already present in the folders.
VITE_SERVER_URL=http://localhost:3000
VITE_ENVIRONMENT=development
VITE_RIDE_TIMEOUT=90000PORT=3000
RELOAD_INTERVAL = 10
SERVER_URL=http://localhost:3000
CLIENT_URL=http://localhost:5173
ENVIRONMENT=development
MONGODB_PROD_URL=<your-mongodb-atlas-url>
MONGODB_DEV_URL=mongodb://127.0.0.1:27017/quickRide
JWT_SECRET=<your-jwt-secret>
GOOGLE_MAPS_API=<your-google-maps-api-key>
MAIL_USER=<your-gmail-id>
MAIL_PASS=<your-app-password>We welcome community contributions! To contribute:
- Star this repository
- Fork this repository
- Create a new branch (
git checkout -b feature/YourFeature) - Commit your changes (
git commit -m 'Add your feature description...') - Push to the branch (
git push origin feature/YourFeature) - Create a Pull Request
This project is licensed under the MIT License.
Ready to contribute? Let’s build something amazing together.