Welcome to HotelBytezz! This is the customer version of the hotel management web app, where users can view and book rooms based on availability, manage their bookings, and update their profiles. This project was a great learning experience for me as I explored Next.js, Auth.js (NextAuth), and many other advanced techniques.
Check out the live app here: HotelBytezz
I also built an admin version of this app for hotel employees to manage rooms, bookings, and guests. The repository is here, and the live site is here.
- View all available rooms with descriptions and images.
- Book a room based on available dates and select the number of guests.
- Sign in with Google to manage bookings.
- View your booked rooms, edit them, or cancel if needed.
- Update your profile information.
- Fully responsive on all devices (I made sure to make it mobile-friendly!).
- Next.js (App Router)
- Tailwind CSS for styling
- Supabase for the database (shared with the admin app)
- NextAuth.js for authentication (Google sign-in)
- Date-fns for date handling
This project deepened my knowledge of Next.js (especially the App Router) and introduced me to using libraries like NextAuth.js. I learned to build a fully functional booking system, integrate user authentication, and ensure the app is responsive on all devices.
To run this project locally:
- Clone the repo:
git clone https://github.com/CodeWithAlamin/HotelBytezz.git
- Install dependencies:
npm install
- Set up environment variables:
- You’ll need to configure Supabase and NextAuth (Google sign-in). Add your environment variables in a
.env.localfile. Check out the.env.local.examplefor what you need to include.
- You’ll need to configure Supabase and NextAuth (Google sign-in). Add your environment variables in a
- Run the development server:
npm run dev
- Open http://localhost:3000 to see the app.
👤 Alamin
- LinkedIn - @CodeWithAlamin
- Twitter - @CodeWithAlamin
- GitHub - @CodeWithAlamin
Feel free to contact me with any questions or feedback!