{"id":25403166,"url":"https://github.com/harsh-panchal-804/full-stack-uber-clone","last_synced_at":"2026-02-23T07:05:19.718Z","repository":{"id":273091672,"uuid":"915668696","full_name":"harsh-panchal-804/Full-Stack-Uber-Clone","owner":"harsh-panchal-804","description":"A full-stack Uber clone built with the MERN stack featuring real-time location tracking, fare calculation with live traffic, street view, directions, and modern UI. Integrates Socket.IO, Google Maps API, JWT Authentication, and advanced state management using Context API and Zustand.","archived":false,"fork":false,"pushed_at":"2025-03-09T13:09:10.000Z","size":44920,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-06T23:09:57.711Z","etag":null,"topics":["google-maps-api","jwt-authentication","mern-stack","mongodb","real-time","socket-io","uber","zustand"],"latest_commit_sha":null,"homepage":"https://full-stack-uber-clone-axaf-harsh-panchals-projects-245a010d.vercel.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/harsh-panchal-804.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-01-12T13:47:47.000Z","updated_at":"2025-03-09T13:09:13.000Z","dependencies_parsed_at":"2025-01-18T16:37:32.381Z","dependency_job_id":"9301198e-a04a-4073-b514-0266b4f52f8b","html_url":"https://github.com/harsh-panchal-804/Full-Stack-Uber-Clone","commit_stats":null,"previous_names":["harsh-panchal-804/full-stack-uber-clone"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/harsh-panchal-804/Full-Stack-Uber-Clone","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harsh-panchal-804%2FFull-Stack-Uber-Clone","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harsh-panchal-804%2FFull-Stack-Uber-Clone/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harsh-panchal-804%2FFull-Stack-Uber-Clone/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harsh-panchal-804%2FFull-Stack-Uber-Clone/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/harsh-panchal-804","download_url":"https://codeload.github.com/harsh-panchal-804/Full-Stack-Uber-Clone/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/harsh-panchal-804%2FFull-Stack-Uber-Clone/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":270856775,"owners_count":24657700,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-17T02:00:09.016Z","response_time":129,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["google-maps-api","jwt-authentication","mern-stack","mongodb","real-time","socket-io","uber","zustand"],"created_at":"2025-02-16T02:28:10.405Z","updated_at":"2025-10-25T09:17:32.483Z","avatar_url":"https://github.com/harsh-panchal-804.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Uber Clone (MERN Stack)\n\nThis repository contains a full-stack Uber clone application developed using the **[MERN Stack](https://www.mongodb.com/mern-stack)** (**[MongoDB](https://www.mongodb.com/)**, **[Express](https://expressjs.com/)**, **[React](https://react.dev/)**, **[Node.js](https://nodejs.org/)**). It includes advanced features such as real-time location tracking, live traffic-based fare calculation, and a modern UI design.\n\nThe app integrates several technologies like **[Socket.io](https://socket.io/)**, **[Google Maps API](https://developers.google.com/maps/documentation)**, and state management using both **[Context API](https://react.dev/learn/passing-data-deeply-with-context)** and **[Zustand](https://docs.pmnd.rs/zustand/getting-started/introduction)**.\n\n---\n\n## Deployment\n\nThe project is live and accessible at the following link:\n\n🔗 [Deployed Version](https://full-stack-uber-clone-axaf-harsh-panchals-projects-245a010d.vercel.app/)\n## Demo\nWatch the demo -\u003e\n![Demo GIF](demo_video/uber2f.gif)\n\n## Features\n\n- **Real-Time Location Tracking**: Powered by [**Socket.io**](https://socket.io/) to track and share live user and driver locations.\n- **Search and Geocoding**: Integrated with [**Google Maps API**](https://developers.google.com/maps/documentation) for location search and address-to-coordinate conversion.\n- **Distance and Fare Calculation**: Leverages [**Google Maps Distance Matrix API**](https://developers.google.com/maps/documentation/distance-matrix/start) to calculate distances and fares with live traffic.\n- **Street View and Directions**: Provides a [**Street View**](https://developers.google.com/maps/documentation/streetview/start) and route directions from origin to destination using [**Google Maps API**](https://developers.google.com/maps/documentation).\n- **JWT Authentication**: Secures the application with [**JSON Web Tokens (JWT)**](https://jwt.io/) for user authentication.\n- **Debounced Location Search**: Enhances user experience with debounced input for location searches to optimize API calls.\n- **Driver Matching**: Matches riders with the nearest drivers based on **real-time** updates using [**Socket.io**](https://socket.io/).\n- **Modern UI Design**: Incorporates [**Flowbite**](https://flowbite.com/) and [**Tailwind CSS**](https://tailwindcss.com/) for a sleek user interface.\n- **State Management**: Combines [**Context API**](https://react.dev/learn/passing-data-deeply-with-context) and [**Zustand**](https://docs.pmnd.rs/zustand/getting-started/introduction) for effective state handling.\n\n\n---\n## Key Technologies \u0026 Libraries Used\n\n### Backend\n- **Node.js** \u0026 **Express.js**: For building the server-side application.\n- **MongoDB** \u0026 **Mongoose**: For database management and schema modeling.\n- **Socket.IO**: For real-time communication (e.g., live location tracking).\n- **JWT Authentication**: For secure user authentication and session management.\n- **BCrypt**: For hashing passwords securely.\n- **Express Validator**: For backend form validation.\n- **Axios**: For making HTTP requests.\n- **CORS**: For enabling cross-origin requests.\n- **Cookie Parser**: For handling cookies in requests.\n- **Dotenv**: For managing environment variables.\n\n### Frontend\n- **React (Vite)**: For building the client-side application.\n- **React Router DOM**: For navigation and routing.\n- **Socket.IO Client**: For real-time communication with the backend.\n- **@react-google-maps/api**: For integrating Google Maps functionalities.\n- **Navigator.geolocation API** :For getting live location of users.\n- **Axios**: For making API requests.\n- **GSAP**: For creating smooth animations.\n- **Flowbite** \u0026 **Flowbite React**: For UI components.\n- **Tailwind CSS**: For responsive and modern styling.\n- **Zustand**: For state management.\n- **React Hot Toast**: For displaying toast notifications.\n- **RemixIcon**: For using modern icons.\n\n---\n### Prerequisites\n- **Node.js** (v14+)\n- **npm** or **yarn**\n- **MongoDB** (local or cloud instance)\n- **Google Maps API Key**\n\n## Installation Guide\n### Steps\n\n1. **Clone the Repository**\n   ```bash\n   git clone https://github.com/harsh-panchal-804/Full-Stack-Uber-Clone\n   ```\n\n2. **Install Dependencies**\n   ```bash\n   # Install server dependencies\n   cd BackEnd\n   npm install\n\n   # Install client dependencies\n   cd FrontEnd\n   npm install \n   # Apply Patch for Goople Maps\n   npm run postinstall\n   ```\n\n3. **Set Up Environment Variables**\n   Create `.env` files in both the `server` and `client` directories.\n\n   **Server `.env`:**\n   ```env\n    PORT=4000\n    DB_CONNECT=your_mongodb_connection_string\n    JWT_SECRET=your_jwt_secret\n    MAPS_API_KEY=your_google_maps_api_key\n   ```\n   \n   **Client `.env`:**\n   ```env\n    VITE_BASE_URL=http://localhost:4000\n    VITE_GOMAPS_API_KEY=your_google_maps_api_key\n   ```\n   You can get a **Free Google Maps API** from [**Go Maps Pro**](https://app.gomaps.pro/auth/login).\n   Firstly,you have to create a free account on the website.\n   Then you have to navigate to the **API** Section and create a free API Key.\n   Copy the API Key and paste into **.env** files of **both** the **Frontend** and **Backend**.\n   This API Key only provides **500 credit points** and if you exhaust them you can create a new account on the website and start again. \n    \n5. **Run the Application**\n   ```bash\n   # Start the server\n   cd BackEnd\n   npx nodemon\n\n   # Start the client\n   cd FronEnd\n   npm run dev\n   ```\n# Project Structure\n\n## Backend/\n```\nBackend/\n├── contollers/\n├── db/\n│   └── Models/\n├── middlewares/\n├── routes/\n└── services/\n```\n\n## Frontend/\n```\nFrontend/\n├── patches/\n└── src/\n    ├── assets/\n    ├── components/\n    ├── context/\n    ├── hooks/\n    ├── pages/\n    └── store/\n```\n\n## Directory Descriptions\n\n### Backend Directories\n- `controllers/` - Request handlers and business logic\n- `db/` - Database configuration and models\n  - `Models/` - Mongoose schemas and models\n- `middlewares/` - Custom middleware functions\n- `routes/` - API route definitions \n- `services/` - Business logic and external service integrations\n\n### Frontend Directories\n- `patches/` - Custom patches for npm packages\n- `src/` - Source code\n  - `assets/` - Images, fonts and static files\n  - `components/` - Reusable React components\n  - `context/` - React context providers \n  - `hooks/` - Custom React hooks\n  - `pages/` - Page components\n  - `store/` - State management with Zustand\n\n# API Route Structure\n```\nBackend/\n├── /users\n    ├── POST /register\n    ├── POST /login\n    ├── GET /profile\n    └── GET /logout\n├── /captains\n    ├── POST /register\n    ├── POST /login\n    ├── GET /profile\n    └── GET /logout\n├── /rides\n    ├── POST /create\n    ├── GET /get-fare\n    ├── POST /confirm\n    ├── GET /start-ride\n    └── POST /end-ride\n└── /maps\n    ├── GET /get-coordinates\n    ├── GET /get-distance-time\n    └── GET /get-suggestions\n```\nMore information about API routes can be found in **[README.md](./Backend/README.md)** file in the BackEnd folder.\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharsh-panchal-804%2Ffull-stack-uber-clone","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fharsh-panchal-804%2Ffull-stack-uber-clone","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fharsh-panchal-804%2Ffull-stack-uber-clone/lists"}