Wild Oasis – Front-Facing Website
A modern, guest-facing booking platform built for boutique hotels and eco-retreats. This application is the public companion to the Wild Oasis admin dashboard from Jonas Schmedtmann’s React course. Guests can browse cabins, check availability in real time, create an account, and book their stay through a clean and responsive interface powered by Next.js and Supabase.
Features
- Cabin browsing with pricing, capacity, and photo galleries
- Real-time availability checks based on Supabase booking data
- User authentication with Supabase Auth
- Full booking flow with date-range selection and validation
- User dashboard for viewing and managing reservations
- Server-side rendering, API routes, and dynamic routing using Next.js
- Optimized media handling with
next/image - Fully responsive layout with Tailwind CSS or styled-components
Tech Stack
| Category | Technology / Package | Purpose |
|---|---|---|
| Framework | Next.js | Routing, SSR, SSG, API routes |
| Styling | Tailwind | Modern responsive styling |
| UI State Management | Context API | UI state management system |
| Backend | Supabase | Auth, file storage |
| Forms | react-hook-form | Form handling and validation |
| Deployment | Vercel | Hosting and global image optimization |
Project Structure
wild-oasis-website/
├── .next/
├── app/
│ ├── _components/
│ ├── _lib/
│ ├── _styles/
│ ├── about/
│ ├── account/
│ ├── api/
│ ├── cabins/
│ ├── login/
├── node_modules/
├── out/
├── public/
Gallery
