Next.js Ecommerce

22h 12m 23s
English
Paid

Next.js Ecommerce Course is a comprehensive 22-hour program that teaches step by step how to create a full-fledged e-commerce platform using Next.js 15, TypeScript, PostgreSQL, and Prisma.

Read more about the course

Main Features of the Course:

  • Full Stack Development:
    • Learn to create an e-commerce platform with features such as an admin panel, product reviews, and payment integrations with PayPal and Stripe.
  • TypeScript and Validation:
    • Utilize TypeScript for robust type checking and the Zod library for ensuring data integrity.
  • Database Management:
    • Master PostgreSQL and Prisma for efficient database modeling and migrations.
  • Working with Forms:
    • Apply React Hook Form for convenient form management in your application.
  • Authentication:
    • Set up authentication systems using Next Auth, including JWT, sessions, and cookies for secure user management.
  • UI Components:
    • Use the ShadCN UI component library to create a responsive and user-friendly interface.
  • Testing:
    • Learn the basics of unit testing using Jest to ensure code reliability.

By the end of the course, you will gain skills in developing, deploying, and maintaining high-performance e-commerce web applications, ready to tackle real-world web development challenges.

Watch Online Next.js Ecommerce

Join premium to watch
Go to premium
# Title Duration
1 Welcome To The Course 05:21
2 The Stack 05:37
3 The Project 06:03
4 The Environment 04:54
5 Premium Docs 01:35
6 Section Intro 02:00
7 Create Next App & Assets 07:48
8 ShadCN UI Setup 04:45
9 Root Layout & Constants 10:05
10 Header & Footer Components 09:34
11 Theme Mode Toggle 13:30
12 Loading & Not Found Page 08:52
13 Responsive Sheet Menu 08:12
14 Sample Products & Product List 09:35
15 Product Card Component 06:43
16 Product Price Component 04:59
17 Section Intro 02:37
18 PostgreSQL & Prisma Setup 04:15
19 Prisma Models & Migrations 09:10
20 Seed Sample Data 04:05
21 Load Products From Database 10:16
22 Zod Validtation & Type Inference 16:52
23 Serverless Environment Config 08:10
24 Product Details Page 14:50
25 Product Images Component 08:00
26 Initial Deployment 04:57
27 A Note On ES Lint Errors 02:27
28 Section Intro 02:58
29 Prisma User-Related Models 09:46
30 Seed User Data 07:01
31 Next Auth Setup 17:32
32 Sign In & Sign Out Action 08:28
33 Auth Layout & Sign In Page 06:59
34 Credentials Sign In Form 06:40
35 Hook Up Sign In Form 09:29
36 Callback URL Redirect 04:27
37 User Button & Sign Out 11:49
38 Sign Up Zod Schema & Action 08:16
39 Sign Up Page & Form 07:36
40 Sign Up Error Handling 12:41
41 Customize Token With JWT Callback 08:20
42 Section Intro 01:10
43 Cart Zod Schema & Prisma Model 13:02
44 Add To Cart Component 12:02
45 Session Cart ID Cookie 08:29
46 Get Item From Cart 13:15
47 Price Calc & Add To Database 15:39
48 Handle Quantity & Mutliple Products 11:46
49 Remove Cart Action 08:02
50 Dynamic Cart Button 08:02
51 Smooth UI With useTransition Hook 05:58
52 Section Intro 01:23
53 Cart Page 08:24
54 ShadCN UI Table 10:53
55 Subtotal Card 08:08
56 Shipping Address Zod Schema & Page 09:31
57 Shipping Address Form 20:08
58 Update User Address 08:22
59 Checkout Steps 07:02
60 Persist Session Cart 05:31
61 Protecting Paths 05:48
62 Section Intro 01:32
63 Payment Method Action & Zod Schema 09:28
64 Payment Method Page 08:02
65 Payment Method Form & Update 13:10
66 Order & OrderItem Prisma Schema 11:08
67 Order Zod Schemas & Types 08:17
68 Place Order Page 18:06
69 Create Order Action 14:16
70 Place Order Form 07:38
71 Order Page & Action 08:28
72 Format Utility Functions 08:22
73 Order Details Table 14:06
74 Section Intro 01:14
75 PayPal Sandbox Setup 03:33
76 Generate Access Token 07:21
77 Jest Test For Access Token 07:43
78 Create Order & Capture Payment Request 08:46
79 Jest Testing For Order & Payment 08:08
80 Create PayPal Order Action 07:58
81 Approve & Update Order 15:31
82 Implement PayPal Button 12:05
83 Section Intro 01:07
84 User Layout & Menu 14:01
85 Get My Orders Action 05:29
86 Orders Page 12:57
87 Orders Pagination 15:29
88 Update Profile Action 05:37
89 Update Profile Form 12:10
90 Profile Form Submission 06:54
91 Section Intro 00:56
92 Admin Layout & Menu 08:07
93 Get Order Summary 10:22
94 Admin Overview Data Display 16:48
95 Monthly Sales Chart 08:25
96 Admin Orders Page & Action 11:32
97 Delete Orders 15:54
98 Update Order Actions (COD) 05:41
99 Update Order Buttons (COD) 13:03
100 Section Intro 01:12
101 Get Products For Admin Page 08:25
102 Display Products 07:56
103 Delete Products 04:17
104 Create & Update Actions 08:31
105 Create Product Page & Form 09:36
106 Form Fields & Slugify 13:28
107 Create Product Form Submission 06:24
108 Uploadthing Configuration 08:10
109 Add Image Uploads 12:57
110 Product Cleanup 07:58
111 Is Featured & Banner 08:56
112 Product Update Form 09:59
113 Section Intro 01:09
114 Get & Display Users 12:58
115 Delete Users 03:13
116 User Edit Page 09:15
117 Update User Form 14:17
118 Update User Action 06:49
119 Admin Search Form 11:05
120 Admin Order Search 05:42
121 Admin User Search 03:16
122 Section Intro 01:20
123 Category Drawer 08:45
124 Featured Products Carousel 13:34
125 Search Component 08:39
126 Search Page 12:53
127 Search Filters 10:56
128 Get Filter URL Function 06:38
129 Category & UI Price Filters 09:52
130 Rating Filter & Filter Display 10:02
131 Sorting Products 05:51
132 Dynamic Metadata 07:47
133 Section Intro 01:00
134 Review Prisma Schema, Zod & Type 10:33
135 Review List Component 09:28
136 Review Form Dialog 15:31
137 Create & Update Review Action 11:51
138 Connect Review Form To Action 07:03
139 Get Reviews Action 03:49
140 Display Reviews 12:01
141 Update & Reload Reviews 03:59
142 Section Intro 01:41
143 Stripe Setup 04:45
144 Order Form Payment Intent 11:53
145 Stripe Payment Component 17:21
146 Stripe Payment Success Page 11:17
147 Webhook To Mark Orders As Paid 13:51
148 Section Intro 01:02
149 Resend API Key & Setup 02:55
150 Resend Main Function 05:43
151 Purchase Receipt Email Template 13:17
152 Preview Email In Browser With React Email 12:49
153 Sending Emails 04:45
154 Section Intro 00:46
155 Icon Boxes Component 03:49
156 Deal Countdown Components 18:53
157 Wrap Up 01:18

Similar courses to Next.js Ecommerce

Real-Time Collaborative Apps with Next.js and Supabase

Real-Time Collaborative Apps with Next.js and Supabasefullstack.io

Category: Next.js
Duration 51 minutes 59 seconds
MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejs

MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejsudemy

Category: React.js, Next.js, Node.js, MongoDB, Socket.IO
Duration 13 hours 2 minutes 12 seconds
Next.js 14 Real-Time Chat App using Socket IO

Next.js 14 Real-Time Chat App using Socket IOudemy

Category: Next.js, Socket.IO
Duration 12 hours 22 minutes 25 seconds
Advanced NextJS WooCommerce REST API, TailwindCSS - Part-2

Advanced NextJS WooCommerce REST API, TailwindCSS - Part-2udemy

Category: Next.js, Wordpress
Duration 8 hours 6 minutes 25 seconds
Next.js 14 & React - The Complete Guide

Next.js 14 & React - The Complete GuideudemyAcademind Pro

Category: React.js, Next.js
Duration 36 hours 13 minutes 15 seconds
Stripe for SaaS

Stripe for SaaSfireship.io

Category: Next.js
Duration 1 hour 11 minutes 29 seconds
The Joy of React

The Joy of ReactJosh Comeau

Category: React.js, Next.js
Duration 25 hours 35 minutes 33 seconds
Full Stack Development

Full Stack Developmentneetcode.io

Category: TypeScript, Next.js
Duration 4 hours 24 minutes 36 seconds
Next.js Firebase - The Full Course

Next.js Firebase - The Full Coursefireship.io

Category: Next.js, Firebase
Duration 2 hours 38 minutes 13 seconds