Well come back soon the last video we made a little bit of a mess of things by adding in the seeds file
.
And that's the point we wanted to add into code that would see the database both with campgrounds and
comments even though comments don't work.
So we get some error messages.
Now we're going to focus on going and making the comment model and making those errors go away.
So the two main objectives are to make the errors go away by creating the comments file adding in the
correct model code and then also displaying the comments that are associated with the given campground
on that campground show page.
So if I click here my server is not started but if I did I would want to see the show page that has
the details about the campground and the associated comments.
OK.
So let's get started let's just refresh our memory on what happens when I run the server.
I get an error now telling me cannot find module models.
Slash comment.
So we need to make that file touch models.
Slash comment.
Yes.
And then we're going to open that up
just like that.
And then inside of here we know that at some point at the bottom we're going to have a module that exports
equal something and up top.
We're going to import mongoose so far.
Mongoose equals require mongoose.
Just like that.
And then what we'll need to do is create our schema.
So a comment has two things.
Text which you've seen already here we decided text and author.
Eventually Arthur will be a reference to a user model.
Once we have these earth indication for now it's just a string with the name of the author.
So text an author.
Both of which are strings.
So we're going to create this schema for comment schema and we don't need to uppercase that equals.
And then this is mongoose schema.
And then inside of here we're going to have text which is a string.
And then we're also going to have author which is also a string.
So that makes us the schema and then we need to compile that to the model what to do with Mongoose top
model and the singular name of our model which is comment and then the schema which is a comment schema
.
And that's what we're going to export.
So that's all we should need to do to make the comment model which we're then exporting out and we're
using instead are seeds Jap's file or requiring it right here.
So if all things go well we should have a different error message now.
Let's clear and try running or app again.
And it looks like it worked just fine and it did create the campgrounds for us and we can view a show
page but if we look at the data that's stored in the database or if we just look at our models we don't
actually have any associated data.
So let me show you open up Mangu and the database that I'm using is the camp version 3.
So I'm going to use the web cam the three and then I'm going to show the collections and we'll see what
we have here.
So we have two collections campgrounds and comments.
And if I look at the campgrounds.
So let's do D-B dot campgrounds that find everything you can see that we have three campgrounds but
all that we're getting is the campground ID the name and the image and there's nothing about comments
.
And if we do the same thing for comments the comment stuff find all you'll see that we have text and
author but we have nothing about campground.
So we're part of the way there.
Now we need to work on the association.
So all Control-C out of there and what we want to do is associate a comment with the campground and
we'll do that by adding a object of reference to the campground schema.
So if we look at Seeds the way that I wrote it is that we should be able to do campground dumb comments
and that doesn't exist yet.
So we need to add the comments property to campground.
So let's open up the campground Dryas file and add a property here called comments and it's going to
be an array.
And it's going to be an array just like we did with users in posts where we had an object inside that
object had type which was mongoose that schema type dot object id just like that comma and then it had
a ref.
And this is going to be comments.
That's the name of the model.
So what we're saying is that the comments property should be an array of comment IDs.
So we're not embedding the actual comments in here.
We're just embedding an ID or a reference to the comments.
So we'll save now and if we try and see the database again with Noad apt.
Yes we now have a small issue which is a syntax error.
We need to have types that object ID.
So now if we run this again
it tells us that it removed all campgrounds out of that campground added a campground added a campground
created a new comic created a new comment and then created a new comic.
Let's see what we're looking at.
Refresh the page.
This should look the same.
Now let's dive into Mongo and let's use yo camp V3 and then we'll do divi campgrounds find.
And if we make this a little bigger I can see that we have a comment object now or comments property
where each one has a single comment and it's the same comment on all of them.
Although the ideas are different it's the same text and author but it's technically a different entity
because we created three different comments that just have the same content.
All right so we have the association done.
That's all we need to do.
We can make a new comment and we can associate it with a campground by adding it to the comments array
on each campground.
What we want to do next is focus on displaying the comments.
So we're going to do that on the show route.
So we'll go back to actually yes and we can close out of our seats file for now and our comment in our
campground.
And we're just going to focus on this app.
Yes.
So I'm going to get rid of all of this now.
That was sort of our all the data and then we did make some room in here and go down to our show route
.
So instead of show we're finding the right campground with the ID.
But if we look at the campground that's coming back.
Remember that it looks like this where we have comments but comments will be an array with object IDs
in it.
And if we want the actual comments which we do we want to pass the comments to the show template we
need to use that dot populate dot exec so we can refactor this just a little bit.
We're going to do find by ID.
And we're going to close that off right there and then we're going to do a populate comments and then
a dot exec and we passed this callback function into exec like this.
Oh it's a little bit jarring to students but we're finding a campground still find by id and then we're
populating the comments on that campground.
And then with DOD exec we're actually executing this query that we made and then that comes back and
we still have the found campground.
But it should look different because inside a found campground should now be comments not just ideas
but actual comments and we can prove that by printing it out before we render the template.
So found camp ground counted log that and let's see what happens.
Now I start the server and the only way I'm going to see this is if I go to a show route.
So let's go to canyon floor and it doesn't look like anything has changed because we're not displaying
anything.
But if we go and look in the console what we're printing out found campground you can see that we've
now populated the comment array.
So inside the comments right there's a single comment by Homer that says This place is great but I wish
there was Internet.
Now all we have left to do is use the comments array in the template we're already passing in the entire
found campground so we can just access campground comments inside the show template and we'll do that
now will open up the template that C-9 views slash show and we'll start just at the very bottom doing
a loop and we're going to loop through all the comments.
So we'll do a for each and that's on campground dot comments.
Remember that campground refers to this whole thing.
It's a campground.
Comments for each function and in here we'll just call it comment.
Open that up and then add our.
E.J..
Yes.
Closing bracket and do the same thing down here no equal sign remember that.
And then we'll just make a simple paragraph for each comment to start.
We will be styling this later.
So a paragraph and it's just going to have the comment that author first just like that dash the comment
text.
And we need equal signs in both of those.
And let's make the author bolded.
So I'll put a strong tag around the author and let's indent to make this a little easier to see what's
happening.
So strong tag and then we'll put the author inside the strong tag just like that.
And then we'll have a dash.
The comment that text just like that.
All right.
So this will loop through all the comments on a given campground on the show page and it's going to
make a paragraph for each one.
And inside that paragraph we're going to print out the comments author folded and then a dash the comment
text.
So let's see if that works for us.
Let's go ahead and stop the server or restart the server now visit the show page.
Let's go back refresh let's do desert Mesa and there we go.
We have our first comment down here.
We only have one comment on each campground for now.
Soon we'll have more.
Once we add in the ability to add a new comment.
So right here there will be a button that we're going to add in the next video that says add a comment
and we click that it will take us to a form and then we can add a new comment and then come back to
this page and see our new comment showing up.
OK so that's all we needed to do in this video be confident a lot.
Let's take a moment to go back and review everything that we did or the important parts at least.
So we created the comment that she has file we added in our comment schema and we created the model
and then we changed the campground a little bit so that the schema now has comments.
That comment is an array not of entire comments but of the comment object IDs.
And then we have our seats file that's still running just fine.
The very top here.
And stylistically it would make a little bit more sense for us to move this down.
So I'm going to cut this out and just move it after we've done that configuration.
But it really doesn't matter.
So we're seeding the database that's adding in three different campgrounds.
Each one with a comment by Homer and then what we're doing is when we visit a show route which we have
here we're retrieving the campground to one campground with the right I.D. and then populating the comments
array on it which is going to fill in this data here so that it's not just an I.D. and then we're able
to send that to the template.
And then in the template we're using it we're looping through it and displaying a paragraph for each
comment.
OK.
So as I mentioned in the next video we're going to focus on making the new comment functionality