Skip to content

omr-muhammad/the-wild-oasis

Repository files navigation

Project Title: The Wild Oasis

Description

  • General

    • It's a hotel management system app so the users is the hotel employees

    • Authenticatio&Authorization feature is implemented so only logged in user can deal with the app

  • Dashboard

    • Starting with the dashboard page which displays some statistics about the cabins and bookings, an activity panel for guests status, a chart render a summary about the duration, and finally another chart displays the sales in specific duration
  • Bookings

    • the booking page which renders all the bookings in a table and it gives the ability for each user to track a booking or delete it check in/out guests it also comes with great filter options

    • From each booking in the table user can go to the detailed page for more information about this booking and the guest info

  • Cabins

    • Comming to the cabin page which displays all the hotel cabins with all information needed for this cabin also the ability to create, edit, and delete a cabin

    • Awesome filter options to filter by status, name, price, and cabin's capacity

  • User

    • Users can easily be created with the create user form with form error handling
  • Settings

    • The last page shows the hotel settings such as
      • min/max nights and bookings
      • max guests number
      • the breakfast price

Installation

  • To run on your machine, after downloading the project run these two commands in the terminal

    -1

    npm install

    -2

      npm run dev

Development Tools

  • Programming Languages

    • HTML  CSS  JavaScript 
  • Used Technologies

    React.js Redux.js React-Router.js React-Query.js Styled-Components.js React-Hook-Form.js Recharts.js Supabase.js Git  GitHub 

  • Patterns & Used Techniques

    • Authentication & Authorization
    • Reusability
    • Render Props
    • Compound Component
    • Light & Dark Themes
    • Error Handling

New Tools Aquired

  • React-Query.js Styled-Components.js React-Hook-Form.js Recharts.js Supabase.js

Demo & Screeen Shoots


  • Dashboard Light

  • Dashboard Dark

  • Bookings

  • Cabins

  • Profile Page

  • Login Page

  • Hotel Settings