1
00:00:00,360 --> 00:00:03,690
We've almost finished creating
the basic authentication system for

2
00:00:03,690 --> 00:00:05,030
our bookworm site.

3
00:00:05,030 --> 00:00:07,570
The only missing piece
is the profile page.

4
00:00:07,570 --> 00:00:10,850
That's our only password
protected page on the site.

5
00:00:10,850 --> 00:00:13,050
I'll start by creating the template for
the page.

6
00:00:14,180 --> 00:00:19,980
I'll add a file named
profile.pug in the views folder.

7
00:00:22,010 --> 00:00:23,400
And I'll add my template code.

8
00:00:23,400 --> 00:00:26,000
I'm not going to type it out,
I'll just paste it in there.

9
00:00:26,000 --> 00:00:28,440
You can find this code in the teacher's
notes if you want to copy and

10
00:00:28,440 --> 00:00:29,920
paste it too.

11
00:00:29,920 --> 00:00:36,040
The two important items in this template
are these placeholders, name and favorite.

12
00:00:36,040 --> 00:00:39,480
These are variable placeholders that,
when the template is rendered,

13
00:00:39,480 --> 00:00:42,880
will be filled with the users name and
their favorite book.

14
00:00:42,880 --> 00:00:45,014
To wire this template up to our app,

15
00:00:45,014 --> 00:00:49,799
we need to add one more route to the
index.js file inside the routes directory.

16
00:00:53,477 --> 00:00:55,630
Let's add a basic GIT route.

17
00:01:01,410 --> 00:01:06,260
Remember, in the last video when a user
successfully logs in their user ID,

18
00:01:06,260 --> 00:01:10,290
that's the idea used in Mongo
to identify a single document,

19
00:01:10,290 --> 00:01:12,390
is stored as a session variable.

20
00:01:12,390 --> 00:01:12,970
In other words,

21
00:01:12,970 --> 00:01:17,680
if there is no user ID in the session,
then the user can't be locked in.

22
00:01:17,680 --> 00:01:19,332
We can check for that case first.

23
00:01:25,689 --> 00:01:31,050
So here I'm just looking to see if
the user ID session variable exists.

24
00:01:31,050 --> 00:01:32,020
If it doesn't,

25
00:01:32,020 --> 00:01:35,565
we'll spit out a message that says you
are not authorized to view this page.

26
00:01:35,565 --> 00:01:40,320
We'll also send out an error
status code of 403,

27
00:01:40,320 --> 00:01:44,860
that means forbidden, basically the page
is off limits unless you're logged in.

28
00:01:46,000 --> 00:01:51,620
Remember that a session is a property of
the request object, and individual pieces

29
00:01:51,620 --> 00:01:58,530
of data that you store in there are
properties on the session, req.session.

30
00:01:58,530 --> 00:02:02,380
Now what to do if the user ID's
session variable is in place.

31
00:02:02,380 --> 00:02:06,911
In this case, we can retrieve the user ID
from the session store and execute a query

32
00:02:06,911 --> 00:02:11,325
against the Mongo database, retrieving
the user's information from Mongo.

33
00:02:16,071 --> 00:02:19,935
I'll add a basic error check in
case the query doesn't work.

34
00:02:23,435 --> 00:02:28,069
However, if there's no error,
we can render the profile template.

35
00:02:32,772 --> 00:02:37,435
Passing a title, The user's name,

36
00:02:41,737 --> 00:02:43,310
And the user's favorite book.

37
00:02:46,080 --> 00:02:50,445
Remember, user.name is data that
comes from the Mongo database,

38
00:02:50,445 --> 00:02:52,980
user.favoriteBook is the same.

39
00:02:54,400 --> 00:02:58,350
Here, name is a variable that we're
using to send to our template.

40
00:02:58,350 --> 00:02:58,980
So in other words,

41
00:02:58,980 --> 00:03:04,250
we're sending the user name from the
database in a variable to the template.

42
00:03:04,250 --> 00:03:05,280
Let's see how it works.

43
00:03:05,280 --> 00:03:08,560
I'll save this page and
switch over to the terminal.

44
00:03:08,560 --> 00:03:12,030
Well I've already got nodemon running,
so I don't need to start it again.

45
00:03:12,030 --> 00:03:16,420
I'll switch to my browser and
go to a local host 3000 and log in.

46
00:03:17,860 --> 00:03:21,460
Sure enough, there's my name and
my favorite book, it works!

47
00:03:21,460 --> 00:03:23,730
Now we've written a lot of
code in this course so far,

48
00:03:23,730 --> 00:03:27,290
and we have a basic user
authentication system in place.

49
00:03:27,290 --> 00:03:29,830
There are a few things
we can do to improve it.

50
00:03:29,830 --> 00:03:33,040
For one,
we haven't added a logout feature.

51
00:03:33,040 --> 00:03:35,790
In addition,
the navigation bar could use some help.

52
00:03:35,790 --> 00:03:40,900
For example, when you're logged in,
this login button here should say log out.

53
00:03:40,900 --> 00:03:45,300
Likewise, we're already signed up, so
we shouldn't see the sign up link again.

54
00:03:45,300 --> 00:03:49,010
In the next section of this course,
I'll show you how to add these features,

55
00:03:49,010 --> 00:03:52,490
as well as teach you how to write your
own middleware for this application.

56
00:03:52,490 --> 00:03:52,990
See you there.