https://github.com/simandrew/the-wild-oasis-nextjs
The Wild Oasis hotel management app
https://github.com/simandrew/the-wild-oasis-nextjs
next-js supabase tailwind-css
Last synced: 27 days ago
JSON representation
The Wild Oasis hotel management app
- Host: GitHub
- URL: https://github.com/simandrew/the-wild-oasis-nextjs
- Owner: SimAndrew
- Created: 2024-05-27T15:26:53.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2024-06-20T19:14:23.000Z (almost 2 years ago)
- Last Synced: 2025-03-01T20:35:35.661Z (over 1 year ago)
- Topics: next-js, supabase, tailwind-css
- Language: JavaScript
- Homepage: https://the-wild-oasis-app-nextjs.vercel.app
- Size: 8.81 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## The Wild Oasis NextJS
[Application use App Router](https://nextjs.org/docs/app)
[App Router vs Pages Router dev.to ](https://dev.to/dcs_ink/nextjs-app-router-vs-pages-router-3p57)
[App Router vs Pages Router medium.com](https://medium.com/@jawaragordon/choose-your-own-adventure-next-js-app-vs-pages-router-528dbf25b37f)
---
### About:
The Wild Oasis hotel management app that allows hotel employees to manage cabins, bookings, and guests.
You can try here: [the-wild-oasis-app-nextjs.vercel.app](https://the-wild-oasis-app-nextjs.vercel.app/)
For Login use: Your Google Account.
---
### Sample task, photo:
### For users not Logged In:
**Homepage:**
**Cabins page - List of cabins available for reservation, filter by number of guests:**
**Cabin 001 Example**
**About page:**
**Guest area page:**
### For Logged In users:
**Guest area page:**
Home page:
**Guest reserve a cabin:**
Guest reservations list:
Edit Guest reservation:
Guest profile Update guest information: where a guest from, National ID number:
---
### Technologies, Libraries:
- React lets you build user interfaces out of individual pieces called components. [React JS](https://react.dev/)
- Next JS - React meta-framework. Handles routing, SSR, data fetching and even remote state management. [Next JS](https://nextjs.org/)
- [ESLint](https://eslint.org/), [Prettier](https://prettier.io/)
- Tailwind CSS a utility-first CSS framework that packed with classes. Extremely easy to integrate into Next.js. Utility-first is a CSS methodology where you build up your styles using many small, purpose-specific classes. [tailwindcss.com](https://tailwindcss.com/)
- heroicons/react - Beautiful hand-crafted SVG icons, by the makers of Tailwind CSS [heroicons.com](https://heroicons.com)
- Flexbox
- date-fns - Date manipulation [date-fns.org](https://date-fns.org)
- Supabase - database and API [supabase.com](https://supabase.com)
- React DayPicker- Create date pickers, calendars, and date inputs for web applications. [react-day-picker.js.org](https://react-day-picker.js.org)
- authjs.dev - Authentication for NextJs [authjs.dev](https://authjs.dev/)
- Login & Logout with Google AuthJs login provider https://authjs.dev/getting-started/providers/google
---
### Run the app:
- Clone a project: `git clone`
```
git clone https://github.com/SimAndrew/the-wild-oasis-nextjs.git
```
- Open project code in your editor.
- Install the dependencies, enter into the terminal:
```
npm install
```
- Run the project, enter into the terminal:
```
npm run dev
```