1
00:00:02,000 --> 00:00:04,000
[Maximilian Schwarzmüller] Now to conclude this module,

2
00:00:04,000 --> 00:00:07,000
there is one last special page I want to have a look at,

3
00:00:07,000 --> 00:00:10,000
and that's the 404 page.

4
00:00:10,000 --> 00:00:15,000
If I enter something slash something here,

5
00:00:15,000 --> 00:00:19,000
then I get the 404 page and a 404 error

6
00:00:19,000 --> 00:00:21,000
because we're not supporting that value.

7
00:00:21,000 --> 00:00:24,000
We're not supporting that path.

8
00:00:24,000 --> 00:00:28,000
Now, of course you might want to ship your own 404 page

9
00:00:28,000 --> 00:00:30,000
with your own content and style.

10
00:00:30,000 --> 00:00:32,000
And Next.js makes that easy.

11
00:00:32,000 --> 00:00:36,000
You just need to add a special file in your pages folder.

12
00:00:36,000 --> 00:00:39,000
So on the root level of your pages folder,

13
00:00:39,000 --> 00:00:44,000
next to this underscore app JS file and this index JS file,

14
00:00:44,000 --> 00:00:47,000
and here, in this folder,

15
00:00:47,000 --> 00:00:51,000
we now want to add a 404 dot JS file

16
00:00:51,000 --> 00:00:55,000
and it must be named like this because Next.js will

17
00:00:55,000 --> 00:00:58,000
then always load the component returned

18
00:00:58,000 --> 00:01:01,000
by this file or export it from this file

19
00:01:01,000 --> 00:01:05,000
when a 404 error arises.

20
00:01:05,000 --> 00:01:09,000
So here we can have our not found page

21
00:01:10,000 --> 00:01:15,000
and in there simply return a div where I say page not found.

22
00:01:15,000 --> 00:01:18,000
And of course the content is up to you.

23
00:01:18,000 --> 00:01:20,000
And then here I export this.

24
00:01:21,000 --> 00:01:24,000
And by doing that, by adding this page to special file,

25
00:01:24,000 --> 00:01:29,000
if I now reload local host free thousand slash something

26
00:01:29,000 --> 00:01:31,000
I see my custom not found page.

27
00:01:31,000 --> 00:01:33,000
So that is how you can customize that.

