Next.js for Beginners - Full Course

Next.js for Beginners - Full Course
Learn how to get started and get proficient with Next.js.

Learn how to get started and get proficient with Next.js.

⚠️ Minor error in course- At 5:15, to get to that Next.js starting point, please do the following:

  1. Run the command: npx create-next-app next-recipe-app, let that build
  2. Go into the folder: cd next-recipe-app
  3. Open in your code editor of choice!

Through building a full-stack recipe app with Next.js,, and Vercel, you’ll learn how to set up dynamic routing, pre-render, pull content from external APIs, set up serverless functions, offer real-time content previews, and deploy your app on the web.

✏️ Your instructor for this course is Kapehe, devrel specialist at
🔗 Kapehe’s website:
🎥 On YouTube:

💻 Code:

⭐️ Course Contents ⭐️
⌨️ (0:00:00) Introduction
⌨️ (0:02:52) What is Next.js
⌨️ (0:04:05) Tools: Node.js, VS Code, and the command line
⌨️ (0:05:15) Setting up Next.js
⌨️ (0:10:02) Setting the Sanity Studio CMS
⌨️ (0:53:12) Connecting Next.js with your content lake
⌨️ (1:04:54) Making a simple navigation bar in _app.js
⌨️ (1:10:45) Making your first page template in index.js
⌨️ (1:30:15) Setting up dynamic routes with [slug].js
⌨️ (1:36:14) Diving into data fetching and pre-rendering with getStaticPaths & getStaticProps
⌨️ (2:01:36) Create a like button with API routes and serverless functions
⌨️ (2:16:46) Adding live real-time preview with’s content lake
⌨️ (2:25:11) Set up automatic deployment with GitHub and Vercel
⌨️ (2:35:18) Summary: What you have learned and next steps


JavaScript Programming Tutorial Full Course for Beginners

Learn JavaScript - Become a Zero to Hero

Javascript Project Tutorial: Budget App

Top 10 JavaScript Questions

E-Commerce JavaScript Tutorial - Shopping Cart from Scratch

JavaScript for React Developers | Mosh