Next JS Full Course with Project | Tamil
Download Project: https://github.com/jvlcode/nextjs-blo...
Discover the power of Next.js with this comprehensive tutorial on creating a blog project from scratch! 🚀 In this video, we'll explore everything from the basics of Next.js, including the App Router vs Pages Router, to advanced topics like dynamic routes, server vs client components, and integrating MongoDB.
Learn how to set up your project, build pages, and manage routing with practical examples. Dive into creating and setting up your blog, from crafting the home page and headers to implementing post details and search functionality. We’ll also cover key concepts like route handlers, custom fields, and environment variables. Plus, get hands-on experience with creating and testing a contact form, and integrating metadata for enhanced SEO.
Whether you're a beginner or looking to refine your skills, this tutorial is packed with actionable insights and tips for building a robust Next.js application. Don't forget to like, comment, and subscribe for more web development content!
#NextJS #WebDevelopment #JavaScript #React #NextJSProject #DynamicRoutes #MongoDB #API #Routing #SEO #ServerComponents #ClientComponents #BlogDevelopment #CodingTutorial #ProgrammingTimestamps:
00:00 Intro
02:11 What is Next JS
3:11 App Router vs Pages Router
4:31 Creating Project
8:33 Running Project
10:36 Project Structure
13:43 Routing
21:37 Route Segments
24:12 Layouts
32:55 Linking and Navigating
37:29 useRouter Hook
44:20 Server Components vs Client Components
47:38 Dynamic Routes
53:05 Multiple Dynamic Segments
55:46 Route Handlers
1:05:51 Getting Request Data
1:10:22 Blog Project using Next JS
1:11:04 Create & Setup Project
1:15:32 Creating Home Page
1:21:52 Creating Header & Footer
1:28:17 Creating About and Contact Pages
1:34:22 Navigation Links
1:39:09 Creating Post List API
1:41:28 Connecting MongoDB
1:47:09 Creating Post Model using Mongoose
2:04:04 Show Post List using API
2:11:39 Public Environment Variables
2:15:54 Custom Field Post Data
2:25:21 Create Post Details Page
2:28:36 Creating Post Details API
2:37:16 Changing Date Format
2:42:51 Showing Post Details using API
2:50:11 Implementing Post Search
3:14:51 Working with Contact Form
3:16:01 Creating Enquiry Model
3:19:11 Creating Enquiry API
3:31:51 Customizing Error Message
3:34:21 Integrating Contact Form with API
3:45:16 Testing Contact Form
3:48:51 Using Meta Data
3:53:46 Using Meta Data with Client Component
3:57:16 Dynamic MetaData
4:06:23 Conclusion
🤝 *Donate & Help this Channel:*
UPI: 9444914384@okbizaxis
PayPal: https://paypal.me/jvlogesh
Buy me Kofi : https://ko-fi.com/jvlcode
🌐 *Join Udemy Courses*
React Developer Course: https://www.udemy.com/course/angular-...
Angular Course: https://www.udemy.com/course/angular-...
📧 *Contact Information:*
📬 Email: [email protected]
🔗 LinkedIn: / jvl-code
📷 Instagram: / jvlcode
📱 Whatsapp: https://whatsapp.com/channel/0029VaCu...
📘 Facebook: / jvlcode
🌐 Website: https://www.jvlcode.com
🔔 For business inquiries or collaborations, please use the provided contact information. Thank you for your support! Don't forget to like, share, and subscribe for more content! 🔔