Summary
Keywords
Full Transcript
Learn how to build and deploy a full stack Hotel Booking Website using MERN Stack, Hotel Booking app project for college | Full stack project with admin dashboard 👉 Clerk Auth: https://go.clerk.com/UvYL8uU 👉 Live Preview: https://hb-gs.vercel.app/ 👉 Source code: Please check the pinned comment 👉 Download the assets: https://greatstack.dev/assets/hotel-booking-react-app 👉 Figma Design: https://www.figma.com/design/vWAjka7MDKh3QWfvERF6Mx/QuickStay SUBSCRIBE: @GreatStackDev 👉Beginner's React JS: https://youtu.be/gbAdFfSdtQ4 👉 30 Days React.js Learning Plan: https://topmate.io/greatstack/1514677 Timestamp: 00:00 Project Overview 06:24 Project Creation 22:08 Create Navigation bar 42:51 Create Home Page 57:29 User Authentication using Clerk 02:15:07 Hotel List Page 02:50:36 Hotel Details Page 03:25:41 My Bookings Page 03:47:48 Create admin dashboard 05:00:16 Create Backend of project 05:13:10 Connect mongoDB database 05:31:27 setup Clerk authentication in Backend 06:00:41 Create API for users 06:15:08 Create API for Hotels 06:55:12 Create Booking API 07:27:07 Connect Frontend with Backend 09:42:28 sending booking confirmation email 09:59:27 Deploy project on Vercel 10:08:26 Add Stripe payment gateway ------------------- In this full stack project tutorial we are going to build a fully functional Hotel Booking website using MERN Stack. This is a Hotel booking system where users can book hotel rooms. Users can also add new hotel rooms on this website and manage the hotel bookings from the admin dashboard. In this MERN Stack project we will create the user Login & registration feature using Clerk. Clerk is a user authentication & user management platform. It also provides beautiful and ready to use UI components like Sign-In, Sign-up and profile component for react app. We will also add the email functionality in this project so that when user book any hotel they will instantly get the booking confirmation on their email. After booking user can pay the hotel fee online using Stripe payment gateway. After completing this hotel booking system project using mongoDB, Express, React and Node JS, we will deploy it online on Vercel. #fullstack #fullstackproject #fullstackwebdevelopment #greatstack #mernstack #mernstackproject #hotelbooking #collegeprojects #coding ------------------- Watch Full Stack Grocery Delivery App tutorial: 👉 https://youtu.be/PaQX0pktLnw Watch Full Stack Food Order Website tutorial: 👉 https://youtu.be/DBMPXJJfQEA Watch Full Stack Chat App tutorial: 👉 https://youtu.be/gbocZlm71nE Watch Full Stack Music Streaming Website 👉 https://youtu.be/KdGfhSpT6pc Watch Full Stack Blog Website Tutorial 👉 https://youtu.be/HdWCh_4XE1Q ------------------------------------- Build more React JS projects: Complete Portfolio Website In React: 👉 https://youtu.be/4ag1LsgIUc0 Build ChatGPT Clone In React: 👉 https://youtu.be/EzkWAviyYgg Build AI Image Generator with OpenAI In React 👉 https://youtu.be/PZG2MvOjud0 Create Weather App In React 👉 https://youtu.be/7JqdjWB88Kk ------------------------------------- Images Credit: https://www.pexels.com/ https://unsplash.com/ https://www.freepik.com/ ------------------------------------- Connect with me: 👉 https://linktr.ee/iamavinashkr Connect with GreatStack: Instagram: https://instagram.com/GreatStackDev Twitter: https://twitter.com/GreatStackDev Facebook: https://facebook.com/GreatStack
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
