Next.js From Scratch

Why take this course?
🌟 Course Title: Next.js From Scratch 2024 🚀
Headline: Build a Real-World Project Using Next.js 14 and MongoDB! 🖥️🏗️
Overview: Embark on a hands-on journey with our project-based course, "Next.js From Scratch 2024," where you'll leverage the latest features in Next.js 14 to create a comprehensive property rental website. This isn't just about coding; it's about understanding how to apply Next.js in practical, real-world scenarios. You'll learn to build dynamic, SEO-friendly web applications with ease, positioning yourself at the forefront of modern web development.
What You'll Learn: This course is designed to take you from the basics of Next.js to advanced application building. You'll gain experience with user authentication, authorization, and a suite of powerful features that will turn your ideas into fully-functional applications. By the end of this course, you'll be equipped with all the skills necessary to create your own full-stack Next.js apps with API routes.
Features of the Property Rental Website Project: ✅ User Authentication: Secure login with Google and Next Auth. ✅ User Authorization: Manage user permissions effectively. ✅ RESTful API Routes: Build server-side logic with ease. ✅ Route Protection: Secure your API routes from unauthorized access. ✅ User Profile: Create profiles that display user listings. ✅ Property Listing CRUD (Create, Read, Update, Delete): Manage property data comprehensively. ✅ Multiple Property Image Uploads: Enhance your listings with photos using Cloudinary. ✅ Property Search: Filter properties based on user-defined criteria. ✅ Photoswipe Image Gallery: Provide an elegant and responsive image viewer experience. ✅ Mapbox Maps Integration: Embed interactive maps to display property locations. ✅ Toast Notifications: Keep users informed with real-time updates. ✅ Bookmarking/Saved Properties: Allow users to save their favorite properties for later viewing. ✅ Social Media Sharing: Share your properties on social media platforms. ✅ Loading Spinners: Indicate loading states in a user-friendly manner. ✅ Responsive Design with Tailwind CSS: Ensure your application looks great on all devices. ✅ Custom 404 Page: Enhance the user experience with a custom error page.
Technologies and Packages Used: 🔹 Next.js 14: The react framework for production, with built-in support for static export, server-side rendering, and generating progressive web apps. 🔹 React: The declarative, efficient, and flexible JavaScript library for building user interfaces. 🔸 Tailwind CSS: Utility-first CSS framework for rapid UI development. 🔹 MongoDB & Mongoose: The NoSQL database and ODM for managing application data. 🔸 Next Auth: Authentication for Next.js applications using NextAuth.js. 🔹 React Icons: A collection of React icons for use in your projects. 🔸 Photoswipe: A modern, lightbox-style image gallery. 🔸 Cloudinary: A cloud-based service that provides a variety of solutions to store and deliver media objects including audio, video, documents, and images. 🔸 Mapbox: An embedded mapping solution with customizable maps. 🔸 React Map GL & React Geocode: Libraries for handling geolocation and mapping in React applications. 🔸 React Spinners: Visual indicators of a loading state. 🔸 React Toastify: A flexible, lightweight toast notification system. 🔸 React Share: A simple component to share the current page on social networks.
Why Take This Course? By completing "Next.js From Scratch 2024," you'll not only understand how to implement Next.js and MongoDB in your projects but also learn how to structure, scale, and maintain a modern web application. You'll be armed with the knowledge and experience to create responsive, secure, and user-friendly applications that stand out in the marketplace.
Join us on this comprehensive learning adventure and unlock the full potential of Next.js today! 🌟
Instructor: Brad Traversy 🎓
Ready to build something amazing with Next.js? Enroll now and let's get started! 🚀✨
Course Gallery




Loading charts...
Comidoc Review
Our Verdict
This Next.js From Scratch course is an excellent choice for beginners seeking a practical and hands-on introduction, but it leaves opportunities in captivating advanced learners through deeper exploration of core features and essential principles like DRY and best practices.
What We Liked
- Comprehensive real-world project utilizing Next.js and MongoDB, perfect for hands-on learners.
- In-depth exploration of essential features including user authentication, server actions, and route protection.
- Leverages a plethora of relevant packages & tools such as React, Tailwind CSS, Mongoose, Mapbox, Photswipe and more.
- Demonstrates versatile applications by implementing a rich set of features like property listing CRUD, image upload, search, internal messages, notifications among others
Potential Drawbacks
- Some sections may lack the depth in detail desired by learners; e.g., MongoDB functions and methods.
- Limited emphasis on essential principles like DRY (Don't Repeat Yourself) and best practices for code optimization.
- Occasionally sacrifices deeper understanding in favor of achieving functional webpages, potentially leaving advanced students wanting more.
- Real-world projects may include redundant or unoptimized code examples that lessen from the learning experience.