Courses

Development

Next.js 14 & React - The Complete Guide

Update December 2023:

  • Added a HUGE new section (incl. a completely new demo project) that covers NextJS 14 & the "App Router" in-depth!

  • Covers React Server Components, Server Actions & more

  • Covers file upload & storage on S3

  • Completely updated the "React Refresher" section

  • No prior NextJS knowledge is required - I'll introduce you to what the "App Router" is in this course!


  • 4.5/5.0
  • 12k Enrolled
  • All levels
  • Last updated 05/2024
  • English
  • Course Description

    Update December 2023:

    • Added a HUGE new section (incl. a completely new demo project) that covers NextJS 14 & the "App Router" in-depth!

    • Covers React Server Components, Server Actions & more

    • Covers file upload & storage on S3

    • Completely updated the "React Refresher" section

    • No prior NextJS knowledge is required - I'll introduce you to what the "App Router" is in this course!


    Join this bestselling NextJS course and learn how to build highly dynamic, super fast and SEO-ready React apps with React & NextJS!

    This course covers both the NextJS "App Router" & the "Pages Router" - two different approaches for building fullstack apps with React! And, of course, you'll learn what these two approaches are, why two different approaches exist and how each approach works!


    I created the bestselling Udemy course on React, now I'm super excited to share this NextJS with you - an in-depth course about an amazing React framework that allows you to take the next step as a React developer and build real, production-ready projects with React and Next.js!

    Next.js is the production-ready, fullstack-capable framework for ReactJS - the most popular JavaScript library you can learn these days!

    Too many buzzwords for your taste?

    Fair enough - but indeed, NextJS is a great choice for growing as a React developer and for taking your React apps to the next level!

    Because NextJS is growing fast and therefore in high demand. And there are good reasons for that: NextJS allows you to build React apps with built-in server-side rendering and page pre-rendering. Building great user experiences and search engine friendly (SEO!) React apps has never been easier!

    In addition, NextJS makes building fullstack React apps (frontend + backend code combined in one project) extremely easy as well! Blend client-side and server-side code and build a NodeJS-based API side-by-side with your frontend React apps. It's a breeze with NextJS!

    Want to add authentication? NextJS simplifies that as well and makes user signup, sign in and session management very convenient.

    This course will take you from NextJS beginner to advanced level in no time!

    We'll start at the very basics, no NextJS knowledge is required at all, and we'll then dive into all the core features that make up NextJS. Both in theory as well as with multiple real projects where all concepts will be applied step-by-step.

    For this course, you'll need basic React knowledge, though the course does come with a "React refresher" module in case it's been some time since you last worked with React.

    This course also includes a "NextJS Summary" module for the Pages router and a "NextJS Essentials" module for the App router - which allow you to always come back to the course in the future and refresh your knowledge without going through the full course again. Or you just take those summary modules (and skip the rest for now) to learn about all the core features in as little time as possible.

    After finishing this course, you'll be well prepared to build your own NextJS projects from the ground up and apply for NextJS positions!

    In detail, this course will cover:

    • What is NextJS? And why would you use it?

    • Why is just React (in many cases) not enough?

    • Creating NextJS projects from the ground up & understanding these projects

    • Working with file-based routing

    • Adding dynamic routes and catch-all routes

    • Implementing different forms of page pre-rendering and server-side rendering

    • Working with data and adding data fetching + pre-fetching to your apps

    • Handling form submissions with Server Actions

    • Handling File upload

    • Pre-generating dynamic and static pages

    • Adding optimizations like metadata to pages

    • Optimizing images with the NextJS Image component

    • Building fullstack apps with API routes or Server Actions

    • Managing app-wide state with React context (in NextJS apps)

    • Adding authentication to NextJS apps

    • Multiple complete apps where we'll apply all these core concepts!

    • A complete React.js refresher module (so that we're all on the same page)

    • A NextJS summary module so that you can refresh what you learned or just explore the core features quickly

    • And much more!

    I can't wait to start this journey together with you! :)


    instructor-image

    Admin

    Instructor of Marketing

    • 9.1k
    • 4.5
    • 29 Courses
    About Instructor

    Our Student Reviews

    4.5

    (Based on todays review)

    avatar
    Jacqueline Miller

    2 days ago

    Perceived end knowledge certainly day sweetness why cordially. Ask a quick six seven offer see among. Handsome met debating sir dwelling age material. As style lived he worse dried. Offered related so visitors we private removed. Moderate do subjects to distance.

    avatar
    Louis Ferguson

    1 days ago

    Water timed folly right aware if oh truth. Imprudence attachment him for sympathize. Large above be to means. Dashwood does provide stronger is. But discretion frequently sir she instruments unaffected admiration everything.


    avatar
    Dennis Barrett

    2 days ago

    Handsome met debating sir dwelling age material. As style lived he worse dried. Offered related so visitors we private removed. Moderate do subjects to distance.


    Leave a Review
    Ask Your Question
    course image

    This course includes

    • Lectures 30
    • Duration 4h 50m
    • Skills Beginner
    • Language English
    • Deadline Nov 30 2021
    • Certificate Yes

    Course Instructor


    Course Overview


    Update December 2023:

    • Added a HUGE new section (incl. a completely new demo project) that covers NextJS 14 & the "App Router" in-depth!

    • Covers React Server Components, Server Actions & more

    • Covers file upload & storage on S3

    • Completely updated the "React Refresher" section

    • No prior NextJS knowledge is required - I'll introduce you to what the "App Router" is in this course!


    Join this bestselling NextJS course and learn how to build highly dynamic, super fast and SEO-ready React apps with React & NextJS!

    This course covers both the NextJS "App Router" & the "Pages Router" - two different approaches for building fullstack apps with React! And, of course, you'll learn what these two approaches are, why two different approaches exist and how each approach works!


    I created the bestselling Udemy course on React, now I'm super excited to share this NextJS with you - an in-depth course about an amazing React framework that allows you to take the next step as a React developer and build real, production-ready projects with React and Next.js!

    Next.js is the production-ready, fullstack-capable framework for ReactJS - the most popular JavaScript library you can learn these days!

    Too many buzzwords for your taste?

    Fair enough - but indeed, NextJS is a great choice for growing as a React developer and for taking your React apps to the next level!

    Because NextJS is growing fast and therefore in high demand. And there are good reasons for that: NextJS allows you to build React apps with built-in server-side rendering and page pre-rendering. Building great user experiences and search engine friendly (SEO!) React apps has never been easier!

    In addition, NextJS makes building fullstack React apps (frontend + backend code combined in one project) extremely easy as well! Blend client-side and server-side code and build a NodeJS-based API side-by-side with your frontend React apps. It's a breeze with NextJS!

    Want to add authentication? NextJS simplifies that as well and makes user signup, sign in and session management very convenient.

    This course will take you from NextJS beginner to advanced level in no time!

    We'll start at the very basics, no NextJS knowledge is required at all, and we'll then dive into all the core features that make up NextJS. Both in theory as well as with multiple real projects where all concepts will be applied step-by-step.

    For this course, you'll need basic React knowledge, though the course does come with a "React refresher" module in case it's been some time since you last worked with React.

    This course also includes a "NextJS Summary" module for the Pages router and a "NextJS Essentials" module for the App router - which allow you to always come back to the course in the future and refresh your knowledge without going through the full course again. Or you just take those summary modules (and skip the rest for now) to learn about all the core features in as little time as possible.

    After finishing this course, you'll be well prepared to build your own NextJS projects from the ground up and apply for NextJS positions!

    In detail, this course will cover:

    • What is NextJS? And why would you use it?

    • Why is just React (in many cases) not enough?

    • Creating NextJS projects from the ground up & understanding these projects

    • Working with file-based routing

    • Adding dynamic routes and catch-all routes

    • Implementing different forms of page pre-rendering and server-side rendering

    • Working with data and adding data fetching + pre-fetching to your apps

    • Handling form submissions with Server Actions

    • Handling File upload

    • Pre-generating dynamic and static pages

    • Adding optimizations like metadata to pages

    • Optimizing images with the NextJS Image component

    • Building fullstack apps with API routes or Server Actions

    • Managing app-wide state with React context (in NextJS apps)

    • Adding authentication to NextJS apps

    • Multiple complete apps where we'll apply all these core concepts!

    • A complete React.js refresher module (so that we're all on the same page)

    • A NextJS summary module so that you can refresh what you learned or just explore the core features quickly

    • And much more!

    I can't wait to start this journey together with you! :)




    -

    Location


    • Address 1
    • Country
    • City
    • State
    <