Clear. Concise. Comprehensive. Tired of piecing together disconnected tutorials or dealing with rambling, confusing instructors? This course is for you! It's perfectly structured into a series of bite-sized, easy-to-follow videos that cover both theory and practice.
Mastering Next.js 13 with TypeScript
5h 16m 33s
English
Paid
Mastering Next.js 13 with TypeScript is a 83-lesson 5 hours 16 minutes self-paced course by Mosh Hamedani (Code with Mosh). Clear.
Course facts
- Lessons
- 83
- Duration
- 5 hours 16 minutes
- Level
- All levels
- Language
- English
- Updated
- Instructor
- Mosh Hamedani (Code with Mosh)
- Price
- Premium
What You'll Learn
- Confidently build full-stack apps with Next.js 13+ and TypeScript
- Style Next.js applications with Tailwind or CSS modules
- Implement routing and navigation using the new App router
- Build RESTful APIs
- Use Prisma to integrate your Next.js apps with a database
- Handle file uploads
- Implement user authentication with NextAuth.js
- Send beautifully styled emails
- Optimize your apps for performance and SEO
- Deploy your Next.js apps
- Use VSCode shortcuts to increase your productivity
- Apply the latest techniques and best practices
- Troubleshoot errors with ease
Additional
Who teaches Mastering Next.js 13 with TypeScript? Mosh Hamedani (Code with Mosh)
Mosh Hamedani is the founder of Code with Mosh, one of the highest-volume independent online instructors in software education. He has been publishing courses continuously since the early Udemy era and has taught over a million students across his Udemy catalog and his standalone Code with Mosh platform. His teaching style is patient, rigorously structured, and deliberately beginner-tolerant — the courses are widely cited as some of the most accessible introductions to their respective topics.
The Code with Mosh catalog covers an unusually wide span: web development with HTML / CSS / JavaScript / React / Angular / Node.js, Python and Django, C# and .NET, mobile development with React Native and Flutter, SQL and database fundamentals, and the algorithm / data-structure interview prep tracks. Few independent instructors maintain this much breadth at consistent quality.
The CourseFlix listing under this source carries over 35 Code with Mosh courses spanning that range. Material is paid; Code with Mosh runs on per-course pricing on the original platform. Courses are aimed primarily at developers picking up a new technology from a clean start through to working production proficiency.
What lessons are included in Mastering Next.js 13 with TypeScript?
0:00
/ #1: 1- Introduction
All Course Lessons (83)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | 1- Introduction Demo | 02:22 | |
| 2 | 2- Prerequisites | 01:04 | |
| 3 | 3- Course Overview | 01:25 | |
| 4 | 1- Introduction | 00:39 | |
| 5 | 2- What is Next.js | 02:41 | |
| 6 | 3- Setting Up the Development Environment | 01:25 | |
| 7 | 4- Creating Your First Next.js Project | 02:22 | |
| 8 | 5- Project Structure | 02:50 | |
| 9 | 6- Routing and Navigation | 05:16 | |
| 10 | 7- Client and Server Components | 08:13 | |
| 11 | 8- Data Fetching | 06:05 | |
| 12 | 9- Caching | 02:25 | |
| 13 | 10- Static and Dynamic Rendering | 04:09 | |
| 14 | 1- Introduction | 00:21 | |
| 15 | 2- Global Styles | 02:35 | |
| 16 | 3- CSS Modules | 04:27 | |
| 17 | 4- Tailwind CSS | 07:40 | |
| 18 | 5- DaisyUI | 07:17 | |
| 19 | 1- Introduction | 00:27 | |
| 20 | 2- Routing Overview | 03:54 | |
| 21 | 3- Dynamic Routes | 04:00 | |
| 22 | 4- Catch-all Segments | 02:54 | |
| 23 | 5- Accessing Query String Parameters | 07:09 | |
| 24 | 6- Layouts | 08:11 | |
| 25 | 7- Navigation | 03:29 | |
| 26 | 8- Programmatic Navigation | 03:11 | |
| 27 | 9- Showing Loading UIs | 06:15 | |
| 28 | 10- Handling Not Found Errors | 02:41 | |
| 29 | 11- Handling Unexpected Errors | 07:20 | |
| 30 | 1- Introduction | 00:37 | |
| 31 | 2- Getting a Collection of Objects | 03:15 | |
| 32 | 3- Getting a Single Object | 03:20 | |
| 33 | 4- Creating an Object | 04:38 | |
| 34 | 5- Updating an Object | 04:25 | |
| 35 | 6- Deleting an Object | 02:06 | |
| 36 | 7- Validating Requests with Zod | 04:17 | |
| 37 | 8- Exercise- Building Products API | 04:59 | |
| 38 | 1- Introduction | 00:45 | |
| 39 | 2- Installing MySQL | 01:59 | |
| 40 | 3- Setting Up Prisma | 04:58 | |
| 41 | 4- Defining Models | 04:01 | |
| 42 | 5- Creating Migrations | 05:45 | |
| 43 | 6- Creating a Prisma Client | 02:50 | |
| 44 | 7- Getting Data | 04:15 | |
| 45 | 8- Creating Data | 04:19 | |
| 46 | 9- Updating Data | 02:27 | |
| 47 | 10- Deleting Data | 01:25 | |
| 48 | 11- Exercise- Storing Products in DB | 03:31 | |
| 49 | 1- Introduction | 00:16 | |
| 50 | 2- Choosing a Cloud Platform | 01:05 | |
| 51 | 3- Setting Up Cloudinary | 01:53 | |
| 52 | 4- Uploading Files | 04:36 | |
| 53 | 5- Showing Uploaded Images | 04:39 | |
| 54 | 6- Customizing the Upload Widget | 01:54 | |
| 55 | 1- Introduction | 00:57 | |
| 56 | 2- Setting Up Next Auth | 04:39 | |
| 57 | 3- Configuring Google Provider | 11:22 | |
| 58 | 4- Understanding Authentication Sessions | 03:30 | |
| 59 | 5- Accessing Sessions on the Client | 06:15 | |
| 60 | 6- Accessing Session on the Server | 01:56 | |
| 61 | 7- Signing Out Users | 01:20 | |
| 62 | 8- Protecting Routes | 05:16 | |
| 63 | 9- Database Adapters | 06:39 | |
| 64 | 10- Configuring CredentialsProvider | 07:12 | |
| 65 | 11- Registering Users | 07:14 | |
| 66 | 1- Introduction | 00:16 | |
| 67 | 2- Setting Up React Email | 02:27 | |
| 68 | 3- Creating an Email Template | 02:07 | |
| 69 | 4- Previewing Emails | 02:11 | |
| 70 | 5- Styling Emails | 03:10 | |
| 71 | 6- Sending Emails | 04:35 | |
| 72 | 1- Introduction | 00:26 | |
| 73 | 2- Optimizing Images | 11:34 | |
| 74 | 3- Using Third-party Scripts | 04:56 | |
| 75 | 4- Using Fonts | 06:51 | |
| 76 | 5- Search Engine Optimization | 02:47 | |
| 77 | 6- Lazy Loading | 10:38 | |
| 78 | 1- Introduction | 00:16 | |
| 79 | 2- Preparing for Production | 05:28 | |
| 80 | 3- Pushing the Code to GitHub | 03:07 | |
| 81 | 4- Deploying to Vercel | 03:45 | |
| 82 | 5- Troubleshooting Deployment Errors | 04:11 | |
| 83 | 1- Course Wrap Up | 00:26 |
Unlock unlimited learning
Get instant access to all 82 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionBooks
What courses are similar to Mastering Next.js 13 with TypeScript?
Updated 3mo agoBuild an Instagram Clone with NestJS & Next.js – Fullstack Mastery
By: Michael GuayMaster the development of Instagram clones using NestJS and Next.js. Build scalable applications and enhance your full-stack skills.15h 40m5/5
UpdatedBuild Your SaaS AI Web Platform From Zero to Production
By: Code4StartupBuild and launch a microservice AI-SaaS platform from scratch, including a real Chat-with-PDF product and its business model.8h 36m5/5
ClassicTypeScript Masterclass
By: The Net NinjaTypeScript is a strongly typed programming language built on top of JavaScript, with additional features added in - primarily the ability to add types.5h 21m5/5
Updated 1y agoBuild and Deploy a SaaS AI Agent Platform
By: Antonio Erdeljac (Code With Antonio)Embark on an innovative journey with our comprehensive course designed to teach you how to build and deploy a cutting-edge SaaS AI Agent Platform .13h 24m
Updated 2y agoUltimate Next.js Course 2024 Edition
By: Dev EdMaster the art of building dynamic and efficient web applications using React and Next.js with our comprehensive course.29h 39m5/5
Updated 2y agoAdvanced NextJS WooCommerce REST API, TailwindCSS - Part-2
By: UdemyThis is part two of the course "Advanced NextJS WooCommerce With REST API And TailwindCSS". If you haven't already please complete the previous part of the cour8h 6m
Updated 3y agoNext JS & Typescript with Shopify Integration - Full Guide
By: UdemyYou will build an e-commerce application from scratch. You will learn how to write code in Typescript language, a superset of Javascript providing additional fe27h 55m
Updated 9mo agoBuild a Full-Stack Todo App with Turborepo, tRPC, Next.js, NestJS & React Native
By: Michael GuayLearn to build a full stack todo app with TypeScript, Turborepo, tRPC, Next.js, NestJS, and React Native. You build web, backend, and mobile parts with steps.2h 47m
More courses by Mosh Hamedani (Code with Mosh)
ClassicReact: Intermediate Topics
Advance your React skills with the Intermediate Topics course. Learn state management, routing, and best practices for building complex applications using React6h 5m4/5
Updated 3y agoThe Ultimate Django Series: Part 3
Master advanced techniques and best practices for building professional-quality backends.4h 18m
FreeUpdated 3y agoUltimate C++ Part 3: Advanced
To take this course, you should have watched the first two parts or have a thorough understanding of the concepts covered there.3h 41m5/5
UpdatedXamarin Forms: Build Native Mobile Apps with C#
Build native iOS, Android, and Windows apps from one C# codebase with Xamarin Forms, taught step by step by Mosh Hamedani.7h 17m
Updated 3y agoThe Ultimate Redux Course
Redux is the most popular state management library for JavaScript apps. It's mostly used with React but it's also becoming popular in Angular, Ember and Vue com6h 5m5/5
FreeClassicThe Ultimate Django Series: Part 1
Have you always wanted to learn Web development with Python but didn't know where to start? Tired of lengthy, confusing, and outdated courses?4h 49m5/5
Frequently asked questions
What are the prerequisites for this course?
Before enrolling in this course, you should have a basic understanding of JavaScript and familiarity with React. These skills are essential as the course focuses on using Next.js, which builds upon React concepts. Additionally, some experience with TypeScript will be beneficial, although the course is designed to help you learn and apply TypeScript within the context of Next.js projects.
What projects will I build in this course?
Throughout the course, you will engage in various projects that reinforce your learning. One notable project involves building a Products API, which includes creating, updating, and deleting objects and validating requests with Zod. Additionally, you will work on exercises related to storing products in a database using MySQL and Prisma. These practical projects are designed to reinforce your understanding of Next.js and TypeScript in real-world applications.
Who is the target audience for this course?
This course is ideal for web developers who want to enhance their skills in building server-side rendered applications using Next.js and TypeScript. It's suitable for those who have a fundamental understanding of JavaScript and React and are looking to learn about modern web development practices, including data fetching, dynamic routing, and integrating authentication and databases.
How does this course compare to other Next.js courses in terms of scope?
This course offers a comprehensive exploration of Next.js 13 with a specific focus on TypeScript. It covers a wide range of topics, including client and server components, data fetching, routing, rendering, and global styles. Additionally, it delves into advanced topics like setting up authentication and using Cloudinary for file uploads. Its structured approach includes practical exercises to solidify learning, making it more thorough compared to courses that only cover basic Next.js concepts.
What specific tools and platforms will I learn about in this course?
You will learn to use several powerful tools and platforms, including Next.js for building applications, TypeScript for type safety, and Prisma for database management. The course also covers setting up authentication with Next Auth and integrating Google as a provider. Additionally, you'll work with Cloudinary to handle file uploads and image management, providing a robust skillset for modern web application development.
What topics are not covered in this course?
While the course covers a broad range of essential topics for Next.js and TypeScript development, it does not delve into backend frameworks outside of the context of Prisma and MySQL. It also does not cover frontend frameworks other than Tailwind CSS and DaisyUI for styling. Advanced topics such as GraphQL or WebSockets are not part of the curriculum, focusing instead on RESTful APIs and standard rendering practices.
How much time should I expect to commit to this course?
The course consists of 83 lessons, each structured as bite-sized videos. Although the total runtime is not specified, you should allocate enough time to not only watch the lessons but also engage with the practical exercises and projects. Given the depth and breadth of the topics covered, a dedicated learner might spend several weeks completing the course, depending on their prior experience and the time they can commit each week.