Skip to content

Unleash your wanderlust with ReactJS Airbnb clone. Browse, book, and embark on adventures worldwide—all in one seamless platform.

Notifications You must be signed in to change notification settings

longphanquangminh/airbnb-frontend-clone-leader

 
 

Repository files navigation

Airbnb Clone Project – BCS08 Final Project

Github profile NPM Version

This project is a clone of Airbnb, a popular online marketplace for lodging, primarily homestays for vacation rentals, and tourism activities. The goal of this project is to replicate key features and functionalities of the Airbnb platform.

Features

  • User authentication (Sign up, Login, Logout)
  • Property listing and details
  • Booking and reservation system
  • User profiles
  • Search functionality
  • Reviews and ratings
  • Responsive design for various devices

How to Use

Welcome to our Airbnb clone! Follow these simple steps to explore and book amazing properties:

1. Visit Our Website

Navigate to our website at https://bcs08g5-room-rental-service.vercel.app.

2. Explore Listings

Browse through our wide range of available properties. Click on a listing to view more details.

3. Sign Up

To book a property or save your favorites, sign up for an account. Click on "Sign Up" and follow the registration process.

4. Book Your Stay

Once logged in, select your desired dates and click on "Book Now" for the property you want to stay in.

5. Enjoy Your Stay!

Congratulations! You've successfully booked your stay. Pack your bags and get ready for a fantastic experience!

Need Help?

If you encounter any issues or have questions, our support team is ready to assist you. Contact us via GitHub or Facebook.

We hope you have a wonderful time using our Airbnb clone!

Technologies and Tools used 👀

  • Included in the learning curriculum:

    • React.js
    • React Router v6
    • Redux
    • HTML5, CSS3, JavaScript
    • CSS Framework: Tailwind CSS
    • Axios API
    • Postman
    • Swagger
    • Ant Design
    • Editor: VS Code, AstroNvim
    • Version control: GitHub
  • Others (self-search externally):

    • Vite
    • Chart.js
    • Alpine.js
    • AOS
    • Swiper
    • LightGallery
    • ViewerJS
    • ProComponents
    • CKEditor 5 (experiment)
    • Vercel (for deployment)
  • In the future, the team will explore and utilize additional technologies such as NestJS, SocketIO, and Stripe to enhance both the business functionality and user experience of this web app.

Installation

  1. Clone the repository: git clone https://github.com/bcs08-group5-airbnb/airbnb-frontend.git
  2. Navigate to the project directory: cd airbnb-frontend
  3. Install dependencies: npm install
  4. Run npm run dev (not npm start) to enjoy our website

Configuration

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

  2. Add the following environment variables:

    VITE_TOKEN_CYBERSOFT=your_cybersoft_course_token_(not_expired)
    VITE_MAP_API_KEY=your_basic_map_api_key_(contact_us_if_needed)

Useful Links

🌟 Swagger API: https://airbnbnew.cybersoft.edu.vn/swagger/index.html

🌟 Youtube preview: https://youtu.be/3BGVBrY6QCg?si=KXtkh0dYe0sQzOWE

🌟 You can also view our Airbnb back-end project: https://github.com/vohaiphuc/cybersoft-be-airbnb

This project is developed and contributed by Long Phan and Huỳnh Quí

About

Unleash your wanderlust with ReactJS Airbnb clone. Browse, book, and embark on adventures worldwide—all in one seamless platform.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 99.3%
  • Other 0.7%