CourseFlix

NextJS E-Com Masterclass: Learn The All New Next JS

19h 17m 40s
English
Paid

Welcome to the NextJS E-Com Masterclass: Learn The All New Next JS!

Ready to create your very own online store? Join us on a fun-filled journey where you'll learn to build amazing e-commerce websites from start to finish. We'll show you how to use Next.js, a supercharged version of React, along with easy-to-understand tools like TypeScript, MongoDB, Cloudinary, and Mailtrap.

Don't worry if you're new to full stack development – I'll guide you every step of the way. By the end, you'll have a full-stack skill set and the ability to craft impressive online shops. Get started now and let's bring your e-commerce dreams to life!

Why Choose Next.js?

Why Next.js, you ask? Well, it's more than just another JavaScript library – it's a dynamic framework that supercharges your React applications with server-side rendering, efficient routing, and a fantastic developer experience. With the rise of e-commerce, having a deep understanding of Next.js is a game-changer, and that's exactly what you'll gain through our hands-on approach.

Tools and Technologies You Will Master

This course is designed to make you a well-rounded developer by introducing you to a variety of essential tools and technologies:

TypeScript

TypeScript is a user-friendly programming language that enhances JavaScript by adding type safety. You'll learn how to leverage its power to improve your code's reliability and clarity.

MongoDB

Discover MongoDB, a powerful and flexible database solution that allows you to manage data with ease. You'll learn to seamlessly integrate this database into your projects, enhancing your data management skills.

Cloudinary

With Cloudinary, a cloud-based image and video management platform, you can optimize media for better performance and user experience. We'll show you how to make the most of these capabilities in your applications.

Mailtrap

Master email testing and debugging with Mailtrap, a crucial tool for delivering reliable communication to your users. You'll become proficient in managing email functionality within your e-commerce site.

About the Author: udemy

udemy thumbnail
By connecting students all over the world to the best instructors, Udemy is helping individuals reach their goals and pursue their dreams. Udemy is the leading global marketplace for teaching and learning, connecting millions of students to the skills they need to succeed. Udemy helps organizations of all kinds prepare for the ever-evolving future of work. Our curated collection of top-rated business and technical courses gives companies, governments, and nonprofits the power to develop in-house expertise and satisfy employees’ hunger for learning and development.

Watch Online 171 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 171 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Project Intro
All Course Lessons (171)
#Lesson TitleDurationAccess
1
Project Intro Demo
11:16
2
Let Me Guide You
02:01
3
Node JS
01:41
4
Mongodb
02:28
5
VS Code
01:36
6
Node JS
01:30
7
Homebrew
01:07
8
Mongodb
02:29
9
Mongodb Compass
01:04
10
12-Running Mongodb In The Background
01:34
11
VS Code
00:49
12
Open With VS Code
01:01
13
React TS Project Setup
02:15
14
Rendering App
07:50
15
Component & Props
09:51
16
Input & Change Handler
09:43
17
Project Setup
11:35
18
Layout
03:42
19
Navbar
09:02
20
Navbar Explained
08:59
21
Sign up Form
04:20
22
Form State & Validation
08:27
23
Rendering Errors
09:24
24
API Route
07:33
25
Connecting to Local Database
04:16
26
User Model
07:39
27
Creating New User
05:27
28
Hashing Password
07:10
29
Comparing Password
04:52
30
Sending Emails
05:38
31
ChatGPT & Email Verification Token
10:45
32
Generating Verification Token
05:02
33
Email Verification Page
03:37
34
Verify Token Route
08:44
35
Verifying Token
06:07
36
Rendering Notification
04:33
37
Next Auth
11:25
38
Sign in Route
09:12
39
Sign in UI
08:09
40
Auth Session
05:36
41
Auth Errors
05:56
42
Sign out
04:43
43
Guest Route
07:06
44
Customizing Session
09:28
45
Forget Password UI
02:35
46
Forget Password API Route
07:06
47
Sending Link to Email
06:12
48
Submitting Request
04:59
49
Validating Password Reset Token
08:46
50
Resetting Password
15:23
51
Production Build
05:35
52
Publishing Application
09:53
53
Refactoring Send Email
10:55
54
Sign in along with Sign up
04:42
55
Private Route
05:17
56
Fixing Auth Session Profile
11:00
57
Email Reverification
13:38
58
Admin Sidebar
07:06
59
Fixing Navbar
06:55
60
Product Table
05:32
61
Product Form
11:36
62
Product Model
07:26
63
Server Action
07:32
64
Validating Product Info
05:50
65
Using Validation Schema
05:11
66
Cloud Storage
06:28
67
Cloud Signature
03:00
68
Uploading Image
08:40
69
Creating New Product
11:51
70
About Action
05:53
71
Fetching New Products
07:46
72
Update Product Page
08:15
73
Update Product Form
09:17
74
Fixing Warning
02:03
75
Let's Understand How to update
02:43
76
Remove Image From Cloud
01:55
77
Removing Images
13:36
78
Removing Images From Cloud
08:10
79
Update Product 1
11:05
80
Update Product 2
08:47
81
Generating Dummy Product
03:20
82
Generating Multiple Dummy Products
07:35
83
Pagination
07:42
84
Fetching & Rendering Products
06:46
85
Few Little Fixes
04:18
86
Dynamic Route
05:27
87
Rendering Single Product
07:10
88
Hero Slider
07:14
89
Cart Model
05:42
90
Cart API 1
05:41
91
Cart API 2
06:42
92
Adding to Cart
10:18
93
Featured Product Model
04:20
94
Featured Product Form
05:06
95
Submitting Featured Product Form
04:54
96
Creating Featured Product
04:50
97
Featured Product Table
01:56
98
Rendering Featured Product
02:59
99
Update Featured Product 1
06:26
100
Update Featured Product 2
05:02
101
Deleting Featured Product
07:12
102
Few Little Fixes
05:44
103
Featured Product Slider
07:44
104
Responsive Slider
02:47
105
Horizontal Scroll Menu
05:06
106
Products by Category
07:15
107
Cart Items Count
11:22
108
Profile Page
09:18
109
Updating User Profile
10:26
110
New Profile Page UI
08:00
111
Loading UI
08:29
112
Error Page
04:02
113
Image Component
07:20
114
Cart Page
03:58
115
Fetching Cart Details
18:45
116
Updating Cart Items
04:49
117
Deleting Cart
02:01
118
Empty Cart Message
02:25
119
Setting up Stripe
10:02
120
Checkout Session URL
15:31
121
Final Checkout
07:32
122
Order Model
07:27
123
Stripe CLI
04:09
124
Using Webhook
12:07
125
Creating New Order
10:41
126
Recounting Stock
04:05
127
Instant Checkout
07:55
128
Creating Order
06:58
129
Fetching Orders of Profile
05:08
130
Rendering Orders
04:17
131
Orders UI Admin
15:15
132
Update Delivery API Route
05:31
133
Updating Delivery Status
04:44
134
Review Form
05:57
135
Review Model
03:43
136
Create/Update Review
07:08
137
Submitting Review Form
05:47
138
Fetching Review Details
08:42
139
Rendering Reviews
08:28
140
Average Rating
09:11
141
Rating Stars
11:12
142
Rendering Rating Stars
05:45
143
Fetching Sales History
18:47
144
Sales Chart
08:57
145
Sales Page UI
04:02
146
Fixing Review Issue
06:32
147
Fixing Sales Page Issue
01:53
148
Out of Stock
02:15
149
Fetching Similar Products
03:12
150
Rendering Similar Products
08:58
151
Latest Order inside Profile Page
03:26
152
History Model
03:55
153
Recording History
08:50
154
Admin Search
08:19
155
Search Bar
04:49
156
Search Filter UI
02:35
157
Search Filter
18:38
158
Searching Products
09:21
159
Clear Filter
03:26
160
Wishlist Button
03:22
161
Wishlist Api Route
08:30
162
Updating Wishlist
04:04
163
Fetching Wishlisted Products
07:24
164
Wishlisted Products UI
07:44
165
Updating Wishlist
02:38
166
Using Real Database
11:55
167
Custom Domain
03:37
168
Verify Domain Inside Mailtrap
04:20
169
Sending Real Emails
10:49
170
The Fix
11:21
171
Stripe Webhook
07:15
Unlock unlimited learning

Get instant access to all 170 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription