Ultimate Next.js Course 2024 Edition

29h 39m 9s
English
Paid
June 25, 2024

Learn to build a fully functional web application using React and Next.js. This course covers topics like authentication, ORM, creating responsive UIs, integrating Stripe for payment processing, and more. You'll learn to create elegant and functional applications using modern technologies like Algolia, Framer Motion, and React Hook Form. By the end of the course, you'll be able to confidently develop complex applications and enhance user experience. The course also includes practical projects and real-world examples to help you master the skills in demand in the job market.

More

Tech stack:

  • Next.js 14,2
  • Next-Auth V5
  • Drizzle ORM
  • Postgresql
  • Zustand
  • Algolia
  • Framer Motion
  • NeonDB
  • Resend
  • React Hook Form
  • Shad/CN
  • Stripe Elements

Watch Online Ultimate Next.js Course 2024 Edition

Join premium to watch
Go to premium
# Title Duration
1 1. Project Introduction 09:07
2 2.Setting Up Node 03:12
3 3.Project Structure 05:58
4 4.Routing 05:21
5 5.Layout 05:19
6 6.Page Component 10:01
7 7.Route Groups 01:45
8 8.Parallel Routes 03:17
9 9.Loading Page 01:21
10 10.Error Page 01:22
11 11.Route Handlers 02:09
12 12.Middleware 02:49
13 1. Caching 07:15
14 2.Setting up NeonDB with Drizzle 04:42
15 3. Schemas and Migrations 07:01
16 4.Server Actions 06:33
17 5.Mutating and Revalidating 05:30
18 6.Progressively Enhanced Forms 04:03
19 1. Tailwind Intro 08:26
20 2. Tailwind Config and extensions 03:10
21 3.Layers and components 02:31
22 4.Adding shadcn to our project 06:19
23 1.Which Auth Solution To Use? 04:44
24 2. Next-Auth V5 07:33
25 3.Setting Up Google and Github Providers 04:57
26 4. Save Users With Drizzle Adapter to your DB 07:31
27 5.Creating Our Navbar 08:57
28 6. Sign In Button 04:43
29 7.Login Page 18:11
30 8.Styling Our Login Page 10:33
31 9. React-Hook-Form + Zod Part 1 11:11
32 10. React-Hook-Form + Zod Part 2 12:13
33 11.Creating Our Sign In Action 07:21
34 12.Form Error and Success Components 08:59
35 13.Creating Our Register Page 12:25
36 14.Register Action 12:33
37 15.Email Token Drizzle Schema 05:01
38 16.Generate Verification Tokens 14:02
39 17.Resend 15:17
40 18. Confirm Users Email Address 13:21
41 19. Login Authorize 14:41
42 20.Password Reset Form 19:48
43 21.Finishing Up Password Resets + HTTP and Websockets 22:53
44 22. User Dropdown Menu 19:09
45 23. Theme Your App 18:50
46 24. User Preferences 29:06
47 25. JTW and Session Callbacks 10:26
48 26. Update User Preferences 14:36
49 27. Two Factor Tokens 30:40
50 28. Setting up UploadThing 16:06
51 1. Animations with Framer Motion 25:20
52 2. Create Product Form 19:45
53 3. Drizzle Product Schema 03:42
54 4. Integrating TipTap Rich Text Editor 19:54
55 5. Create/Edit Product Server Action 09:58
56 6. Sonner Notifications 08:29
57 7. Setting Up Tanstack Table 20:00
58 8. Edit and Delete Products 13:15
59 9. Finishing our Server Actions 13:48
60 10. Filtering and Pagination 11:08
61 11. Drizzle One/Many Relations 11:51
62 12. Product Variant Wrapper 15:18
63 13. Server Component Shananigans 04:44
64 14. Variant Form 14:19
65 15 Input Tags 18:44
66 16. Variant Images with Uploadthing 34:48
67 17.Variant Actions 21:53
68 18.Deleting Variants 05:19
69 19.Indexing With Algolia 14:34
70 20. Shifting Layout Fix 02:21
71 21. Bad State Call Fix 01:50
72 1. Displaying our products 17:21
73 2. Adding our products 03:51
74 3. URL Routing with Product Picker 27:19
75 4. Shad/CN Carousel 17:33
76 5. Review Form 19:38
77 6. User Review Action 13:35
78 7. New Drizzle Kit Config 04:42
79 8. Star System 19:47
80 9. Review Chart 16:51
81 10. Zustand 16:41
82 11. Add To Cart 16:05
83 12. Remove From Cart 14:36
84 13.Price Animation and Local Storage Persist 25:21
85 14.Cart Progress 17:24
86 15.Order Table 04:53
87 16.Stripe Elements 35:22
88 17.Creating Orders 17:07
89 18.Order Confirmation Page 09:23
90 19.Order Details Dialog 24:00
91 20.Quality Of Life Improvements 15:28
92 21. Stripe CLI and Webhooks 17:41
93 22. Analytics Page 24:10
94 23. Recharts 36:39
95 24. Cart Progress Animation 11:57
96 25. Algolia Search 25:36
97 26. Tag System 15:16
98 Deployment 20:31
99 1. Getting Started 00:37
100 2. Setting up Next with Tailwind 06:02
101 3. Prisma Schemas 15:35
102 4. Next Auth With Prisma 21:39
103 5. Creating A Stripe Customer 15:52
104 6. Creating our Navbar 23:17
105 7. Fetching Stripe Products 16:32
106 8. Formatting Prices 10:11
107 9. Styling our home page 09:51
108 10. Product Description Page 23:01
109 11. State Managment With Zustand 16:18
110 12. Adding Products to Cart 26:40
111 13. Cart UI 09:58
112 14. Adding and Removing Products 12:11
113 15. Empty Carts 04:45
114 16. Adding Google Fonts 06:03
115 17. Total Price Format 04:04
116 18. Framer Motion 16:10
117 19. Keeping It Mobile Friendly 03:35
118 20. Getting Started with Stripe 17:11
119 21. Stripe Order Data 26:57
120 22. Saving orders 32:49
121 23. Rendering Stripe Form 30:34
122 24. Success Page 28:37
123 25. Stripe Webhooks 26:47
124 26. Dashboard Page 30:20
125 27. More Dashboard Styling 06:58
126 26. Lottie Animations 11:10
127 27. Daisy UI 17:22
128 28. Adding a dropdown 10:02
129 29. Dark Light Mode 18:05
130 30. Stripe Darkmode 13:15
131 31. Adding Different Fonts 03:56

Similar courses to Ultimate Next.js Course 2024 Edition

Build a Jira clone

Build a Jira cloneCode With Antonio

Duration 16 hours 26 minutes 4 seconds
Next.JS with Sanity CMS - Serverless Blog App (w/ Vercel)
Next.js Projects: Build an Issue Tracker
Server side rendering with Next + React

Server side rendering with Next + Reactudemy

Duration 29 hours 43 minutes 19 seconds
Full Stack Development

Full Stack Developmentneetcode.io

Duration 4 hours 24 minutes 36 seconds
Mastering Next.js - 50+ Lesson Video Course on React and Next
React Node AWS - Build infinitely Scaling MERN Stack App
Stripe for SaaS

Stripe for SaaSfireship.io

Duration 1 hour 11 minutes 29 seconds
The Ultimate NextJs Course

The Ultimate NextJs Coursehamedbahram.io

Duration 15 hours 7 minutes 33 seconds