Skip to content

Khalid-debugg/My-Dream-Place

Repository files navigation

Contributors Forks Stargazers Issues LinkedIn


Logo

My Dream Place

Where Fantasies Find a Home: My Dream Place - Your Gateway to Luxury Living.
Explore the docs »

View Demo · Report Bug · Request Feature

Table of Contents
  1. About The Project
  2. Getting Started
  3. Usage
  4. Contributing
  5. Contact

About The Project

screenshot

My Dream Place

Welcome to our Hotel Booking Web App! This application is designed to provide users with a seamless and enjoyable experience when searching and booking hotels. Utilizing the Booking.com API, we bring you real-time access to a vast array of hotels worldwide. The intuitive user interface is based on the meticulously crafted design available on Figma, ensuring a visually appealing and user-friendly platform.

Features

  • Search and Discover: Seamlessly search and discover a wide range of hotels based on your preferences, including location, dates, and accommodation types.

  • Detailed Listings: Access detailed information about each hotel, including amenities, pricing, and customer reviews, to make informed decisions.

  • Booking Management: Easily manage your bookings, view reservation details, and make changes as needed.

  • User-Friendly Interface: Our application boasts an intuitive and responsive design, ensuring a smooth experience across various devices.

  • Real-Time Availability: Thanks to the Booking.com API integration, we provide real-time availability and pricing information.

(back to top)

Built With

  • Vue
  • Tailwind
  • Pinia

(back to top)

Getting Started

Installation

  1. Get your API Key for hotels at Booking_API

  2. Get your API Key for Maps at Maps_API

  3. Clone the repo

    git clone https://github.com/khalid-debugg/my-dream-place.git
  4. Install NPM packages

    npm install
  5. Enter your API in config.js

    const config = {
      apiKey: "GENERATE_YOUR_OWN_KEY",
      mapKey: "GENERATE_YOUR_OWN_KEY",
    };

(back to top)

Usage

Search results page

screenshot

In this page you can:

  1. Sort hotels according to sort options derived from the API
  2. Filter hotels by their names
  3. Filter hotels by budget range
  4. Filter hotels by review score

(back to top)

Hotel Details page

screenshot

In this page you can browse the hotel details, and its nearby landmarks, and also browse the hotel rooms and its facilities and Reserve it.

(back to top)

Checkout page

screenshot

In this page you can check the price details and confirm room booking

Trips page

screenshot

In this page you can check your reserved trips with its details

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

(back to top)

Contact

Khalid Sherif - @shefa2130 - [email protected]

Project Link: https://github.com/khalid-debugg/my-dream-place

(back to top)