illustration for Migrate Next.js Application to App Router
free

Migrate Next.js Application to App Router

Instructor

Ben Patton

1h 15m closed-captioning
·
26 lessons
7
people completed
Published a year ago
|
Updated a year ago

This course will be updated as all the app router features and apis become stable

Credit for this application goes to Kent C. Dodds. The starter application was ported to Next.js from Kent's Remix workshops at Frontend Masters.

Why this course? Simply put, many are wondering how to migrate their application to Next.js new app router architecture and make use of server components, server actions, etc.

"Server components are the future." Twitter is saturated with comments like this. Many of us feel like it is tech version of Thanos, "Dread it. Run from it. Server Components arrive all the same."

Is this true? Emphatically no. So we can silence the infinity war now and say there is nothing wrong with using the pages router.

In fact, after the initial deployment lesson, you could stop this course and go make it something better or into something you want it to be using the pages router.

There are many incredible additions to Next.js new app router architecture. This is simply a course and resource for you should you choose/desire to migrate from pages router to app router.

You will learn how to:

  • migrate api routes, pages, and nested layouts
  • take advantage of routing in the app router for a better nested layout experience
  • turn getServerSideProps into a React Server Component
  • use server actions

And much more.

Due to the applications scale here are a few things to note:

  • The course shows how to migrate a set of routes, api routes, etc with a few exceptions
  • The remainder videos have been added to a supplemental course which you can find by searching for "Next Migration Course Extras" or clicking here. Consider them your bonus features and deleted scenes from the 'movie'.
  • The extras course has been set up to align with the lessons here. For example:
    • As you create the app router, there are 'primer' videos for how to create a page and dynamic routes in the app router
    • As you go through migrating routes, you will find additional 'migrating routes' videos in the extras course
    • As you migrate api routes, the remainder of the api route migration videos are in the extras course

And with that you are good to go!

Start your journey today and experience the possibilities of the Next.js app router

Free Community Resource

A Community Resource means that it’s free to access for all. The instructor of this lesson requested it to be open to the public.

Course Content

1h 15m • 26 lessons

    You might also like these resources:

    illustration for Next Migration Course Extras

    This course is meant to be a supplemental course for the Migrate Next to App Router course.

    illustration for Build a Twitter Clone with the Next.js App Router and Supabase
    Jon Meyers • Course • 1h 19m

    Learn React Server components and Server Actions as you build a Twitter clone from scratch using a Supabase backend.