So let's make sure
we can store new posts here.
So that this form can be submitted.
And for that,
we can actually start in the create-post.ejs file here,
because that's all we have that form.
And just as in the MySQL section,
we need to set an action and a method here.
Now the method should be POST because that's to convention
if we're dealing with user entered data,
that should be stored somewhere on the server side,
in this case in a database.
So post is to kind of HTTP request you wanna send here
to follow this convention.
And then for the URL, for the path to which we sent this,
that's up to you, but I wanna send it to /posts
to simply send it to my domain.com/posts.
So in this case, local host 3000/posts,
and whenever a post request to reach us this path,
I wanna insert the submitted data into the database.
And then since all these input fields have names,
we'll be able to extract the user entered data
by these name values as keys in the incoming request body.
That's exactly what we did in the MySQL section two,
when we built this project
and what we also discussed earlier in the course.
So I'm not going to dive too deep into this right now.
Instead, this form is now submittable.
And in block.js, we can now register a new route
to handle such incoming blog posts.
This should be a post route
because we're sending a post request
and we wanna handle the /posts path
and then have our function here,
which takes the request and response objects,
which we can use for handling the request
and sending back a response.
Now, what we wanna do here is of course,
we wanna extract the incoming data
from the incoming request.
For this, we can access req.body as you learned,
this holds the body,
the data attached to the incoming request,
the parsed data I should say,
and on that body will have an object
which holds properties like title and summary and content,
and also author,
which will be the data chosen by the user here.
So now we can use that information to create the document
that we wanna insert in MongoDB.
So here I'll name this newPost,
the name is up to you, of course,
and that should be a new JavaScript object
where I actually wanna have a title
because every blog post should have a title,
which is req.body.title,
because we have that title name here for the title input.
For the summary, we have summary
and for the long we have content as names.
So therefore we can, for example,
also add a summary key to our document,
which would hold the values stored
in req.body summary, I mean.
And then we can have the body field in our document,
which would be req.body.content.
Of course, these keys are up to you,
but these will be the keys that end up in your documents
in your database.
So here, these are the keys I'm going for,
since these are the keys I outlined on this slide before.
Hence here, we can also see that we wanna have a date,
and then also that author data that should be stored
and therefore our next, add a date or a createdAt field,
however you wanna name it, I'll just name it date.
And I wanna use the current time and date as a date here.
And we can simply create a new date object like this
in JavaScript.
And if we just created like this
with this built in date class,
this will automatically give us the current time and date
at the point of time this code executes.
And that of course is a great snapshot,
agreat timestamp for the date when this post is created,
because that is happening at this date.
So therefore, I'll create a new date like this
and store this in a date field.
And thankfully MongoDB
will be able to work with this JavaScript date object,
and it will store it in the database correctly.
And hence, that's how we can add the date here.
Now for the author, I'll store a nested object.
So I'll create another object here
because I wanna store both the ID and the name here.
Now, for the ID, you could also name this authorId
of course, I'll go for just id.
I want to use req.body.author
because that will actually be the ID,
Author is the name of this dropdown,
and what will be submitted
is the value of the option that was chosen
and the value is the id.
So we'll get the ID here.
However, we'll get the ID as a string
and we could consider storing it as an object id here.
So to convert it into this object id format, Mongo DB uses.
If we wanna do that, all we have to do for this
is import mongodb by requiring it, like this.
And then maybe here
we can actually get this ObjectId function
by accessing mongodb.ObjectId.
And that ObjectId thing here will then be a function
or to be precise, a class we can instantiate
and hence down there,
we could then actually use new ObjectId
and pass our author ID to it.
Now we would be storing this as this ObjectId thing
MongoDB uses internally for storing IDs
instead of using a plain string.
Both would work, but I'll go for the ObjectId solution here.
And then I also wanna store the name of the author.
And of course here, we don't have that name.
We do have it in the dropdown actually,
but the day that it will be submitted will just be this id.
So to get the name as well,
we can, of course just fetch it here
when we do create a post.
And for this, before we create this new post object,
we can use the db object,
which we're importing from our own database.js file
and call getDb to get access to that database
on our MongoDB server,
get access to the author's collection here,
and then actually find one specific author here
with one specific ID.
For this, we then pass an object here to findOne,
that's our filtering object, as you learn
and we're looking for to document
where _id is equal to this author id.
And for that, I'll actually grab this ID here
this ObjectId with the author ID, which I'm creating here
and I'll create a new constant here authorId,
which holds stat ObjectId
based on that authorId that was submitted.
And I'll use this authorId here as a value
for this filtering condition.
And this will then reach out to debt collection
to the author's collection
and find us this one matching author document.
Again, this is a asynchronous operation,
which can take a little bit longer.
So we can await this.
In order to do that though,
we need to turn this into an async function
by adding the async keyword in front of it.
And then here, we got our author
that's stored in the database.
So now we're running an extra query,
just so that we're then able to insert a new document,
but that's how MongoDB works.
If you need to work with different collections,
you need to run different queries.
So here we're in the end doing some manual merging
of data stored in different collections.
But that's what I meant with planning ahead for the queries
we are about to run.
Running does extra query here
when a new blog post is created
is not necessarily a great deal
because we won't create new blog posts all the time.
And having that author data store together with the ID
instead of a new post will be very beneficial for us
in the future.
So it's well worth the extra effort here
to get that extra data
so that in the future, when we do work with block posts,
we can save extra queries
because we then don't have to fetch that extra author data
since it will be included in this post data already.
So that's the trade off we're taking here
to optimize the query we are running more often
for the price of having slightly more work to do here
when we insert a new block post.
And if this sounds very challenging and confusing,
be aware that of course either way could be implemented
and it's not horrible if you do it differently
and it is simply something that comes with experience
over time.
So don't be afraid of decisions like this.
There are also will be more examples
like the complete online shop,
which we build in this course
where you can also gain more experience
and practice this even more.
So, that's how I implemented here.
And with that, we got our ID here, the author ID,
and we now got the name, which you can get from author.name.
So from this author document we're fetching
and then accessing the name on it.
And we now even could also store the email here.
As mentioned earlier in the course,
storing the email here as well, has the downside
that if it does change,
we have to change it in the author's collection
and in all the post documents in the posts collection
where we use it.
But if we don't expect the email to change a lot,
that of course is definitely a price we're willing to pay.
If emails do change quite a bit,
you might not wanna store it together with your post data
and therefore really it comes down to your application
and how it works.
Storing it here in addition to the other data
instead of the post, of course,
will have the great advantage
that when we later work with the single post data
and we need both the author name and email,
we won't have to reach out to the authors collection
just to get the email.
That's why here, we'll actually store it together
with the other author data,
but you should be aware of the potential disadvantage
if email address is changed a lot.
But with that finally, we built our new post document here.
And with that bill, we can now insert it.
For this again, I'll get my database here from my DB object.
And here, I now wanna work with the post collection,
which doesn't exist yet, but which will be created
as soon as we start inserting the first document.
And speaking off that, that's what I wanna do
by running insertOne and two insertOne,
I pass my new post object,
which will be inserted as a document into this database
by the MongoDB package.
As always, that's a task that can take longer
so we can await it.
And ultimately we'll get back a result here,
which gives us information about this operation.
For example, it will give us the insertedId.
Here for the moment I'll just console.log that result.
And then as a last step, I wanna send back a response
once all of that was done.
And here since we're handling a post request,
the response I do wanna send back is a redirect.
I wanna redirect back to /posts here.
So to the starting page in the end,
so that we can then instantly view the list
of all the blog posts.
And with all of that, let's see whether that works.
Let's save this file with all those changes,
reload this page and test this with A First Post.
This is a first post that I created,
and then let's see whether that works.
It's MongoDB + Nodejs in action.
This should work!
I'll stick to Maximilian Schwarzmiller and click Add Post.
And now we're on the all posts page,
we don't see the post here yet
because we haven't written any logic
for fetching and displaying posts.
But going back here to the backend,
we can see the log here in the terminal
and that's looking good.
It looks like a new element was added
a new document was added.
And to be really sure that it was added,
we can of course, go back to the shell,
which is connected to the same MongoDB server
as the Nodejs application is,
and here we can access the posts collection,
here in the shell just like this.
There we don't need a collection method,
we can just use the collection name like this
and run, find to see all the posts
and that's looking quite good.
I see my post here with all the data that was submitted
with all the texts that was submitted
with the date and with the author data
and therefore that is looking very promising
and it looks like it's working.
If it's not working for you, double check all your code,
double check your connection.
Of course, that the server is up and running,
the MongoDB server I mean,
and of course also use my code snapshots
to compare your code to mine,
if your code is crashing for some reason.
But with that, we are now inserting posts.
As a next step, I wanna fetch a list of posts
and display it here on the All Posts page.