Skip to content

a booking service for cabins. Part of Jonas Schmedtmann's course. allows users to make reservations and perform various server operations using Next.js.

Notifications You must be signed in to change notification settings

Ahmedabdelaziz77/the-wild-oasis-website

Repository files navigation

The Wild Oasis Website

This repository contains the course project "The Wild Oasis Website", a booking service for cabins. It is part of Jonas Schmedtmann's "Ultimate React Course" and allows users to make reservations and perform various server operations using Next.js.

Built With

  • React: Frontend framework
  • Next.js: Server-side rendering and API routes
  • Tailwind CSS: Styling
  • react-day-picker: Date selection
  • next-auth: Authentication
  • Supabase: Database storage
  • date-fns: Date utility library

This website is my first project created while learning Next.js. The Wild Oasis Cabins is a client-side web application developed using Next.js, App Router, Tailwind CSS, and Supabase. It serves as an immersive platform for users to explore and book cabins offered by The Wild Oasis, a fictional wilderness retreat.

About

The application showcases the powerful capabilities of Next.js alongside industry-standard tools like App Router, Tailwind CSS, Supabase, and Auth.js.

Features

1. Immersive Exploration

  • Description: Users can explore the scenic beauty of The Wild Oasis through detailed cabin listings and captivating imagery.
  • Implementation: Uses Next.js dynamic routing to create individual pages for each cabin, showcasing high-quality images and comprehensive descriptions.
  • Visual Appeal: Leverages Tailwind CSS for a responsive, visually appealing design, ensuring an immersive user experience.

2. Effortless Booking

  • Description: Booking cabins is made effortless with a user-friendly interface.
  • User Experience: Implements intuitive form handling using Next.js, making the booking process seamless and straightforward.
  • Backend Integration: Utilizes Supabase for backend services, including the database storage of booking information.

3. Dynamic Updates

  • Description: Real-time updates provide users with accurate availability information for informed booking decisions.
  • Real-Time Capabilities: Leverages real-time features to subscribe to changes in cabin availability, ensuring users always have up-to-date information without needing to refresh the page.

4. Secure Authentication

  • Description: Authentication via Google ensures a secure login experience, instilling confidence in users interacting with the platform.
  • Implementation: Utilizes Auth.js for authentication, providing seamless integration with Google OAuth for secure user authentication.

Technologies Used

  • Next.js: A React framework for building powerful web applications.
  • App Router: A routing solution that integrates with Next.js, enabling smooth navigation within the application.
  • Tailwind CSS: A utility-first CSS framework for rapid and flexible UI development.
  • Supabase: A robust platform providing database services, ensuring a reliable backend infrastructure.

HOME PAGE

1-homepage

CABINS PAGE

2-cabins page

ABOUT PAGE

3-about page

CABIN PAGE

4-cabin page

RESERVATION PAGE

5-Reservations page

LOGIN PAGE

6-login page

UPDATE PROFILE PAGE

7-update profile page

About

a booking service for cabins. Part of Jonas Schmedtmann's course. allows users to make reservations and perform various server operations using Next.js.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published