https://github.com/vicky-peace/vehicle-client--repo

A car rental website that helps customers to book vehicles based on their choice then preferences and allows them to view their bookings
https://github.com/vicky-peace/vehicle-client--repo

cloudinary daisyui material-ui react tailwind typescript

Last synced: about 2 months ago
JSON representation

A car rental website that helps customers to book vehicles based on their choice then preferences and allows them to view their bookings

• Host: GitHub
• URL: https://github.com/vicky-peace/vehicle-client--repo
• Owner: Vicky-peace
• Created: 2024-07-07T10:11:10.000Z (6 months ago)
• Default Branch: main
• Last Pushed: 2024-07-24T17:58:36.000Z (6 months ago)
• Last Synced: 2024-07-25T14:08:02.768Z (6 months ago)
• Topics: cloudinary, daisyui, material-ui, react, tailwind, typescript
• Language: TypeScript
• Homepage: https://white-sky-095ea8f03.5.azurestaticapps.net/
• Size: 2.59 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# CarHub Booking Website - Client Side

## Overview

CarHub is a vehicle booking platform that allows users to browse, book, and manage vehicle rentals. This README provides an overview of the client-side architecture and features of the CarHub booking website, including details about the technologies used, key components, and how to get started.

## Technologies Used

- **React**: A JavaScript library for building user interfaces.

- **Redux**: State management library for managing application state.

- **RTK Query**: Data fetching and caching tool for Redux.

- **Tailwind CSS**: Utility-first CSS framework for styling.

- **Material-UI**: React components library for a modern UI.

- **Stripe**: Payment processing platform.

- **Day.js**: Lightweight date library for handling date and time.

- **React-Toastify**: Library for displaying toast notifications.

- **Vite**: Fast build tool for modern web projects.

## Project Structure

### Key Components

- **`UserDashboard`**: The main dashboard for authenticated users. Includes:

  - `Sidenav`: Navigation component for accessing different parts of the dashboard.

  - `Navbar`: Header component for user interactions and site navigation.

- **`BookingForm`**: Component for creating vehicle bookings. Allows users to select start and end dates, choose a pickup location, and initiate payment through Stripe.

- **`ManageUsers`**: Component for managing users. Displays user profiles and allows administrators to disable users.

### APIs

- **Bookings API**: Handles booking creation and management.

- **Locations API**: Provides location data for vehicle pickups.

- **Payments API**: Manages payment transactions via Stripe.

- **Users API**: Manages user data and operations.

### Components Breakdown

- **`BookingForm`**

  - **State Management**: Manages booking details (start date, end date, location) and handles payment initiation.

  - **Date Handling**: Uses Day.js for date calculations.

  - **Stripe Integration**: Facilitates payment processing and redirects users to the Stripe checkout page.

- **`ManageUsers`**

  - **User Management**: Displays user profiles in a card layout, showing details like name, email, contact, and address.

  - **Delete User**: Provides functionality for administrators to disable users.

## Getting Started

### Prerequisites

- Node.js and pnpm (or Yarn) installed on your machine.

- Access to environment variables for API keys and endpoints.

### Installation

1. **Clone the Repository**

   ```bash

   git clone https://github.com/Vicky-peace/vehicle-client--repo.git

   cd carhub-client