1
00:00:00,000 --> 00:00:03,000
So NextJS allows you

2
00:00:03,000 --> 00:00:06,000
to build full stack applications with React.

3
00:00:06,000 --> 00:00:09,000
So to blend frontend and backend

4
00:00:09,000 --> 00:00:13,000
and build more complex apps all in one project,

5
00:00:13,000 --> 00:00:17,000
and all with one programming language, JavaScript,

6
00:00:17,000 --> 00:00:20,000
and one framework or one library,

7
00:00:20,000 --> 00:00:23,000
so with React, enhanced by NextJS.

8
00:00:23,000 --> 00:00:25,000
And in this course you will see

9
00:00:25,000 --> 00:00:27,000
that this can offer various advantages.

10
00:00:28,000 --> 00:00:29,000
For example, fetching

11
00:00:29,000 --> 00:00:33,000
and rendering data can become easier and more efficient.

12
00:00:33,000 --> 00:00:37,000
Handling form submissions can become easier and more secure.

13
00:00:37,000 --> 00:00:40,000
So there are many advantages related to that.

14
00:00:40,000 --> 00:00:44,000
And whilst this is the main big thing,

15
00:00:44,000 --> 00:00:47,000
NextJS adds, that it allows you

16
00:00:47,000 --> 00:00:50,000
to build such full stack applications,

17
00:00:50,000 --> 00:00:55,000
it's not the only benefit you gain when working with NextJS.

18
00:00:55,000 --> 00:00:58,000
And another advantage of NextJS is that

19
00:00:58,000 --> 00:01:02,000
with it you set up your routes with help of the file system.

20
00:01:02,000 --> 00:01:05,000
Instead of configuring them in code,

21
00:01:05,000 --> 00:01:09,000
as you would typically do it in a vanilla JavaScript app,

22
00:01:09,000 --> 00:01:13,000
for example, with React Router, when working with NextJS,

23
00:01:13,000 --> 00:01:16,000
you configure them with help of the file system.

24
00:01:16,000 --> 00:01:18,000
So by setting up various folders

25
00:01:18,000 --> 00:01:22,000
and files, which are then mapped into routes

26
00:01:22,000 --> 00:01:24,000
that can be visited by users.

27
00:01:24,000 --> 00:01:26,000
The advantage of this approach is

28
00:01:26,000 --> 00:01:29,000
that no extra code-based configuration

29
00:01:29,000 --> 00:01:31,000
or extra packages are needed.

30
00:01:31,000 --> 00:01:34,000
Instead it's built into NextJS.

31
00:01:35,000 --> 00:01:37,000
And last but not least,

32
00:01:37,000 --> 00:01:41,000
but definitely not to be underestimated, is the fact

33
00:01:41,000 --> 00:01:45,000
that NextJS actually renders all the content

34
00:01:45,000 --> 00:01:47,000
that's visible on the screen, all the pages

35
00:01:47,000 --> 00:01:50,000
and components on the server.

36
00:01:50,000 --> 00:01:54,000
And that means that the content that's sent over the wire,

37
00:01:54,000 --> 00:01:58,000
the HTML document, in the end already includes all the

38
00:01:58,000 --> 00:02:01,000
content that should be presented on the screen instead

39
00:02:01,000 --> 00:02:03,000
of being mostly empty

40
00:02:03,000 --> 00:02:06,000
and populated on the client as is the case

41
00:02:06,000 --> 00:02:07,000
with vanilla JavaScript.

42
00:02:07,000 --> 00:02:10,000
And the advantage here is that, for example,

43
00:02:10,000 --> 00:02:14,000
search engine crawlers see that finished content as well.

44
00:02:14,000 --> 00:02:16,000
But I'll get back to that point

45
00:02:16,000 --> 00:02:18,000
in a couple of lectures again.

46
00:02:18,000 --> 00:02:22,000
And therefore, using NextJS gives you a couple

47
00:02:22,000 --> 00:02:23,000
of key features

48
00:02:23,000 --> 00:02:26,000
and benefits that are not to be underestimated.

49
00:02:26,000 --> 00:02:30,000
And that's of course the reason why NextJS is that popular

50
00:02:30,000 --> 00:02:33,000
and why for building more complex React apps,

51
00:02:33,000 --> 00:02:38,000
you should strongly consider using a framework like NextJS.