🚗 Car Wash Booking System

Introduction

The Car Wash Booking System is a user-friendly web application designed to simplify the car wash booking process. With an intuitive interface, users can easily book car wash services, manage their bookings, and access detailed service information. The system also provides an admin dashboard for managing services, slots, and users.

Project Description

This project aims to provide a seamless booking experience for car wash services. It includes functionalities for user authentication, service management, booking slots, and more. The system is designed to be responsive and accessible across various devices, ensuring a smooth experience for both users and administrators.

Features

🏠 Home Page:

Navigation Menu: Links to key pages such as Services, Booking, Login. Hero Section: Branding message with visuals. Featured Services: Display of popular services. Review Section: User feedback and rating system. Login Overlay: Conditional display for unauthenticated users.

🔐 User Authentication Pages:

Sign Up Page: User registration with role assignment. Login Page: Secure login functionality.

🛠️ Services Page:

List of all services with search, filter, and sort options.

📋 Service Details Page:

Detailed service information. Availability of time slots for booking.

📅 Booking Page:

Display of selected service and time slot. User information form and payment processing.

🚫 Error Pages:

Custom 404 page with navigation options.

👨‍💼 Admin Pages:

Admin Dashboard: Overview of bookings, user management, slot management, and service management. Service Management: Add, update, and delete services. Slot Management: Create, manage, and toggle slot statuses. User Management: View and edit user roles.

👤 User Pages:

User Dashboard: Overview of bookings and account information. Service Slot Countdown: Countdown timer for upcoming bookings.

🎁 Bonus Features:

1. Service Comparison: Compare multiple services side by side.
2. Scroll to Top Button: Quick return to the top of the page.
3. UI/UX Improvements: Enhanced user interface and experience.

Technology Stack

1. Frontend: React, Ant Design, TypeScript
2. Backend: [Specify backend technology if known]
3. Database: [Specify database technology if known]
4. Payment Processing: AAMARPAY

Installation Guideline

1. Prerequisites
2. Node.js and npm installed.
3. [Backend server] up and running (if applicable).

Installation Steps

1. 🔄 Clone the Repository:

git clone https://github.com/yourusername/car-wash-booking-system.git
cd car-wash-booking-system

2. 📦 Install Dependencies:

npm install

3. 🔧 Configuration:

   1. Create a .env file in the root directory.

   2. Add necessary configuration variables:

  PORT=3000
DB_URL=your_db_connection_uri
API_KEY=your_api_key_here

4. 🚀 Start the Development Server:

  npm run start:dev

Usage

1. 🏠 Home Page: Navigate through the site, explore services, and access the booking system.
2. 🔐 User Authentication: Register and log in to access personalized features.
3. 👨‍💼 Admin Dashboard: Manage services, slots, and users.
4. 📅 Booking: Select services and time slots, complete the booking and payment process.

🌐 Live Link

. Check out the live demo of the project here: Live Link

GitHub Contributions

1. Ensure a well-documented GitHub repository with a minimum of 15 commits.
2. Each commit should represent meaningful progress, such as feature implementation, bug fixes, or UI enhancements.

Deliverables

1. Fully functional frontend application integrated with the backend.
2. Responsive design for all pages.
3. User and Admin dashboards with described features.
4. Complete backend integration.
5. Clean, well-organized, and documented code.
6. Creative solutions to integration challenges.

Made with ❤️ by KAMRUL