So let's now connect
to our MongoDB cluster and let's,
well, run some code against it,
and let's maybe start with the newsletter API route.
I will bring back my development server with npm rundef.
And now here in the newsletter API route,
I wanna store that email address in a table
or, as it's called in MongoDB, a collection
of email addresses.
So that we have a collection of email addresses
stored in the database,
and that then could be used by us to send out newsletters
and emails of any kind to those registered users.
Now to do that, we need to do two things.
We need to connect to the database.
And once we are connected, we need to run an insert command
to insert the email address into some collection.
Now we can learn more about that on the official docs,
and also on the npm docs of the MongoDB Driver already.
If we scroll down to Quick Start,
there we see that we have some code here for connecting.
And then when we are connected,
we can insert documents as they are called,
so entries into the collection with insertMany
or also with another command which we'll see.
So let's connect to MongoDB.
And for that, we can use this code.
Though we can also adjust it here in newsletter.js,
we can use ES module imports,
and we can import something from MongoDB like this.
And the something I wanna import is MongoClient,
between curly braces.
With that imported,
we can use it down here to set up a connection.
So here we can then use MongoClient.
And as we see here in the docs,
called the connect method to connect to a database.
So here I'll then call connect.
And now we need to pass in our connection URL.
Now for that, we go back to the cluster
because here we got this URL.
So we can copy this URL here.
And I got there by clicking on Connect,
and then connect your application.
So I'll copy that URL and paste it in here as a string.
Now here we need to fill in a user name, a password,
and a database name.
Now for a username and password,
you should go to Database Access here
and add a new database user with password
with any username or password of your choice,
so fill in any values here,
and then with read and write access to any database.
Now I already did create such a user.
So I'll just edit my existing user
and assign a new password,
which I'll also change once this recording is done,
so you can't use that user and that password.
So I will use that user and password.
And hence here in my case,
I'll use Maximilian as a username.
Make sure to also get rid of those angle brackets here
in those placeholders,
and plug in my password as well.
Now for the database name,
you can choose any database name you want
because that database of that name
will then be created automatically
once you start sending queries.
And here I'll name it newsletter.
Now there's one other setting we need to adjust.
In MongoDB Atlas, under Network Access,
you wanna add an IP address
and make sure that you add your current IP address
to that white list here.
You should do that to ensure
that your local machine is able to send requests
to that MongoDB Atlas cluster.
Once you deploy your application,
you wanna make sure that the server
you deployed your site to is white listed here.
Otherwise, incoming requests will be blocked.
So that's something we need to do.
And with that, we get this connect string configured.
Now the connect method takes a second argument,
which is a call back,
which gives us access to the connected client,
so to the cluster in the end
once the connection block is established.
Alternatively, we don't add a second argument,
and instead add a then block
to use a promise return by connect,
which also gives us access to the client
once the connection block is established.
That would also allow us to use async await here
if we wanted to.
Now we can only talk to the database
once the connection block is established,
so only inside of this then block here in this case,
so only in this function
where we do have access to the client.
That's also what we see in this quick start guide here.
There they are using the callback function,
but we can use the promise as well.
Now in here we wanna get access
to the concrete database to which we connected,
and we do this by executing client.db.
We could enter the database name here.
But since we already encoded that in the connection string.
We don't need to do that.
We can just leave that blank,
and it will use that database
to which we connected with the connection string.
And once we got hold of the database with the db method,
we can use the database to get access to a collection,
which is like a table in that database
into which we wanna store data.
And that could be the emails collection
in the newsletter database,
which will then hold the individual email addresses.
Now it's that collection
against which we can now run our queries.
For example, the insertOne query
to insert one new entry into that collection.
And entries in collections
are called documents in MongoDB world,
and a document should be a JavaScript object here,
and then it can have any key value pairs of your choice.
And here I'll have an email field let's say,
which just contains that user email value
which I extracted and validated here.
So now I'll insert such a document into this collection.
Now this also returns a promise,
which will let us know once it's done.
And therefore, since we're already in event chain,
we can just return this promise here
to add another then block thereafter and continue.
However, I'll switch to async await now
since that is a bit easier,
and we can't do that by adding async
in front of our handler function
because these API route handler functions
are allowed to be async, they can be async.
So I'll add async here,
and then I'll switch us all to async await
by awaiting the connect method here
and getting my client like this,
and then removing this here and this here.
And then instead of returning here,
I will await this insert operation like that.
So now we're using async await for connecting,
for getting access to the database,
and for inserting one document.
And then once we're done with all of that,
I will send back that status code.
We should just do one other thing.
We should all use the client again
and call close to disconnect from that client.
Now with all of that, we should be inserting
a new email address into that emails collection
in our newsletter database.
If we save all that code now
and we go back to our application to our site
on localhost3000,
let's test this.
Let me enter a new email address and click Register.
And we don't get any feedback here.
We could of course add some,
but let's see whether it worked by going to our cluster,
and there we can click on Collections
to see the collections that are part of this cluster,
and there you should see a newsletter database
with the emails collection.
And then inside of that emails collection here on the right,
you'll see that document which we inserted
with that email address.
It also has an automatically assigned unique ID.
And that shows us that everything works.
We also got no error here in the terminal,
just some warning, which we can't ignore here.
And therefore that is how we can now talk
to a real database to store our emails.
As mentioned, we could now,
again, work on the front end a little bit
and provide a better feedback to the user here,
but I will not dive into that here,
since I wanna focus on these API routes
since it is these API routes
which are the core feature we're looking at here.