Welcome to the Travel Booking Platform! Dive into a user-friendly experience that streamlines the way you search and book accommodations. From cosy B&Bs to luxurious resorts, my platform connects you to your next stay with just a few clicks.
fts-final-project.mp4
The platform harnesses the power of cutting-edge technologies to deliver a seamless and responsive user experience:
- React: Crafting dynamic UIs with modern React, ensuring a fast, efficient, and scalable application. βοΈ
- Vite: Supercharging our development with Vite's next-generation front-end tooling. β‘
- PropTypes: Utilizing Prop Types for component prop type checking, ensuring the props passed to components are valid. βοΈ
- Axios: Streamlining HTTP requests with Axios for robust and elegant asynchronous operations. π
- Day.js: Manipulating and displaying dates with the lightweight Day.js library. π
- JWT Decode: Safely decoding JWTs to extract user credentials and information. π
- React Cookie: Managing browser cookies with ease, facilitating state management across sessions. πͺ
- React Router Dom: Navigating the application with ease using the robust routing solutions of React Router. π£οΈ
- Formik: Streamlining form creation and handling, making complex forms simple. π
- Yup: Leveraging Yup for effective schema validation, keeping data integrity in check. β
- Material UI: Styling the platform with a suite of pre-designed components from Material-UI for a polished look and feel. π¨
- React Date Range: Implementing intuitive date selection with a customizable date range picker. π
- React Slick: Showcasing images and content with a responsive carousel that adds a dynamic edge to our UI. πΌοΈ
- React Leaflet: Integrating interactive maps with React Leaflet, enhancing location-based features. πΊοΈ
- React To Print: Providing users with the convenience of printing documents directly from the platform. π¨οΈ
- Testing Frameworks: Ensuring code quality and functionality with comprehensive testing suites using:
- Jest: A delightful JavaScript Testing Framework with a focus on simplicity. β
- React Testing Library: Building strong tests for React components without relying on their implementation details. π§ͺ
Dive into the details of my project with the Complete Project Documentation on Notion.
-
Authenticate securely with username and password entry fields. π
-
User Login:
- Username: user
- Password: user
-
Admin Login:
- Username: admin
- Password: admin
- Central search bar with the placeholder: "Search for hotels, cities..."
- Interactive calendar for selecting check-in and check-out dates.
- Controls for specifying the number of adults, children and rooms.
- Special offers are highlighted in the "Featured Deals" section.
- Personalized display of the last visited hotels with detailed information.
- A curated list of popular cities with visually appealing thumbnails.
- Sidebar with filters for price range, star rating, and amenities.
- Listings of hotels matching search criteria.
- Fullscreen viewable high-quality images of the hotel.
- Hotel name, star rating, description, reviews, and map location.
- List of room types with images, descriptions, prices, and add-to-cart options.
- Form for personal details and payment method.
- List of booked rooms with their details (room number, price, capacity and amenities).
- Booking details with confirmation number and printable options.
- Navigator with links to Cities, Hotels, and Rooms.
- Filters for the grids.
- Detailed information and management options for Cities, Hotels, and Rooms.
- Form for creating new entities like Cities, Hotels, or Rooms.
- Forms for updating information on entities within the platform.
- This page is displayed whenever a user navigates to a URL that does not correspond to any active route within the application.
To get this project up and running on your machine, follow these simple steps:
- Clone the repository:
git clone https://github.com/Rahaf-Mansour/travel-booking-platform.git
- Install npm packages: Navigate to the project directory and install the required dependencies.
npm install
If you encounter any issues, try forcing the npm installation:
npm install --force
- Run the project: Start the development server and begin exploring.
npm run dev
Enjoy your journey through the Travel Booking Platform! π
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 suggestions for improvements, please feel free to:
- Open an issue with the tag "enhancement".
- Give the project a star! β
-
Fork the Project: Create your own copy of the project to start working on your changes.
-
Create your Feature Branch:
git checkout -b feature/AmazingFeature
- Commit your Changes:
git commit -m 'Add some AmazingFeature'
- Push to the Branch:
git push origin feature/AmazingFeature
- Open a Pull Request:
- Once you've pushed your feature branch to your fork, open a pull request in the original repository so that your changes can be reviewed and eventually merged.
Looking forward to seeing your contributions!
If you have any questions or want to reach out, feel free to connect with me:
I extend my sincere gratitude to Foothill Technology Solutions for granting me the opportunity to participate in this internship cycle. Their unwavering support has been instrumental throughout the development of this project.