Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

User Authentication With Express and Mongo

Well done!

You have completed User Authentication With Express and Mongo!

Sign up for Treehouse Back to Library
Preview
Video Player
00:00
00:00
00:00
  1. 2x 2x
  2. 1.75x 1.75x
  3. 1.5x 1.5x
  4. 1.25x 1.25x
  5. 1.1x 1.1x
  6. 1x 1x
  7. 0.75x 0.75x
  8. 0.5x 0.5x
Use Up/Down Arrow keys to increase or decrease volume.

Adding Data to the Database

9:46 with Dave McFarland and Jonathan Foster

In this video, we'll update our POST /register route so that we can validate the user input from the registration form, and create a new document in MongoDB with the user's name, email, favorite book, and password.

We've got almost everything set up to add users to a database. 0:00
We've installed mongoose, set up a connection to Mongo D.B. 0:04
and created a schema. 0:07
The last part of the puzzle is inserting data into Mongo. 0:09
As you can see our app doesn't really do much if you submit the form. 0:12
We just get a user created message which isn't even really true. 0:18
Our next step is to update the code for posting to the register route. 0:23
The route's code is in the index.js file inside the route's directory of our app. 0:27
Here's the code for the post route. 0:33
You can see we're sending user created message, but 0:35
we're not really doing anything else. 0:38
Before we update this route however, 0:40
we need to require the mongoose schema we created in the last video. 0:42
I'll create a variable called user, and 0:48
load the schema from the model's directory. 0:51
Now let's update the route. 0:55
I'm going to delete this return statement. 0:58
And replace it with some error checking code. 1:02
We wanna make sure the user has filled out every field in the form. 1:05
We can do that with a basic conditional statement. 1:10
Remember req R.E.Q. is the client request. 1:14
That's the information coming from the browser. 1:18
So for example req.body.email is the information in the email field. 1:21
Req.body.favoritebook is what the user typed into the favorite book field. 1:26
It's a series of 'and' conditions, meaning that all of these must be true. 1:33
Basically if any of these are empty, meaning the user didn't 1:38
type something into that form field, it'll produce a false value and 1:41
bypass this part of the if statement, jumping immediately to an else statement. 1:45
There we'll create an error and give it a message, all fields required. 1:53
We'll return this error to our error-handling middleware, 2:04
that'll get sent back to the browser. 2:07
You'll notice that I set the status here to 400. 2:10
400 is an http status code meaning bad request. 2:13
You use that when the request could not be understood by the server 2:17
due to malformed syntax, such as missing information. 2:20
It means, that the user has to change something, 2:24
like filling out the form correctly, before making the request again. 2:26
Now, what do we do if the user did fill out all the form fields? 2:30
Well, we should make sure that they also filled out the two 2:34
password fields correctly, so that they matched. 2:38
I'll add a comment here just to let me know what's happening in the code. 2:42
And then a basic conditional statement. 2:48
If the information in the password field doesn't match the information in 2:53
the confirm password field, we'll create another error. 2:57
Let's give it a message, passwords do not match. 3:00
We'll set the status to 400, like we did before, 3:07
and return the error to our error handling middleware. 3:10
Okay, cool. 3:14
Let's see if this works. 3:15
I'm going to save this file and switch over to my terminal or 3:16
you can switch over to your console if you're on Windows. 3:20
And I'll type nodemon. 3:22
You'll notice that I get an error here. 3:25
Notice that error connection refused, Mongo error. 3:28
For this to work we have to have Mongo running. 3:33
I don't have it running it yet. 3:35
So I'll do that by opening a new tab and typing Mongod to start the Mongo daemon. 3:36
If you're on Windows, you'll use the Mongo executable. 3:44
All right, I'm going to switch back to my first tab, 3:47
where I've got the server running. 3:49
It doesn't know about Mongo now running, so I'm going to stop it, 3:52
clear this out and I’ll start it up again with nodemon. 3:56
Okay, let's see what's happening. 4:03
We'll switch back to Chrome. 4:05
[BLANK-AUDIO] Check out the site and the sign up page. 4:06
First, let's see if the error happens when I don't feel anything out. 4:13
Sign up. 4:17
All right there's the error, all fields are required. 4:18
Now I will fill it out, but I'll not have matching passwords. 4:22
When I hit the submit button, it says the passwords do not match. 4:33
All right, we've got it working. 4:37
However, we're not yet submitting anything or 4:39
inserting it into Mongo, we'll do that next. 4:41
I'll need to switch back to my text editor, and at this point, 4:45
here in our code, we now know that we have all the information we asked for 4:49
and that the passwords match. 4:53
It's time to build up an object that's going to contain 4:57
all the information that we wanna store inside of Mongo. 5:00
I'll create a variable called user data it'll be an object and 5:05
it'll have several keys: email, name, favorite book, and password. 5:09
You'll notice that the value is coming from the request object. 5:17
So it's the information that the user filled out in the form. 5:21
The email field, the name field, favorite book field and the password field. 5:24
In other words we're creating a new object which 5:29
represents the document we wish to insert into Mongo. 5:32
Now that we have that object in place, it's time to insert it into Mongo. 5:35
I'll add another comment to let me know what I'm doing. 5:43
We're going to be using the schema's create method 5:46
to insert our document into Mongo. 5:49
Remember User here is our mongoose model returned by our schema file. 5:54
Create is a mongoose method that inserts a new document in Mongo based on that model. 6:04
You'll see that if there's an error, 6:12
we just pass the error off to our error handling middleware. 6:14
Now if there's no error, meaning we successfully added a record to Mongo, 6:17
the application sends the user directly to the profile page. 6:22
We'll hook up the profile page functionality in the next part of this 6:26
course, but let's see if we've got our form to work. 6:30
I'll save this file and switch back to the terminal. 6:34
You'll notice that in my terminal nodemon has stopped and 6:37
restarted the application several times. 6:40
In fact each time I saved a change to a JavaScript file. 6:43
Now, in the browser, I'll add some information and sign up. 6:47
Well, you can see in the URL that I was successfully redirected to 6:59
the profile route. 7:03
We haven't yet built that route. 7:04
That's why you're seeing a file not found error. 7:06
We'll do that in the next part of this course. 7:08
But did anything happen with the database? 7:11
Let's take a look using the Mongo shell. 7:13
I'll go to my terminal, create a new tab, and type Mongo, to enter the Mongo shell. 7:15
If you're on Windows you can launch the Mongo executable and follow along. 7:24
Now in the shell, you can use your bookworm database by typing use bookworm. 7:28
Then you can show the collections by typing 'show collections'. 7:36
Don't worry about the system.indexes collection. 7:43
Mongo created it for its own internal uses. 7:46
We won't use it or touch it, but there's our new users collection. 7:48
Finally, let's look inside that collection to see what's in there. 7:53
I'll type db.users.find(). 7:57
There it is, a new user record. 8:03
It's kind of hard to read, so 8:05
we can use a special Mongo method to make the output look better. 8:07
I'll do the same find command and just add .pretty(). 8:12
There is all the information from the form. 8:19
There are also a couple of keys we didn't add ourselves. 8:20
Mongo created them. 8:24
ID is a unique ID for this document. 8:26
No two user records will have the same ID, that's good 8:29
because we can use this unique identifier to identify each user in our system. 8:32
That will come in handy in the next part of this course. 8:37
The __v is for versioning of this document. 8:39
Mongo uses this key to keep track of versions of the document, see 8:45
the teacher's notes for more information about Mongo document versioning. 8:49
Now the rest of the document looks good, however check out this password key. 8:53
I can read it, plain as day, in fact I can read it plain as plain text. 9:00
Look at the password, it's just called pass. 9:04
That's a big security no no. 9:07
You don't want to save unencrypted passwords in a database. 9:09
Anyone who gets their hands on that database information 9:13
will have the credentials needed to log in and impersonate any user on your site. 9:15
Now, in the next few videos I'll show you how to add encryption 9:21
to hide sensitive data like a password from snoops. 9:24
Now before I do that, however, I'm going to get rid of this document. 9:28
We don't want that open password in there. 9:31
So to remove a collection in the Mongo shell, you type db, 9:34
the name of the collection, drop and parentheses. 9:39
Okay. 9:42
Let me show you how to store passwords the right way. 9:43