- So now that we've got MongoDB
up and running on our machine,
as well as some basic data that we can use for development,
let's see how we can incorporate it into our Express Server.
The first thing we're going to do
is install the MongoDB driver into our project.
And to do that,
we're going to run the following command,
inside our backend directory.
We're going to run NPM install MongoDB,
and hit enter.
And basically what this package will allow us to do
is connect to and modify our local database
from inside our Express Server code.
And this in turn is going to allow us
to persist our data much more effectively.
In other words,
our data won't be wiped away every time our server restarts.
And as you might imagine,
that's absolutely critical for applications like ours.
So now that our data is stored
inside our local MongoDB instance,
instead of just modifying fields in an object,
like we've been doing so far on our server,
we're going to use the newly installed NPM MongoDB driver
to connect and make queries to our local database.
And there are a few steps involved in doing this
and I'm going to walk you through each of them.
And the first thing we're going to want to do
is we're going to want to modify the Get routes
that we had before,
which allowed the client to get data about our products,
as well as their shopping cart.
Now, there are a few steps here
that are specific to the MongoDB driver.
So don't worry too much
if you run into some unfamiliar syntax here.
The first thing we're going to do,
since we're going to be using some asynchronous code
inside this end point now,
we're going to start off with our products' end point.
The first thing we're going to do,
is we're going to add the async keyword
to the route callback.
This is one of those things that I always seem to forget,
but our code won't work without it.
Okay. And now that we've done that,
the next thing we're going to do
is we're going to use the MongoDB driver
to connect to our locally running database.
So here's what that's going to look like.
The first thing we have to do
is actually import that driver up at the top.
So we're going to say import,
and we're going to import something called MongoClient
from our MongoDB driver.
And once we've done that,
we're going to go back down to our end point.
And we're going to add some code
above our res.json statement there.
So what we're going to say,
the first thing we need to do
is connect to our local database,
using the MongoClient thing that we just imported.
So, here's what that's going to look like.
We're going to say, const client equals await
MongoClient.connect.
And then the first argument to this function here
is going to be the URL
of our locally running Mongo database,
which unless you've changed some of the defaults
is going to be this.
We're going to say, mongodb://localhost:27017.
And the second thing, we're going to pass here
is just going to be a configuration object,
which is going to contain a few things that
are just basically small details.
Don't worry too much about them.
The first one is use new URL parser,
and the value for that is going to be true.
And the second thing is going to be,
use unified topology,
which is also going to be true.
These are just compatibility things
that we have to pass to this MongoClient.connect function.
So now that we've done that,
the next thing we're going to do
is we're going to say const db equals client.db.
And for this, we're going to put in
the name of the database that we just created.
So in my case, that was vue-db.
In your case that might've been something else,
make sure you use that same name here.
And after that, we're going to say, const products
and here is where we're actually
going to make the query to our database.
So we're going to say const products equals,
await db.collection.
And then we pass the name of the collection
that we want to query here,
which is going to be products.
And after that, we're going to say dot find.
And we're just going to find all of them,
which we do
by passing an empty configuration object like that.
And finally, this is one that always seems to trip me up.
We have to put .toArray on the end
to actually convert this query result into an array.
Okay. So now that we've done that,
the rest of it should be good.
We're saying res.status(200).json
and sending those products back to the client.
And note here too, that we're kind of doing
a little bit of shadowing with our variable names,
this products, we didn't have to change that.
It used to point to this product right here.
But now that we've created another product,
which is the result of our database query,
this'll send back the correct thing.
Okay.
And finally, wherever we call mongoclient.connect
at the end of our end point,
we have to call client.close.
Okay. Just like that.
And now that we've got that running,
we should be able to start up our server,
which we can do by running NPM run dev.
And if you don't already have,
MongoDB running in the background,
make sure you do that by typing Mongo D
in another terminal and leaving that running.
And what we're going to do now,
is we're going to go over to postman
and we're going to make a get request to api/products
and see if this works.
So let's click send
and we should see that that sends us back
all of the products that we inserted into MongoDB earlier.