1
00:00:00,000 --> 00:00:02,000
So, for this section,

2
00:00:02,000 --> 00:00:04,000
I prepared a brand new starting project,

3
00:00:04,000 --> 00:00:08,000
which you, of course, find attached, and this project

4
00:00:08,000 --> 00:00:12,000
actually consists of two projects, you could say.

5
00:00:12,000 --> 00:00:15,000
It is a NextJS application,

6
00:00:15,000 --> 00:00:17,000
and hence you should run npm install once

7
00:00:17,000 --> 00:00:19,000
to install all dependencies

8
00:00:19,000 --> 00:00:23,000
and then start the development server with npm run dev,

9
00:00:23,000 --> 00:00:25,000
but this application actually also comes

10
00:00:25,000 --> 00:00:27,000
with a separate backend again.

11
00:00:27,000 --> 00:00:31,000
And you might often not need such a separate backend,

12
00:00:31,000 --> 00:00:35,000
and we will also get rid of it later in this section,

13
00:00:35,000 --> 00:00:38,000
but having that separate backend allows me to dive

14
00:00:38,000 --> 00:00:42,000
into some of NextJS caching mechanisms in greater detail.

15
00:00:43,000 --> 00:00:47,000
Therefore, in addition to starting that development server,

16
00:00:47,000 --> 00:00:50,000
you should also navigate into that backend folder

17
00:00:50,000 --> 00:00:54,000
and also run npm install there to install

18
00:00:54,000 --> 00:00:57,000
all the dependencies required by that separate backend,

19
00:00:57,000 --> 00:01:00,000
and then run npm start to start that backend server.

20
00:01:02,000 --> 00:01:06,000
Now, that backend server is a very simple Node Express app

21
00:01:06,000 --> 00:01:09,000
that just serves some dummy messages,

22
00:01:09,000 --> 00:01:11,000
but I also do some logging there,

23
00:01:11,000 --> 00:01:16,000
and that will help us understand when exactly NextJS

24
00:01:16,000 --> 00:01:21,000
avoids requests due to caching and when it doesn't.

25
00:01:21,000 --> 00:01:23,000
So, you should have both the backend

26
00:01:23,000 --> 00:01:26,000
and the NextJS development server up and running,

27
00:01:26,000 --> 00:01:28,000
and with that, you should then be able

28
00:01:28,000 --> 00:01:31,000
to visit Localhost:3000,

29
00:01:31,000 --> 00:01:34,000
see this page, navigate to the messages,

30
00:01:34,000 --> 00:01:36,000
and see these messages here.

31
00:01:36,000 --> 00:01:38,000
And with that, let's now explore when

32
00:01:38,000 --> 00:01:43,000
and how exactly NextJS caches data and avoids requests.