Create a Next.js App

Editing the page

Let’s try editing the starter page.

  • Make sure the Next.js development server is still running.
  • Open pages/index.js with your text editor.
  • Find the text that says “Welcome to” under the <h1> tag and change it to “Learn”.
  • Save the file.

As soon as you save the file, the browser automatically reloads and updates the page with the new text:

The Next.js development server has the Hot Reloading feature. When you make changes to files Next.js automatically applies the changes in the browser. No refresh needed! This will help you iterate on your app quickly.

Next Up: Creating Pages

Great job! That’s it for the first lesson.

In the next lesson, we’ll talk about creating more pages and navigating between pages.

You should keep the development server running, but if you want to restart it, hit Ctrl + c to stop the server.