uday510 / hotel-booking-frontend

Hotel Booking Frontend

Overview

The Hotel Booking Frontend is a user-friendly interface designed to interact with the Hotel Booking Backend. This React web application is served locally on localhost:3000 during development.

Quick Start

1. Clone the Repository:

   git clone https://github.com/uday510/hotel-booking-frontend.git

2. Navigate to the Project Directory:

   cd hotel-booking-frontend

3. Install Dependencies:

   npm install

4. Start the Application:

   npm start

Endpoints & Features

• Login or Signup:

  • Access the login or signup page at localhost:3000.

• Browse Hotels:

  • Explore available hotels at localhost:3000/browse.

• Booking History:

  • View your booking history at localhost:3000/booking-history.

• Book a Hotel:

  • Book a hotel room at localhost:3000/book-hotel.

Features

1. User Authentication:

   • Secure login and registration functionality.

2. Intuitive UI:

   • User-friendly interface for easy navigation.

3. Hotel Listings:

   • Browse available hotels with detailed information.

4. Booking Management:

   • View and manage hotel room bookings.

5. Responsive Design:

   • Ensures a consistent experience across devices.

Technology Stack

1. Frontend Framework:

   • Built using React.

2. State Management:

   • Utilizes Redux Toolkit for efficient state management.

3. Styling:

   • Styled with Tailwind CSS.

Project Structure

• public: Contains static assets, including the HTML file and other assets directly copied into the build output.

• src: The main source code of your React application. Components, styles, and application logic reside here.

• node_modules: Directory containing project dependencies installed by npm.

• package.json: Metadata about the project, including dependencies and scripts.

• package-lock.json: Generated by npm to lock down the versions of dependencies.

• LICENSE: The license file specifying the terms under which others can use, copy, distribute, or modify your software.

• README.md: Main documentation file for the project.

• README.old.md: Older version of the README file.

Scripts

1. start:

   • react-scripts start: Start the development server.

2. build:

   • react-scripts build: Build the production-ready application.

3. test:

   • npm test: Run tests using the test runner.

   # Run tests
   npm test