/Cherry-Rooms-front-end

Cherry Rooms is a full-stack ROR/React project designed for the purpose of booking rooms in hotels, motels, or any other accommodation service. This project provides an intuitive and user-friendly interface that allows users to easily browse and reserve rooms based on their preferences and availability. The project is built using React, HTML, CSS,

Primary LanguageJavaScript

CHERRY ROOMS FRONT END 🎨

📗 Table of Contents

📖 Cherry Rooms

Cherry Rooms is a front-end React project designed for the purpose of booking rooms in hotels, motels, or any other accommodation service. This project provides an intuitive and user-friendly interface that allows users to easily browse and reserve rooms based on their preferences and availability. The project is built using React, HTML, CSS, and JavaScript, with the use of APIs to fetch data from the backend.

Screenshot from 2023-03-09 16-22-37

Cherry Rooms Backend ⚙️

Kanban Board 🖧

image

🛠 Built With

Tech Stack

Client
State Managment
UI libraries
  • React Icons
  • Tailwind CSS

Key Features

  • USER SIGNUP
  • USER SIGNIN
  • USER LOGOUT
  • CREATE A ROOM
  • DISPLAY LIST OF ROOMS
  • DELETE A ROOM
  • CREATE A RESERVATION
  • DISPLAY LIST OF RESERVATIONS
  • DELETE A RESERVATION

(back to top)

🚀 Live Demo

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

Prerequisites

In order to run this project you need:

  1. Node.js: React is built on top of Node.js, Therefore, you need to have Node.js installed on your machine.

  2. Text Editor: You will need a text editor to write your React code. such as Visual Studio Code, Atom, and Sublime Text.

  3. Web Browser: You will need a web browser to view your React app. such as Google Chrome, Firefox, and Safari.

  4. Command Line Interface (CLI): You will need a CLI to run commands for installing dependencies and running your React app. The most commonly used CLI for React development is the Node Package Manager (npm).

Setup

Clone this repository to your desired folder:

  cd my-folder
  git clone git@github.com:adel-gu/Cherry-Rooms-front-end.git

Install

Install this project with:

  cd Cherry-Rooms-front-end
  npm install

Usage

To run the project, execute the following command:

  npm start

Run tests

To run tests, run the following command:

  npm test

Deployment

You can deploy this project using:

(back to top)

👥 Authors

👤 Adel Guitoun

👤 Zuhaib Amjad

👤 Aminu Rabiu

👤 Joel Kugonza

(back to top)

🔭 Future Features

  • Adding UI loaders: When the App makes a fetch request to the backend the loaders will fill that delay for getting the response.
  • Allow the user to edit the room image
  • Allow the user to edit his avatar

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you like this project, kindly give it a star 🥇

(back to top)

🙏 Acknowledgments

  • I would like to thank microverseinc since the project requirement as well as the project design is inspired and provided by Microverse.
  • Huge thanks to Murat Korkmaz since the APP UI is inspired from his design.

(back to top)

❓ FAQ

  • When I signup or login to the app it take a some while!?

    • Retrieving data from a backend can take time, especially if the app is on a free plan that may have limitations on server resources. so Kindly be patient then you will start getting some result.

  • How can I add my avatar image?

    • To be able to add you avatar you need to provide an online link for your image.

(back to top)

📝 License

This project is MIT licensed.

(back to top)