Ryde: An Uber Clone

Ryde is a feature-rich ride-hailing app built with modern web and mobile technologies. Designed to provide a seamless user experience, Ryde integrates real-time location tracking, secure payments, and responsive design to deliver a platform optimized for both Android and iOS devices.

---

📋 Table of Contents

1. Features
2. Technologies Used
3. Important Links
4. File Structure
5. Getting Started
6. Configuration
7. Acknowledgements
8. License

---

🚀 Features

User Experience

• Onboarding Flow: Seamless user registration and setup process.
• Email Password Authentication with Verification: Secure login with email verification.
• OAuth Using Google: Easy login with Google credentials.

Rides

• Home Screen with Live Location & Google Map: Real-time location tracking with markers on a map.
• Recent Rides: View a list of recent rides at a glance.
• Google Places Autocomplete: Search any place on Earth with autocomplete suggestions.
• Find Rides: Search for rides by entering 'From' and 'To' locations.
• Select Rides from Map: Choose available cars near your location from the map.
• Confirm Ride with Detailed Information: View complete ride details, including time and fare price.
• Create Rides After Successful Payment: Book a ride after confirming payment.

Payments

• Pay for Ride Using Stripe: Secure payments via multiple methods like cards.

User Profile

• Profile Management: Manage account details in the profile screen.
• Ride History: Review all rides booked so far.

Compatibility

• Responsive on Android and iOS: Optimized for both Android and iOS devices.

---

🛠️ Technologies Used

• React Native
• Expo
• Stripe
• PostgreSQL (neon)
• Google Maps
• Zustand
• Clerk
• Tailwind CSS

---

🔗 Important Links

• Eslint and Prettier Setup
• Expo NativeWind Setup
• TypeScript Support for NativeWind
• Serverless NeonDB
• Clerk Auth
• Clerk Expo Quickstart
• Clerk Expo OAuth
• Geoapify Map
• Stripe React Native SDK
• Stripe

---

📂 File Structure

.
├── app
│   ├── (api)
│   │   ├── driver+api.ts
│   │   ├── ride
│   │   │   ├── create+api.ts
│   │   │   └── [id]+api.ts
│   │   ├── (stripe)
│   │   │   ├── create+api.ts
│   │   │   └── pay+api.ts
│   │   └── user+api.ts
│   ├── (auth)
│   │   ├── _layout.tsx
│   │   ├── sign-in.tsx
│   │   ├── sign-up.tsx
│   │   └── welcome.tsx
│   ├── index.tsx
│   ├── _layout.tsx
│   ├── +not-found.tsx
│   └── (root)
│       ├── book-ride.tsx
│       ├── confirm-ride.tsx
│       ├── find-ride.tsx
│       ├── _layout.tsx
│       └── (tabs)
│           ├── chat.tsx
│           ├── home.tsx
│           ├── _layout.tsx
│           ├── profile.tsx
│           └── rides.tsx
├── assets
│   ├── fonts
│   ├── icons
│   └── images
├── components
├── constants
├── lib
├── store
├── scripts
├── types
├── babel.config.js
├── package.json
├── .env
├── tailwind.config.js
└── tsconfig.json

---

🚀 Getting Started

Prerequisites

• Node.js
• npm (or pnpm / yarn)
• Git
• Expo CLI

Installation

1. Clone the repository:

   git clone https://github.com/iamfitsum/ryde.git

2. Navigate to the project directory:

   cd ryde

3. Install dependencies:

   npm install

4. Start the Expo development server:

   expo start

5. Run the app on your device or simulator:

   • Press a for Android
   • Press i for iOS

---

🧩 Configuration

1. Create a .env file in the project root and add the following environment variables:

   EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY=
   
   EXPO_PUBLIC_PLACES_API_KEY=
   EXPO_PUBLIC_DIRECTIONS_API_KEY=
   
   DATABASE_URL=
   
   EXPO_PUBLIC_SERVER_URL=https://ryde.com/
   
   EXPO_PUBLIC_GEOAPIFY_API_KEY=
   
   EXPO_PUBLIC_STRIPE_PUBLISHABLE_KEY=
   STRIPE_SECRET_KEY=

---

🙏 Acknowledgements

• Adrian (JSMastery)

---

📜 License

This project is licensed under the MIT License. See the LICENSE file for details.