Ultimate Next.js 13 Course + eBook

51h 35m 4s
English
Paid
January 26, 2024

Enter the new era of React. Here’s a little known fact. 17% of the top 1 million websites use Next.js. And Next 13 usage in those top 1 million is doubling every month. 

More

1. Deep dive & understand how it works

Just knowing how to do something isn’t enough.

Not with ChatGPT, GitHub Copilot and new tools that can output better code every day.

See, understanding how the web actually works makes you future-proof.

You’ll be able to prompt little pieces of code and bring them together into a well-architectured app instead of getting replaced.

2. Build and deploy a complex app

If you have half the pieces of a puzzle?

You have a terrible puzzle.

That’s why theory, short tutorials, and docs aren’t enough. How do you actually bring it all together into a production-ready app?

That’s what separates a great dev from the mediocre junior who just takes on tasks given from above like a robot.

And finally ...

3. Active lessons so you’re 100% confident you can code it yourself

Look. The biggest issue with project-based tutorials is that people sometimes just follow along.

You need to practice yourself because no one will code the app for you.

This is why I added Active lessons.

Here you code the most important parts of the app.

You Master the features of Next13 to guarantee you walk away with the skills to build stunning apps with Next13 on your own.

Master the most sought-after tech stack of 2023 and beyond

You’ll need intermediate knowledge of JavaScript (eg. array methods, spread, try catch...) and beginner knowledge of React (components & JSX syntax, managing state, functional components) to take the course.

If you’re unfamiliar with these, don’t worry. We’ll provide you the resources to get you up to speed, but it definitely won’t be as easy as if you had experience beforehand.

If you’re asking if you need to know TypeScript - you don’t. Here at JSM we learn by building apps & this is the perfect chance to learn it since TypeScript is used in most industry projects.

Watch Online Ultimate Next.js 13 Course + eBook

Join premium to watch
Go to premium
# Title Duration
1 Intro 12:02
2 Prerequisites 04:36
3 Before Next.js 08:51
4 Introduction to Next.js 13:01
5 How Web Works 08:21
6 DevFlow Project Setup 04:46
7 Eslint Prettier Setup 10:43
8 Git-Github Setup 02:16
9 Tailwind CSS Setup 17:39
10 Code Architecture 03:51
11 What is Next.js Routing_ 21:03
12 Creating Routes for DevFlow 07:23
13 Client vs. Server Paradigm 15:43
14 Different Rendering Strategies 15:26
15 The Modern Auth Service 02:05
16 Setup Auth for DevFlow 08:27
17 Creating Layouts using Next-Font and Metadata in DevFlow 08:38
18 Creating a Global Theme Context for DevFlow 12:15
19 Container and User Account 12:29
20 Shadcn Installation 03:28
21 Theme Switcher and Mobile Navigation 41:28
22 Active Lesson 1 — Create a LeftSidebar 04:37
23 LeftSidebar Component 10:50
24 Active Lesson 2 — Create a RightSidebar 00:39
25 RightSidebar Component 17:27
26 Home Route 05:03
27 Active Lesson 3 — Create a LocalSearchbar 00:21
28 LocalSearchbar Component 08:30
29 Active Lesson 4 — Create a Filter 00:44
30 Home Filters 16:25
31 Create Question Card 50:54
32 Question Form and Validations 17:20
33 The Question Editor 09:30
34 Custom Multiple Tags Input 10:35
35 Making the Form Reusable 05:09
36 Thinking in Backend 08:50
37 MongoDB and Server Actions Setup 13:02
38 Creating Question Model 05:47
39 Creating a User Model 05:55
40 Creating a Tag Model 02:16
41 Create Question Action 24:09
42 Display Questions on the Home Page 15:59
43 Why _ what are Webhooks 03:01
44 Implement Webhooks and User Actions 16:12
45 Deploy Webhooks 29:23
46 Create Community Page 22:52
47 Create Tags Page 09:01
48 Create Question Details Page 14:52
49 Parse _ display Question Content 13:42
50 Create Answer Form 15:10
51 Create Answer Model 04:09
52 Implement Create Answer action 04:02
53 Integrate Create Answer action inside Answer Form 10:47
54 Display All Answers 21:34
55 Create Votes UI 09:54
56 Create Upvote-DownVote actions for Question 06:57
57 Integrate Question upvote-downvote actions on UI 11:34
58 Create Answer Voting 09:36
59 Implement Save Question Action and Create Collection Page 05:34
60 Display all saved questions 12:21
61 Create Question Details Page View 14:23
62 Create a Tag Details Page 17:52
63 Create Profile Page 25:59
64 Create User Stats UI 09:08
65 Implement User Questions Tab 08:47
66 Implement User Answers Tabs 14:30
67 Implement Edit-Delete Question-Answer Component 16:37
68 Create Edit Question Page 15:30
69 Create Edit Profile Page 22:58
70 Show Top Questions 03:38
71 Show Popular Tags 03:44
72 Manage search state 22:12
73 Implement Search functionality for the Home page 06:49
74 Implement Search functionality for the Community page 03:16
75 Implement Search functionality for the Collection page 01:34
76 Implement Search functionality for the Tags page 04:24
77 Manage Filter state 06:25
78 Integrate Filters on Home page 04:46
79 Integrate Filters on the Community page 06:42
80 Integrate Filters on the Collection page 03:45
81 Integrate Filters for Tags and Answers 08:32
82 Create Pagination component 10:40
83 Implement pagination on the Home page 05:42
84 Implement pagination for the rest of the pages 22:04
85 Create the Global Search UI 09:10
86 Create GlobalSearch Result Component 19:29
87 Create Global Search Filters 09:22
88 Implement the GlobalSearch action 27:26
89 What is Reputation and how to approach it 01:42
90 Implement Reputation points for Questions 08:32
91 Implement Reputation points for Answers 06:03
92 More on Reputation and how to extend it 01:09
93 Implement the Badge System 15:56
94 Setup AI Answer feature 05:41
95 Implement the API route for the AI feature 08:46
96 Display the AI results on the UI 05:40
97 Setup AI Answer feature 05:41
98 Create a Loading state for the Community page 04:19
99 Create Loading states for the rest of the pages 02:15
100 Create toasts for a few actions 08:46
101 What is Metadata and how to implement it 05:07
102 Fix bugs and implement Recommendations 18:49
103 Upgrade Next.js to the latest version 03:52
104 Deploy the application 21:28
105 Introduction to the Course 01:59
106 Where are the projects_ 01:59
107 Environment Setup 03:41
108 Visual Studio Code 03:09
109 Visual Studio Code Extensions 01:57
110 Our Workflow 03:54
111 Variables Intro 04:34
112 Variables 07:12
113 Data Types 01:53
114 Comments 05:13
115 Strings 07:11
116 Numbers 05:01
117 Booleans 04:10
118 Null and Undefined 04:49
119 Objects 05:12
120 Statically vs Dynamically Typed Languages 03:23
121 Operators Intro 01:01
122 Arithmetic Operators 08:00
123 Comparison Operators and Equality 07:06
124 Strict vs Loose Equality 08:53
125 Logical Operators Part 1 04:50
126 Assignment Operators 02:59
127 Intro to Logic and Control Flow Intro 00:41
128 If Statement 05:14
129 Truthy _ Falsy Values 09:23
130 Logical Operators Part 2 12:06
131 Switch Statement 07:35
132 Ternary Operator 04:24
133 Looping - While and For Loops 10:08
134 Functions Intro 09:20
135 Declaring and Invoking Functions 06:52
136 Function Return 04:12
137 Arrow Functions 06:31
138 Parameters vs Arguments 06:08
139 Tricky Parts Intro 00:48
140 Scope 13:41
141 Hoisting 08:30
142 Closures 10:03
143 Strings Intro 07:46
144 String Length and Basic Properties 03:56
145 Change String Case 02:52
146 Searching for a Substring 09:09
147 Getting a Substring 02:30
148 Split a String 03:03
149 Reverse, Repeat and Trim a String 05:17
150 String Exercise 03:17
151 String Exercise Solution 04:25
152 Arrays Intro 07:10
153 Array Methods 13:48
154 Array ForEach 08:40
155 Array Map 04:31
156 Array Filter 11:15
157 Array Find 04:19
158 Array Includes 06:27
159 Array Sort 05:43
160 Array Some and Every 04:21
161 Array Reduce 09:28
162 Objects Intro 05:31
163 Accessing, Adding and Updating Properties of an Object 06:49
164 Built in Methods 04:56
165 Methods 09:27
166 Value vs Reference Intro 06:40
167 Value vs Reference Explanation 04:21
168 Shallow Cloning 08:19
169 Deep Cloning 06:50
170 Intro to DOM 03:34
171 Selecting Elements 06:57
172 Elements Properties and Methods 06:55
173 Working with Classes 05:16
174 Creating, Traversing and Removing Nodes 06:42
175 The _new_ Keyword 07:52
176 The _this_ Keyword 08:25
177 Classes 08:27
178 Intervals and Timers 06:12
179 Introduction to Asynchronous JavaScript 06:24
180 Callbacks 08:26
181 Callback Hell_ 09:03
182 Promises 10:12
183 Async-Await 08:47
184 Modern JavaScript Intro _ Recap 09:28
185 Module Imports and Exports 07:31
186 Rest and Spread Operators 06:47
187 Object and Array Destructuring 09:14
188 Intro 01:30
189 Environment Setup 03:41
190 Visual Studio Code Setup 03:17
191 Business Masterclass Intro 02:00
192 Reading RFP 06:22
193 Proposal Template 07:45
194 CryptoKet Proposal 14:25
195 Project Setup 10:53
196 ESLint Setup 07:27
197 Tailwind Introduction 03:13
198 Git _ GitHub Setup 06:19
199 Next.js File-Based Routing and Setup 06:40
200 Reusable Logic 08:20
201 Navbar Development 54:52
202 Footer Development 23:04
203 Banner Development 11:30
204 Top Sellers 36:04
205 Hot Bids Part 1 20:12
206 Hot Bids Part 2 05:07
207 Create NFT Page 21:35
208 Create NFT Page Input 14:58
209 Hardhat Setup Metamask Configuration 10:46
210 Smart Contract Configuration 16:37
211 Update and Get Listing Price 04:15
212 Function Create Token 05:48
213 Function CreateMarketItem 05:50
214 Function ResellToken 04:47
215 Function CreateMarketSale 07:09
216 Fetching NFTs Solidity 12:49
217 Deploying Smart Contract 13:20
218 NFT Context 13:21
219 Connect MetaMask Wallet 10:28
220 Upload Image to IPFS 12:37
221 Create NFTs 26:10
222 Fetching NFTs Next.js 19:12
223 What We_ve Done so far 06:55
224 Listed NFTs Page 16:30
225 My NFTs Page 14:50
226 NFT Details Page 23:31
227 Modal Development 28:25
228 Buy NFTs 19:18
229 Resell NFT 25:51
230 Best Creators Bonus Lecture 23:41
231 SearchBar Development 36:06
232 Reusing the search bar 06:10
233 Small Bug Fixes 15:01
234 Let_s get to Testing 26:03
235 Global NFT Loading 07:38
236 Welcome! 01:30
237 Environment Setup 03:41
238 Visual Studio Code Setup 03:17
239 The Beginning 09:17
240 ESlint Configuration 07:16
241 GitHub Setup 04:19
242 Depedencies 04:41
243 Intro _ Documentation 04:41
244 Component Structure _ Routing 16:15
245 Styling 05:32
246 Commits 03:36
247 Navigation Bar 26:15
248 Sidebar 28:30
249 Redux Setup 28:43
250 Rendering Movies 16:36
251 Finishing Movie View 10:53
252 Movie Categories 07:01
253 Genre Icons 04:01
254 Redux Slice 11:36
255 Switch Genre Functionality 16:26
256 Search Functionality 17:41
257 Authentication 32:52
258 Authentication Solution 02:53
259 Finalizing Authentication 07:39
260 Movie Information Page - Part 1 34:44
261 Movie Information Page - Part 2 23:23
262 Movie Recommendations 10:37
263 Movie Trailer 10:58
264 Actor Page Assignment 03:43
265 Actor Page 20:04
266 Pagination 13:14
267 Small Fix 03:13
268 Responsiveness Adjustments 12:43
269 Favorited and Watchlisted Movies 25:19
270 Dark Mode 10:48
271 Alan AI - Part 1 16:38
272 Alan AI - Part 2 05:19
273 Alan AI - Part 3 20:50
274 Featured Movie Card 15:09
275 Minor Fixes 03:24
276 Deployment 03:24
277 Land Your Dream Dev Job in 6 Months 01:21:28
278 The Ultimate Git, GitHub, and Conflicts Guide 39:55
279 Introduction to Figma for Developers 24:42
280 Learn How to Code More Efficiently 22:35
281 GitHub Profile Guide 40:59
282 LinkedIn Profile Guide 35:14

Read Book Ultimate Next.js 13 Course + eBook

# Title
1 NextJS-Ebook

Similar courses to Ultimate Next.js 13 Course + eBook

Build A Canva Clone

Build A Canva CloneCode With Antonio

Duration 17 hours 48 minutes 39 seconds
Testing Next.js Apps with Jest, Testing Library and Cypress
Building a Full-stack Multilingual Blog with Next.js 13.4
Next JS: The Complete Developer's Guide

Next JS: The Complete Developer's GuideudemyStephen Grider

Duration 15 hours 35 minutes 12 seconds
Duolingo Clone

Duolingo CloneCode With Antonio

Duration 11 hours 12 minutes 32 seconds
The No-BS Solution for Enterprise-Ready Next.js Applications
Building an AI Icon Generator using the T3 Stack (Next.js, Prisma, TailwindCSS, Typescript, Dall-E API)
Build a Microservices app with .Net and NextJS from scratch
Next JS & Open AI / GPT: Next-generation Next JS & AI apps