Complete Next.js 13.4 Tutorial in Hindi🔥FullStack Website using NextJS, React Server Comp. & MongoDB

Published: 22 April 2023
on channel: Thapa Technical

209,345

2.4k

Welcome, to complete Next.js tutorial in Hindi, where we will build a Full-Stack Website with Next.js 13 and MongoDB using React Server Components in Hindi. In this video, we'll be walking you through building a Next.js web application step-by-step. Starting from setting up the project and installing dependencies, to creating pages, routing, integrating APIs, and connecting to a MongoDB database. We'll also cover responsive design and styling, including using CSS modules and React icons. The video is about 2 hours long, so grab a cup of coffee and follow along as we build a fully functional web app from scratch!

👉 Complete Source Code: https://www.thapatechnical.com/2023/0...

👉 Free JetBrains Student licenses - https://jb.gg/JetBrainsStudentLicense
👉 For Professionals, 3 Months WebStorm License (choose WebStorm) - https://jb.gg/GetWebStorm
Coupon Code - YMBVT-URD82-N4QU8-DV69Z-AFD5Q ( Valid till July 31st )

👉Want to Migrate to WebStorm: https://www.jetbrains.com/help/websto...

😊 Become Member, get access to perks, free Source code, & more..
   / @thapatechnical

😍 Check my Instagram to Connect with me:   / thapatechnical

👩‍💻 Discord Server Link for Programmer to Hangout:   / discord

✌ Website Link: https://www.thapatechnical.com

==========TIMELINE===========
0:00 Introduction & website review
6:30 WebStorm Installation
10:15 Jetbrains Toolbox App
11:50 Create Next App (Two ways)
20:20 Our very First Next APP & Run it
21:15 Complete Styles & CSS Modules
22:30 File Based Routing
25:45 Header Component (Layout in NextJS)
30:50 Image & Link components
34:48 Header and Nav component
39:20 Next Font Optimization
41:40 Hero Section
49:35 About Page with Component
54:30 Next Dynamic Route
57:18 Fetch API Data in Next.js
1:01:30 Api Data go through
1:05 Movie Card Component
1:12:00 Handling Image in Next.js
1:14:30 Dynamic Movie Route (Blog)
1:21:30 Loading file in Next.js
1:25:00 404 Error Page in Next.js
1:26:50 Shape Dividers to style
1:29:20 Contact Us page & React Icons
1:36:30 Contact Form & React Hooks
1:45:50 Server vs Client components
1:51:00 Create Database using MongoDB
1:54:00 Connection to database
1:58:00 Models & Schema (Mongoose)
2:02:00 Route to Handle POST Requests to Create New Posts
2:05:10 Connect Front-end to Database and Store Data in DB
2:16:00 Footer Components
2:17:00 Responsive Menu
2:21:00 Share code to Github
2:24:00 Free host with Vercel

************ 😍 Must Watch Videos For Web Development 😍 ************

➡️ Complete Reactjs in One video here    • ReactJS For Beginners in One Video in...

➡️ HTML in One Video:    • Learn HTML in One Video in Hindi from...

➡️ CSS in One video:    • Learn Complete CSS In One Video In Hindi

➡️ CSS FlexBox in 30 Minutes:    • CSS FlexBox in 30 Minutes in Hindi 2022

➡️ JavaScript in One video:    • JavaScript in One Video in Hindi

➡️ ECMAScript 6 in One Video:    • ES5 & ES6 | ECMAScript 6 in One Video...

➡️ HTML5 in one video:    • HTML5 Tutorial in One Video in Hindi ...

➡️ CSS3 in one video:    • Learn Complete CSS3 In One Video In H...

➡️ Bootstrap4 in One video:    • Bootstrap 4 in One Video in HINDI  2019

➡️ Jquery in One video:    • jQuery in One Video in Hindi 2019

➡️ JSON in one video:    • JSON in One Video in Hindi 2018

➡️ ReactJS in one video:    • ReactJS For Beginners in One Video in...

➡️ PHP in One Video:    • PHP TUTORIAL IN ONE VIDEO IN HINDI 2019

➡️ NodeJS in one video:    / ipnwakoibt

➡️ MySQL in one video:    • Complete SQL & MySQL in One Video in ...

➡️ Advanced JavaScript in Hindi Playlist:    • Advanced JavaScript Tutorial in Hindi...

➡️ ES5 & ES6 | ECMAScript 6 in One Video in Hindi:    • ES5 & ES6 | ECMAScript 6 in One Video...

➡️ JavaScript Game Development Series in 2020:    • JavaScript Game Development Hindi 2020

On this page of the site you can watch the video online Complete Next.js 13.4 Tutorial in Hindi🔥FullStack Website using NextJS, React Server Comp. & MongoDB with a duration of hours minute second in good quality, which was uploaded by the user Thapa Technical 22 April 2023, share the link with friends and acquaintances, this video has already been watched 209,345 times on youtube and it was liked by 2.4 thousand viewers. Enjoy your viewing!

2,280