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
Released
Added to CourseFlix
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
- Language
- English
- Released
- September 2023
- Added to CourseFlix
- November 2023
- 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 |
Watch the other 82 lessons
One payment unlocks this course and every other premium course. No auto-renew.
See plansBooks
What courses are similar to Mastering Next.js 13 with TypeScript?
Updated 2y agoFULL Authentication WITH REACT JS NEXT JS TYPESCRIPT
By: UdemyThis is simply the best course on the internet if you want to build and deploy the best authentication system that you can take and use in all of your projects6h 52m
ClassicBuild A Canva Clone
By: Antonio Erdeljac (Code With Antonio)In this 18-hour course, we will create a graphic design platform with a variety of features.17h 48m5/5
Updated 2y agoPractical Typescript
By: UdemyEmbark on a comprehensive journey into the world of TypeScript with our "Practical TypeScript" course.20h 10m
Updated 1mo agoReact & TypeScript Mastery
By: Beto MoedanoLearn React and TypeScript from fundamentals to a full eCommerce app with Firebase auth, Stripe payments, and a shopping cart.24h 15m5/5
Updated 1mo agoTypeScript Basics
By: Ultimate Courses (Todd Motto)A practical first course in TypeScript: static typing, the compiler, ES6/7 features, classes and functions, for JavaScript developers.3h 59m
Updated 1mo agoResponsive LLM Applications with Server-Sent Events
By: Fullstack.ioBuild a streaming LLM application with TypeScript, React, and Python, covering chat, RAG, and AI agent scenarios via SSE.1h 18m5/5
Updated 1mo agoNext.JS with Sanity CMS - Serverless Blog App (w/ Vercel)
By: UdemyBuild a serverless blog with Next.js and Sanity CMS across 81 lessons: content modeling, filtering, dark mode, and Vercel deployment.13h 5m
Updated 1mo agoServer side rendering with Next + React
By: UdemyBuild server-side rendered apps with Next.js and React, adding Redux, MongoDB, and Auth0, then deploy a full project live on Heroku.29h 43m
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
Updated 1mo agoXamarin 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.