Apply What You Learned

With all the newly gained knowledge about Next.js, it’s time to apply it to a real demo project—a demo application that will be rendered on the server.

In the following section, you’ll find an activity that allows you to practice working with Next.js. As always, you will also need to employ some of the concepts covered in earlier chapters.

Activity 15.1: Migrating a Vite-Based React Router App

In this activity, your job is to build upon the Vite-based app from Activity 13.1. That app was built with Vite and React Router. Your job is to migrate it from Vite and React Router to Next.js.

Therefore, you should create a new Next.js project (using the App Router) and rebuild the same app in that project.

Note

You can find the starting code for this activity at https://github.com/mschwarzmueller/book-react-key-concepts-e2/tree/15-ssr-next-intro/activities/practice-1-start. When downloading this code, you’...