1
00:00:02,180 --> 00:00:04,500
Now for this course section here,

2
00:00:04,500 --> 00:00:07,700
I did prepare a demo project,

3
00:00:07,700 --> 00:00:09,670
a demo project which will help us

4
00:00:09,670 --> 00:00:14,170
dive into these key aspects that make up authentication.

5
00:00:14,170 --> 00:00:16,219
You'll find it attached, and as always,

6
00:00:16,219 --> 00:00:18,320
you should download and extract it

7
00:00:18,320 --> 00:00:20,940
and then move it somewhere on your system

8
00:00:20,940 --> 00:00:22,920
where it can be stored.

9
00:00:22,920 --> 00:00:26,680
And then once you are in there, open that built-in terminal.

10
00:00:26,680 --> 00:00:27,670
And first of all,

11
00:00:27,670 --> 00:00:30,880
run npm install to install all the dependencies

12
00:00:30,880 --> 00:00:32,549
that are part of this project

13
00:00:33,600 --> 00:00:36,630
because I pre-added some dependencies for you

14
00:00:36,630 --> 00:00:39,570
and these are all the dependencies we already know

15
00:00:39,570 --> 00:00:41,700
from earlier course sections.

16
00:00:41,700 --> 00:00:43,263
Nothing fancy here.

17
00:00:44,700 --> 00:00:48,050
And there actually also aren't any fancy surprises

18
00:00:48,050 --> 00:00:50,140
in the other files.

19
00:00:50,140 --> 00:00:54,060
In app.js, we do some typical initialization work,

20
00:00:54,060 --> 00:00:55,600
setting the view engine,

21
00:00:55,600 --> 00:00:59,200
and then making sure incoming request bodies are parsed,

22
00:00:59,200 --> 00:01:02,630
serving static content, registering some routes,

23
00:01:02,630 --> 00:01:05,349
and having this generic error handler here

24
00:01:05,349 --> 00:01:07,950
to handle errors that might occur.

25
00:01:07,950 --> 00:01:10,100
And then I'm also connecting to a database.

26
00:01:10,100 --> 00:01:12,390
And then once this succeeded,

27
00:01:12,390 --> 00:01:15,380
I'm starting to listen on port 3000

28
00:01:15,380 --> 00:01:17,660
to spin up that web server.

29
00:01:17,660 --> 00:01:21,030
Now, one word about parsing incoming request bodies.

30
00:01:21,030 --> 00:01:24,900
Here, I'm not parsing for JSON content.

31
00:01:24,900 --> 00:01:25,980
In the last section,

32
00:01:25,980 --> 00:01:29,500
we learned about Ajax requests and JSON data.

33
00:01:29,500 --> 00:01:31,800
Because here in this demo project,

34
00:01:31,800 --> 00:01:35,210
we won't be sending any Ajax requests.

35
00:01:35,210 --> 00:01:38,970
Not because we couldn't do that with authentication,

36
00:01:38,970 --> 00:01:40,590
we absolutely could,

37
00:01:40,590 --> 00:01:43,010
but simply because it's not the focus here

38
00:01:43,010 --> 00:01:46,370
and the traditional approach of sending requests,

39
00:01:46,370 --> 00:01:48,810
so letting the browser handle all of that

40
00:01:48,810 --> 00:01:52,470
works just fine in this course section here.

41
00:01:52,470 --> 00:01:54,096
So therefore, we just parse

42
00:01:54,096 --> 00:01:57,010
these URL-encoded request bodies,

43
00:01:57,010 --> 00:01:59,820
so data that's coming from form submissions

44
00:01:59,820 --> 00:02:01,963
directly handled by the browser.

45
00:02:04,020 --> 00:02:06,010
Then in the routes folder,

46
00:02:06,010 --> 00:02:10,770
I got a demo.js file with some dummy routes prepared,

47
00:02:10,770 --> 00:02:14,830
basically routes for loading the signup and login pages,

48
00:02:14,830 --> 00:02:18,540
for then handling the post signup and login requests

49
00:02:18,540 --> 00:02:22,570
once these signup and login forms will be submitted,

50
00:02:22,570 --> 00:02:26,040
then a route for loading some admin page,

51
00:02:26,040 --> 00:02:30,160
and then also a logout page to which I'll come back later.

52
00:02:30,160 --> 00:02:33,543
I'll come back to all these routes later to be precise.

53
00:02:34,650 --> 00:02:36,700
Now, some of these routes render templates

54
00:02:36,700 --> 00:02:38,750
and you find those in the views folder.

55
00:02:38,750 --> 00:02:40,520
I got some error templates.

56
00:02:40,520 --> 00:02:44,520
The 401 template is one I'll come back to later.

57
00:02:44,520 --> 00:02:46,280
That is a template we'll show

58
00:02:46,280 --> 00:02:48,780
if a user tries to access a page

59
00:02:48,780 --> 00:02:52,160
where he or she is not authenticated for.

60
00:02:52,160 --> 00:02:54,620
Again, I'll come back to that later.

61
00:02:54,620 --> 00:02:57,650
And then I got the signup and login pages

62
00:02:57,650 --> 00:03:00,110
where I render some forms.

63
00:03:00,110 --> 00:03:02,040
Nothing too fancy here.

64
00:03:02,040 --> 00:03:04,610
These forms then send their post requests

65
00:03:04,610 --> 00:03:07,523
to /login or /signup.

66
00:03:08,410 --> 00:03:11,570
And I got a welcome page and then an admin page,

67
00:03:11,570 --> 00:03:14,400
which we will later lock down

68
00:03:14,400 --> 00:03:17,230
so that you're not able to view it.

69
00:03:17,230 --> 00:03:18,690
Initially, you will be,

70
00:03:18,690 --> 00:03:21,370
but later we'll lock this down

71
00:03:21,370 --> 00:03:23,690
and ensure that only logged in users

72
00:03:23,690 --> 00:03:25,363
will be able to access it.

73
00:03:27,100 --> 00:03:28,560
Last but not least,

74
00:03:28,560 --> 00:03:30,840
I got some styles here in the public folder.

75
00:03:30,840 --> 00:03:32,600
And then in the data folder,

76
00:03:32,600 --> 00:03:35,170
I got my database connection code.

77
00:03:35,170 --> 00:03:38,373
Basically, also the same code we used before in the course.

78
00:03:39,500 --> 00:03:41,630
So really, nothing new here.

79
00:03:41,630 --> 00:03:46,130
And therefore, you should be able to start your server,

80
00:03:46,130 --> 00:03:48,990
just make sure that your database is up and running

81
00:03:48,990 --> 00:03:51,410
either because you started it manually

82
00:03:51,410 --> 00:03:53,470
or because you have that service,

83
00:03:53,470 --> 00:03:56,720
that MongoDB service running in the background.

84
00:03:56,720 --> 00:03:59,020
And here I am again using MongoDB.

85
00:03:59,020 --> 00:04:02,830
Of course, this all here would also work with SQL.

86
00:04:02,830 --> 00:04:04,740
It's not MongoDB-specific.

87
00:04:04,740 --> 00:04:06,090
I'm just sticking to it

88
00:04:06,090 --> 00:04:09,340
because we've used it over the last sections.

89
00:04:09,340 --> 00:04:11,500
And hence, now we can run npm start

90
00:04:12,390 --> 00:04:14,803
and this will then start up this node server.

91
00:04:15,820 --> 00:04:17,110
Once it is up and running,

92
00:04:17,110 --> 00:04:19,620
you can visit local host 3000

93
00:04:19,620 --> 00:04:21,870
and there you've got a navigation bar

94
00:04:21,870 --> 00:04:24,600
where you can visit the different pages.

95
00:04:24,600 --> 00:04:27,420
For the moment, that includes the admin page.

96
00:04:27,420 --> 00:04:29,910
You can just access it just fine initially.

97
00:04:29,910 --> 00:04:31,630
We'll change this later.

98
00:04:31,630 --> 00:04:34,253
And the logout button won't do anything right now.

99
00:04:35,120 --> 00:04:37,350
But that's now our starting project.

100
00:04:37,350 --> 00:04:38,620
And in this project,

101
00:04:38,620 --> 00:04:41,520
we're now going to start on this signup page

102
00:04:41,520 --> 00:04:45,083
and we'll make sure that users can actually create accounts.