/Capstone-Front-End

Vacay InnVacay Inn Fullstack capstone project. The app is a room reservation website that allows users to sign up and log in to see detailed information about rooms and create reservations for rooms. The data is stored on a back-end server built with Ruby on Rails and displayed on the front end which is built with React.

Primary LanguageJavaScriptMIT LicenseMIT

Vacay Inn

📗 Table of Contents

Vacay Inn Front-End

🛠 Built With

Tech Stack

Client
Server
Database

Kanban Board

Current state

Kanban Board

Initial State

image


Final Team:

4 members (all mentioned in the authors section)

Key Features

  • Dynamic Navigation Routes: "Vacay Inn" employs a versatile navigation panel that gracefully manages both public routes (rooms, login, and signup) and exclusive private routes, ensuring secure access to tailored content for authenticated users.

  • Effortless User Registration: "Vacay Inn" streamlines the user registration process, making it a breeze for individuals to create an account. Users can effortlessly provide their essential information, which is securely stored within the system. This component seamlessly oversees the user registration journey.

  • Robust User Authentication: The application features a robust authentication system powered by Devise and fortified with JWT tokens. This fortification ensures users can securely log in, granting them access to a world of exclusive features and personalized content.

  • Gateway Home Page: The heart of "Vacay Inn" lies in its inviting home page, serving as the primary entry point for users. It showcases available rooms and their intricacies, offering users a glimpse of the possibilities upon login.

  • Comprehensive Branch Insights: The details component enriches the user experience by providing in-depth information about each hotel branch. This encompasses vivid descriptions, an array of amenities, and transparent pricing details. Users can effortlessly make reservations directly from this informative page.

  • Effortless Reservation Management: Users wield the power of reservation management with ease through the reservation component. It seamlessly presents a comprehensive list of all reservations while affording users the flexibility to delete reservations as per their requirements.

  • Seamless Room Reservations: "Vacay Inn" grants users the freedom to reserve rooms with utmost convenience from their chosen hotel branch. The reservation form component, readily accessible from both the navigation panel and the details page, streamlines this reservation process.

  • Empowering Room Management: Administrators are bestowed with the authority to create and add new hotel branches to the application through the user-friendly "add room" form component. This empowers them to furnish details such as branch names and captivating descriptions.

  • Control Over Content: Administrators possess the capability to manage the content they contribute to the platform, including the ability to delete hotel branches they have added. This feature ensures a dynamic level of control and flexibility.

  • Redux-Driven State Management: "Vacay Inn" harnesses the power of Redux for seamless state management. This strategic utilization facilitates an organized and efficient handling of API interactions, ensuring data consistency throughout the application.

  • Intuitive User Interface: The application is purposefully designed with a user-first approach. Its intuitive interface paves the way for effortless navigation and interaction with the platform's array of features.

  • Adaptive and Responsive Design: "Vacay Inn" prides itself on its adaptive and responsive design, seamlessly adjusting to diverse screen sizes and devices. This unwavering commitment to responsiveness guarantees a harmonious and delightful user experience across a spectrum of devices, including smartphones, tablets, and desktops.

In summary, "Vacay Inn" is a feature-rich application meticulously crafted to simplify the hotel reservation experience. From the user-friendly registration process and robust authentication to reservation management and responsive design, the app strives to deliver a user-centric and seamless journey for reserving rooms at captivating hotel branches.

(back to top)

Backend Repository Link

Backend Repo

💻 Getting Started

If you would like to get a local copy up and running, please follow these steps.

Prerequisites

In order to run this project you need to have ruby and ruby on rails installed in your computer. You can check that by running ruby -v in your console

If you do not have ruby installed in your computer, you can follow this tutorial (for Windows)

For installing ruby on MacOS you can run the following commands: 

brew install rbenv ruby-build
# Add rbenv to bash so that it loads every time you open a terminal
echo 'if which rbenv > /dev/null; then eval "$(rbenv init -)"; fi' >> ~/.bash_profile
source ~/.bash_profile

# Install Ruby
rbenv install 3.0.1
rbenv global 3.0.1
ruby -v

For installing RoR you need to run

gem install rails

To run the backend you need to clone the backend repo (link on backend repository link section) and run the following commands:

cd Capstone-Back-End
bundle install
rails db:create
rails db:migrate
rails db:seed
rails s

Deployment

(back to top)

Setup

Clone this repository to your desired folder:

cd my folder
  git clone https://github.com/hernandanielzamora/Capstone-Front-End.git

Open your terminal and navigate to the cloned project directory.

Install

  • Install this project with:
  cd Capstone-Front-End

  npm install or npm i

Usage

To run the project, execute the following command:

  npm start

(back to top)

👥 Authors

👤 Hernán Zamora

👤 Christian Zambrano

👤 Fredo St Fleur

👤 Jose Luis Vazquez Flores

🔭 Future Features

-Add a admin dashboard . -Display additional Room information . -Improve styling and organice sass files .

(back to top)

🤝 Contributing

Please feel free to try out our App and test the user interface. We will love to hear from you and how can we improve our app. Please feel free to contact us if you have any questions, comments or concerns. You can also fork this repo and submit a PR for any changes/improvements you would like to see.

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you like this project give us a star ⭐️

(back to top)

🙏 Acknowledgments

Special thanks to our team who made possible the completion of this project. Thanks to Murat Korkmaz for providing the original design.

(back to top)

📝 License

This project is MIT licensed.

(back to top)