Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mahmoud-alaa1/the-wild-oasis
Hotel management app - full-featured React web application that allows hotel employees to manage cabins, bookings, and guests.
https://github.com/mahmoud-alaa1/the-wild-oasis
compound-components dark-mode dashboard react react-hook-form react-query recharts-js styled-components supabase
Last synced: 24 days ago
JSON representation
Hotel management app - full-featured React web application that allows hotel employees to manage cabins, bookings, and guests.
- Host: GitHub
- URL: https://github.com/mahmoud-alaa1/the-wild-oasis
- Owner: mahmoud-alaa1
- Created: 2024-09-14T23:45:03.000Z (5 months ago)
- Default Branch: master
- Last Pushed: 2024-12-30T16:06:40.000Z (30 days ago)
- Last Synced: 2024-12-30T17:19:08.009Z (30 days ago)
- Topics: compound-components, dark-mode, dashboard, react, react-hook-form, react-query, recharts-js, styled-components, supabase
- Language: JavaScript
- Homepage: https://wild-oasis1.vercel.app/dashboard
- Size: 2.63 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🏜️ The Wild Oasis
Welcome to The Wild Oasis! This is a hotel management web app, where hotel employees can manage cabins, bookings, and guests. It uses Supabase as the backend and implements advanced React techniques such as HOCs and React Query.
# 🖥️ Demo
You can check **live website** [The Wild Oasis](https://wild-oasis1.vercel.app/).
- Landing Page
# 🚀 Key Technologies
- 
React Query: Efficient data fetching and caching.
- 
Styled Components: Modular and scalable component styling.
- 
React Hook Form: Simple, powerful form handling
- 
Supabase: Authentication and real-time database.
- 🏗️ The Compound Component Pattern: Maintainable UI components.
- 🌑 Dark Mode: Seamless toggle between light and dark themes.
- 📊 Visualizing Data with Recharts: Visualizing user data with dynamic charts
# ✨ Features
- Cabin Management: Easily manage cabin availability and details.
- Booking Management: Streamline the booking process and keep track of reservations.
- User Management: Administer user roles and permissions efficiently.
- Sales Statistics: Gain insights into sales data to make informed decisions.
- Dark Mode: Enjoy a modern, customizable interface with dark mode support.
- Authentication: Secure user access through integrated authentication.
- Charts: Visualize data with integrated charts for better understanding.
- Responsive Design: Ensures usability on various devices
# 🛠️ Installation & Setup
1. Clone the repository:
```
git clone https://github.com/your-username/the-wild-oasis.git
cd the-wild-oasis
```
2. Install dependencies:
```
npm i
```
3. Set up supabase by creating email at supabase and get your own URL and API KEY then integrate them in supabase.js file
```
import { createClient } from "@supabase/supabase-js";
export const supabaseUrl = YOUR_SUPABASE_URL;
const supabaseKey = YOUR_SUPABASE_KEY
const supabase = createClient(supabaseUrl, supabaseKey)
export default supabase;
```
Run and Test Project
```
npm run dev
```
# 🤝 🏖️ Contribute to the Oasis
We're excited for you to be a part of this journey. Whether you're fixing a bug or building new features, your contribution will help keep The Wild Oasis flourishing. Feel free to submit issues, pull requests or emailing me [Mahmoud Alaa](mailto:[email protected]?subject=[GitHub]%20Wild%20Oasis)