Course Highlights
  • Learn all important features of Next JS
  • Learn Server Side Rendering with Next
  • Learn how file base routing works in Next
  • Learn all different ways to pre fetch data
  • Learn how to build full React stack application in Next JS
  • Learn how to build production ready react apps
  • Learn how to implement authentication with next-auth
  • Learn how to implement Redux properly for State management in Next
  • Learn how to integrate modern payment gateway like Stripe
  • Learn how to integrate third party image hosting server like Cloudinary
  • Learn how to handle errors properly
  • Learn how to deploy full stack app on Vercel
Skills you will learn!
Curriculum

2 Topics
Introduction of Course
Project (BookIT) Complete Demo

2 Topics
Installing all required tools
Install MongoDB Community Server

1 Topic
Get BookIT Source Code Details

3 Topics
What is Next.js?
File Base Routing & Full Stack Apps
Server Side Rendering

4 Topics
Installing Next.js & Understanding Folder Structure
Starting with Backend API
Setting Up Postman Environment
Connecting to MongoDB

7 Topics
Creating Room Model
Create & Save Room - ADMIN
Fetch all Rooms
Creating Data Seeder
Get single Room Details
Update Room - ADMIN
Delete Room - ADMIN

3 Topics
Create Error Handler Class
Global Async Error Handler
Validation & Mongoose ID Error

3 Topics
Search Rooms by Location
Filter Rooms
Adding Pagination

5 Topics
BookIT HTML & CSS Details
Setting up layout & Global Provider
Header & Footer Component
BookIT Homepage
Add hot-toast for messages/errors

4 Topics
Server Component vs Client Component
Data Fetching
Data Caching
Data Revalidating

4 Topics
Fetch All Rooms & Handle error
Render all Rooms
Fetch Room Details & Set Dynamic title
Render Room Details

3 Topics
Adding Pagination
Search Rooms Component
Adding additional options in Search

6 Topics
Create User Model
Register User and Encrypt Password
Handle User Login on Backend
Login User Component
Get Session & Show User in Header
Logout User & Placeholder

3 Topics
Creating Redux toolkit store
Add user to the State
RTK Query Mutation & Register User

13 Topics
Update User Profile Endpoint
Protect Backend API Routes
Update User Profile Component
Update User Session
Protect Frontend Routes with Middleware
Nested User Layout
Update Password Endpoint & Fix err Message
Handle Mongoose Duplicate Key Error
Update Password Component
Configure Cloudinary to Upload & Delete File
Upload User Avatar Endpoint
Upload User Avatar Component
Fix User Sidebar Menu BUG!

6 Topics
Generate Forgot Password token
Setup Nodemailer & Email HTML Template
Send Password Recovery Email
Handle Forgot Password Component
Handle New Password Endpoint
Handle New Password Component

3 Topics
Setup Node GeoCoder with MapQuest
Generate & Save Map Coordinates
Render Map on the Room Details Page

12 Topics
Create Booking Model
Display Date Range Picker
Create & Save New Booking
Handle Room Availability Endpoint
Handle Room Availability
Get all booked dates of Room
Disable Booked dates on Calendar
Current User Bookings & Booking Details Endpoint
Get current user Bookings
getAuthHeader() for protected endpoints
View Booking Details Component
Generate Booking Invoice

6 Topics
What is Stripe & Installing Stripe
Create Stipe Checkout Session
Process Payment through Stripe Checkout
Setting Up Stripe WebHook (macOS)
Setting Up Stripe WebHook (Windows)
New Booking Endpoint

5 Topics
New Review Endpoint
Submit Review
Render all Reviews
Show Submit Review Button
404 (not-found) Page

6 Topics
Admin Layout & Admin Loader
Authorize Roles
Dashboard Component & Render Charts
Get Sales & Booking within Date Range
Get & Render 6 Months Sales Data
Get Top 3 Best Performing Rooms by Bookings

8 Topics
Display All Room
New Room Component
Update Room Component
Revalidate Data
Upload Room Images Endpoint
Upload Room Images Component
Delete Room Image
Delete Room with Images

8 Topics
Display All Bookings
View Booking Details
Delete Booking
Display all Users
Update User
Delete User
Display Room Reviews
Delete Room Reviews

2 Topics
Preparing App for Deploy
Deploying on Vercel

1 Topic
Congratulations!!!

4 Topics
What actually is Next.js?
Next.js - File Base Routing
Next.js - Server Side Rendering
Next.js - Full Stack Apps

5 Topics
BookIT Project GitHub Link
Installing Next.js & Understanding Folder Structure
Starting with Backend API
Setting Up Postman Environment
Connecting to MongoDB

7 Topics
Creating Room Model
Create & Save Room
Fetch all Rooms
Creating Data Seeder
Get single Room Details
Update Room
Delete Room

4 Topics
Create Error Handler Class
Error Middleware
Catch Async Errors
Validation & Mongoose ID Error

4 Topics
Search Rooms by Location
Filter Rooms
Important Note about Next Lecture
Adding Pagination

5 Topics
BookIT HTML & CSS Details
Setting up _doucment
Header & Footer Component
Layout Component
BookIT Homepage

3 Topics
Understanding getStaticProps()
getServerSideProps()
getStaticPaths()

10 Topics
Creating Redux Store
All Rooms Reducer
All Rooms Action
Important Note about Next Lecture
Dispatch rooms action in getServerSideProps()
Display all Rooms on HomePage
Adding React Toastify
Room Details Reducer & Action
Room Details Component
Room Features Component

5 Topics
Pagination Link Issue
Adding Pagination
Search Rooms Component
Adding additional options in Search
Handle Pagination Issue in Search

11 Topics
Create User Model
Encrypting Password while Registration
Important Update about Next Auth
Handle User Login on Backend
Login User Component
Adding Cloudinary for Images
Register User Component
Current User Profile
Load Logged In User
Show User in Header
Logout User

9 Topics
Using getServerSideProps() to Protect Routes
Update User Profile Endpoint
Update User Profile Reducer & Action
Update User Profile Component
Generate Forgot Password token
Send Password Recovery Email
Handle Forgot Password Component
Handle New Password Endpoint
Handle New Password Component

13 Topics
Login Button Blink Issue in Header
Create Booking Model
Display Date Range Picker
Create & Save New Booking
Handle Room Availability Endpoint
Handle Room Availability
Get all booked dates of Room
Fixing the Date Zone Issue
Disable Booked dates on Calendar
Display All Bookings
View Booking Details
View Booking Details Component
Generate Booking Invoice

5 Topics
What is Stripe?
Create Stipe Checkout Session
Process Payment through Stripe Checkout
What is Stripe WebHook?
New Booking Endpoint

6 Topics
New Review Endpoint
Submit Review Reducer & Action
Submit Review
Display all Reviews
Show Submit Review Button
_404 Page

10 Topics
Authorize Roles
Display All Room
New Room Reducer & Action
New Room Component
Update Room Reducer & Action
Update Room Component
Delete Room
Display All Bookings
Delete Booking
View Booking Details

5 Topics
Display all Users
Update User
Delete User
Display Room Reviews
Delete Room Reviews

5 Topics
Export a Static Website
Preparing App for Deploy
Push BookIT on GitHub
Deploying on Vercel
BookIT Speed Test

  Write a Review

Next.js - Build Full Stack Apps with Next.js & TypeScript

Go to Paid Course