Mastering Next.js 13 with TypeScript
5h 16m 33s
English
Paid
Course description
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.
Read more about the course
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
Watch Online
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
Read Book Mastering Next.js 13 with TypeScript
| # | Title |
|---|---|
| 1 | Book 1 |
| 2 | Book 2 |
| 3 | Book 3 |
| 4 | Book 4 |
| 5 | Book 5 |
| 6 | Book 6 |
| 7 | Book 7 |
| 8 | Book 8 |
| 9 | Book 9 |
| 10 | Book 10 |
| 11 | Book 11 |
| 12 | Book 12 |
| 13 | Book 13 |
Comments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
NestJS + Next.js: Event Driven Architecture
Sources: Michael Guay
Learn how to create an event-driven architecture with NestJS and Next.js. The course covers EventEmitter and SSE for developing real-time systems.
45 minutes 9 seconds
Next.js Complex State Management Patterns with RSC
Sources: fullstack.io
In the dynamic world of web development, mastering complex state management is an essential skills. And since version 13, Next.js introduced a new type of compo
2 hours 56 minutes 24 seconds
Build a Youtube Clone
Sources: Code With Antonio
In this 24-hour course, you will learn how to create your own YouTube clone using modern technologies. We will go into detail on advanced topics, including...
23 hours 42 minutes 10 seconds
Zero To Shipped. The ultimate Next.js template
Sources: Kitze
Zero To Shipped is a powerful Next.js template designed to accelerate the full cycle of web application development. It offers a ready-made infrastructure with.
React & TypeScript - The Practical Guide
Sources: Academind Pro
TypeScript is an amazing technology that helps developers write better code with less errors - simply because it let's you catch & fix type-related errors whilst writing the cod...
7 hours 22 minutes 54 seconds