Now we'll of course explore how to write code
in NextJS apps
and how to build feature rich NextJS applications
throughout this course.
But to get started already, let's make a first change.
And for that you should go to that app folder.
Because I wanna add a new second page,
and I mentioned before that in NextJS one advantage
is that you configure routes simply
with help of the file system.
So by adding folders and files.
And it's indeed in this app folder here
where you can add folders and files to add routes.
This Is the folder NextJS will scan
to detect any routes that should be set up.
And I'll explain what these different files here do
in depth later in the course of course.
But to get started, let's add a new page
by simply adding a new folder,
and let's maybe name it awesome.
And let's in there, add a new file, page.js.
And this must be named page.js
because it's this combination of a folder name
and a page.js file that creates a new route in NextJS.
And in that file, you can and should then,
simply export a standard React component function,
because pages in NextJS are just React components,
like AwesomePage,
where the name of the component does not matter though.
And here we could then return a main element,
where we have an h1 tag,
where we say, NextJS Is Awesome!
or something like this.
And with that done,
you can go back to your NextJS application,
and now visit localhost:3000/awesome,
and you'll see this page content on the screen then.
And that's how easy it is to add new pages in NextJS.
And of course, the content of this page also was rendered
on the server as you can tell
if you inspect the source code,
you'll find the content in there.
And that's there
for our first slightly edited NextJS project.
As mentioned, we'll dive way deeper
and explore all the amazing next features
throughout this course.