Nested Routes

Eeee! Nested Routes are today’s first topic! This is really exciting because I had to use nested routes in my Milk Log App and I didn’t know what I was doing. I learned a lot and managaed to get all of my routes working but I’m excited to see how else I could have done it/if I chose an effective way to do it.

I’ll continue to use the Yelp Camp App as an example for this post. So far the routes we have are:

INDEX – /campgrounds
NEW – /campgrounds/new
CREATE – /campgrounds
SHOW – /campgrounds/:id

Now we need to create the routes for the comments! Woo! They will look like:

INDEX – /campgrounds/:id/comments
NEW – /campgrounds/:id/comments/new
CREATE – /campgrounds/:id/comments
SHOW – /campgrounds/:id/comments/:id

Which is exactly how I did it in my Milk Log App! Woo! That’s a relief, I really didn’t want to have to redo all my routes! (there is going to be enough to redo anyway!!)

First step will be to add the new route for comments. As per usual we will create the route and do a quick res.send to make sure that it is working:

/// =========
/// COMMENTS ROUTES
/// =========

///NEW

app.get("/campgrounds/:id/comments/new", function(req, res) {
    res.send("This will be the comment form!!");
});

Then save and restart the server, go to the route and hope that the expected message shows up!

![Screenshot-from-2018-03-23-09-04-50](/content/images/2018/03/Screenshot-from-2018-03-23-09-04-50.png)

Which it does! Woo! We are killing this code along!

Now we are going create a page to render on this route but before that we need to clean up our files because it’s getting a bit messy and we don’t want duplicate file names in the same directory. I’m going to branch into a separate blog post to chat about it!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s

Create a free website or blog at WordPress.com.

Up ↑

%d bloggers like this: