Full Stack Tutorial – Hotel Management Site w/ Next.js, React, Sanity.io, Tailwind, Stripe

Features:
- Hotel Room Management CRUD with Sanity.IO
- Hotel Room Review
- Room Booking
- Checkout with Stripe
- Stripe webhook
- Light / Dark Mode with React Context
- Search (Room Type / Name)
- Authentication with Auth.JS
- Typescript
- useSwr Hook
- Deployment to Vercel
- And lots more...

✏️ Course created by @codewithlari

⭐️ Contents ⭐️
0:00:07 Intro and Demo
0:09:07 New Project
0:14:42 Layout
0:35:02 Dark / White Theme
0:47:37 Authentication Page Setup
1:02:01 Sanity CMS Integration
1:13:57 Environment Variables
1:16:47 Sanity Schemas (user, account, booking, hotelRoom, verificationToken)
1:52:37 Authentication with next auth (Github, Email, Google)
2:12:02 Toast Notification
2:14:18 Fixing Api folder error
2:15:35 Authentication Continued
2:20:29 Complete Schema
2:25:22 Authentication Test
2:31:07 Configuring jwt
2:40:37 Custom classnames using tailwind directives
2:42:07 Hero Section
3:07:35 Search Feature
3:23:52 Gallery Component
3:25:47 NewsLetter Component
3:27:22 Featured Room
3:56:37 Nextjs Loading Component
3:58:33 Nextjs Error Component
4:02:27 Rooms Page
4:31:07 Room Details Page
6:03:28 Create Booking API
6:13:58 Middleware
6:16:07 Stripe Integration
6:38:45 Test Booking Payment
6:42:37 Webhooks
7:25:37 User Details Page
8:37:10 Rate Hotel Room
9:28:22 Display Hotel Room Rating
9:54:26 Git / Vercel / Deployment

🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama

--

[alaribebright]

Thank you so much for having me on your channel freecodecamp. 🎉

[maestrogoldring]

Great job guys! Looking forward to it!

[Dribbles]

Jesus, this is huge! Thank you for this!

[marvellousodili]

OMG 😱I was just thinking about how I’m going to learn full stack and behold this came on my notification thank you so much you guys are the best

[michaelblue]

Just finished the build, successfully! Thank you for putting this together. Really great stuff, super helpful!

[laurise]

I dont know how to thank yoru for all your very very usefull videos that u produce u dont know how it saves life

[mahendranath]

Nice thank you so much for the amazing content, Liked 👍and subscribed

[FatemehDamarchilou]

How is it possible to thank these generous people enough.
Thanks or thank you is not suitable for these generosity

[royalapples]

this is amazing as these are the project people should be doing for their portfolio, seeing it all come together!

[samandarquvatov]

Hello FreeCodeCamp team, I am following you from Uzbekistan Good luck with your content.

[Nexjsdeveloper]

the very bad thing about all tutorials that use tailwindcss is, they first write whole tailwind classes, then show output to user. in this case user do not understand what happened by this classes because in fact in first time when developer come to create project it add some code and then see output, again some code and see output. this way is so more sensitive than adding all codes and then showing output to user. hopefully you notice it.

[asma]

I am coming back here after learning Next.js 🔥🔥🔥

[rohitavadhani]

I was going to make one for my dad's bnb and now here it is. Thanks alot

[jasong]

Another amazing tutorial! Completed a full stack bootcamp but these really help solidify what I’ve learned. Will you add timestamps in the future?

[tatarumarius]

the tutorial is very very good. Sir giving away digital money

[sadkbal]

I wish to see QT creator tutorials in this channel. That would be great.

[DanielObuh-rdyr]

Hoping to use this tutorial to create something meaningful

[milanbuli]

Something similar with Angular would be nice. This is great btw.

[rishabhraj]

Is it okay to build as a beginner only know react Js?

[thedelanyo]

Please can we have same course for Svelte/Sveltekit?