OK welcome back in this unit we're focusing on something called rest r e s t.
It stands for representational state transfer but that's really not key to this lesson.
It's not that important.
And actually I bet that most developers if you ask them what it stands for they would have no clue but
they would be able to tell you what rest is and name the seven different restful routes that we'll see
in a moment but they probably won't know what it stands for.
So not that important what is important though is defining what rest is.
So rest isn't a new tool or a new technology.
It's not a language or anything like that.
It's much simpler.
Rest is just a pattern for defining our routes.
It's a way of mapping HTP routes and cried together and remember crud.
It's another acronym create read update and destroy.
So we have these functionalities.
And let's take an example of users.
So my site has users and I want someone to be able to create a new user.
Someone should be able to read users which means retrieving information on users updating users and
destroying users or deleting them or if you take the example of a blog site which you have right here
I want to be able to read all blogs so that's what I see right here.
This is a list of all blogs but then I want to be able to add a new blog which is what I have here.
New post.
I want to be able to edit a blog see a form to edit it.
I had to make commission points and you can see my blog was edited and I want to be able to delete a
blog.
So let's delete this one delete blog.
And I need vouch for all of that instead of my express app.
There's seven different appetite gets amped up post apps dot something raps that are being defined and
yes 7 sounds like more than we need.
But remember that for some operations like for creating something we need to reps we need the form route
that shows us this form and then we need a place for the form to submit the same thing goes for it.
So to update something we need a form like this either needs somewhere for the form to go so we'll spend
some more time going over the particular routes but what's important is that rest is just a convention
.
It's an architecture for mapping our HGP routes to crud functionality.
So what we could do let's say I wanted to be able to take logs or entity or thing is blog if I wanted
to have a page where you could destroy a blog for instance are you or it could be something like blog
or just destroy a blog.
And then we need a blog that we're destroying so we'd have an ID there or to update.
You might have something like Update blog slash ID and to read all the blogs or something like Slash
read all blogs or just all blogs.
And the point is we can do whatever we want.
And that's the point of rest is that you don't do whatever you want.
You follow a pattern and the reason that you make restful wraps the whole point behind it is one it's
conventional.
You see it all over the place in different applications.
But more importantly is the fact that it's reliable so that other people who are working in your code
or when we talk about API is if you're interacting with a restful API or someone is interacting with
your own API that you've created you know that if something is restful it follows a particular pattern
and that pattern is this year.
So I have a table of all the different restful routes.
In this case for what else but dogs.
So these are seven routes that we define in our application and there's kind of a lot to talk about
here and to really break it down.
So don't get overwhelmed.
We're going to devote a video to each one of these and to actually implementing it.
And we'll be building this simple blog site and a quick note while I'm here is that this is not built
with bootstrap.
It's built with another framework called semantic UI.
And I did that for a few reasons.
One is that I just like semantic UI.
I think it's a little cleaner.
But you actually write in your HMO too.
I like the way that it looks and three and most importantly I wanted you to see another framework for
CSSA so that you see that they're not that different.
Honestly things are very similar.
Maybe some of the classes are named differently but there is a great system.
There's buttons there is nav bars all the stuff that's in Bootstrap.
There are other equivalent frameworks out there.
OK.
So we'll be making this and we'll be doing the styling at the end.
So that's not really the focus.
What is the focus though.
Are the routes.
So if we start here on slash logs you can see that I have a list of all the blogs in my database and
this is called the index route.
So this table you can see index that's the name of one of the routes that you are all for dogs would
be slashed dogs for blogs.
It's slash log's an HDTV verb is a get request and the purpose is to list all of the dogs.
Now let's take a look at new uncreate which are color coded.
They're both green because they have to do with one another.
They're both related to creating a new dog and an update are also both color coded because they are
linked as well.
So new uncreate if we go back to the blog site and they click on new post pay attention to the URL slash
logs slash new and all that I do are all that I see is a form.
And according to our table here new you around the path is slash dug slash new.
It's a get request and it's supposed to show the new dog form.
In our case it's blog.
And we see the forum here.
So let me go copy an image you are well let's just take this one.
New post will just make a random post here and we'll be deleting it we click on Create.
And it's important then that we talk about the create rap.
So create is where this form goes to where this new post form submits.
So if we take a look at the table it says Create goes to slash dugs as a post.
So we already have slashed dogs as a get or index page slash dugs as a post.
It's where we go to actually post form data to create a new dog and then redirect somewhere.
So we saw this in the last unit when we talked about crud we talked about creating things and post requests
in Express.
So this is a post request or route that's listening for a post just slash dogs.
And if we inspect the form of course
look at the action slash blogs as a post.
OK.
So hopefully you're seeing right now we have this table.
It just acts as basically a pattern that we follow we can fill in the blanks.
If we're not doing dives we might be doing blogs or comments or campgrounds or users and I'll actually
show you really briefly with yo camp which have opened here.
Notice that all strt the server up
noticed that the page where we see all the campgrounds is slash campgrounds.
If I want to add new campground first I have to log again.
And this is a later version.
Obviously with some functionality we don't have yet.
But if I do log in.
Notice that if I go to add new campground campground slash new which is the exact same pattern replace
dogs with campgrounds and then if you look at where the form submits of course you'd expect to see slash
campgrounds as opposed.
Which is what we see right there in all the other restful routes are here as well and we'll be implementing
those later.
And the reason that we're waiting to do it to Yotam is that it's linked to user authentication so we
don't want someone to be able to add a new campground unless they're signed in.
And I don't want to be able to delete someone's campground unless I created it.
Same thing for updating it.
So we first will get authentication going and then we'll work on adding in the rest of the restful routes
so close out of there for now.
So let's keep moving on.
We've covered index new uncreate and then we have the show route which you just saw in the last unit
when we added the show page to yoke camped for a campground in the point of a show page.
In the case of dogs is it it shows info about one specific dog.
So for instance on our blog site if we go back to that make sure start the server again and if we go
to the home page our index slash logs shows a little bit of each blog post but it doesn't show every
piece of information.
So for instance this year if I click on it there is some extra content that we don't see the way that
I have it set up is that it shows the first 100 characters on the index.
But if you want to read the entire post you have to click on read more.
So our show page is right here.
Notice that you are up.
Slash blogs slash.
This crazy idea.
Just like we did with Joachin.
That's the point of the show page.
It takes one particular ID something that is unique and it finds the corresponding item and shows you
all the information or as much information as you want on that one page.
So an index and show are to read routes as far as crud goes.
The R index will show all it will list all of a particular whatever dog or blog or user or campground
and show is for one.
So it shows more information.
It's a get request.
Hit enter sends you get request because it's my now.
And it goes to slash dogs whatever the entity is slash user slash blogs slash ID as a path variable
so that show that you have an update and those two are linked together.
They correspond to one another just like new and create.
So it is going to show us the form and update is where the form submits.
So lets start with edit for dogs so you are its flash dogs slash colon ID slash at it as a get request
and it shows the edit forms for one dog.
If we try to edit one of these here pay attention to you or will notice that we get logged slash ID
slash at it and we knew that Id there because we have to find the correct blog that were editing.
Thats how we pre-populated the data here.
We could just have blogs slash edit that then how would we know what were editing.
How would we retrieve the data.
Figure out what to actually update in the database so that doesnt really work.
But if we follow restful routes we follow that restful convention logs.
Slash ID slash at it and I see the forum here.
And then if we look at where the form goes it also needs to have an ID and the euro and it goes to log's
slash ID.
And then theres some weird stuff.
Method equals put method equals post.
Will be getting to that now a little bit.
But the key thing if we check the table is that it's a put request so not a post request to put request
which we haven't used yet.
It's just another HGP verb that's used to update something rather than posting new data.
The practice if you're feeling restful Rousse you use put.
And the nice thing about rest is that if you have a table like this hopefully you'll memorize this after
making a few apps that follow this pattern.
In my experience it takes a little bit for students to really get it second nature but if you follow
this table you keep it open and actually included it inside the notes here instead of restful routing
.
Right here is a table and if you want to view it at any time all that you have to do.
You don't have to copy this over to a new file you don't have to serve it with Express.
If you just open the file right here and then you click on Preview you can click on live preview file
and it will open it right here inside of your application instead of cloud 9.
So if you if you want to do that keep it open or if you are to make a shorter version.
This is something we'll be going back to a lot which is nice because it's just a blueprint.
We just follow it.
We all have to think about what to do as long as we have this table to remind us of the reps.
So it shows us the form.
It has an idea in the overall update is where that form sends data to.
And it also needs an ID because it's not just like create where we're blindly creating a new dog or
a new blog.
The process inside update is that we take new data from the form and we have to find the old data we
have to look up the post of the dog first and then update it with the new data.
So we have to look something up using that Id just like show edit and destroy which we haven't talked
about yet.
These four that have an ID and then you also need to be able to look up a particular dog or post first
.
Finally we have Destroy the way that destroy works is that it's a single route.
So there's no separate form that then sends the request to destroy like there is for new uncreate although
there is a form involved.
But typically our destroy looks like this.
If I go back and click on one of these posts I have a form right here with a single button and it's
going to send a delete request to slash dogs.
In this case slash ID or on our blog site sosh blogs slash ID so delete requests.
And the point is that it leads to a particular thing and then redirect somewhere.
So there are three routes that really redirect and they are the three routes that aren't get requests
.
So we have create the update and destroyed.
Those are the ones that are doing something new.
Theyre taking data or there they're deleting or creating or they're updating.
And then when they're done with that they send you somewhere else.
And it's also worth noting that slash dog slash ID is the exact same you are Ellas update and as show
but they're very different routes because of the HTP Verd.
So in Express we can have apps that get slashed dog slash ID and then we can have apt output slash dog
session id an app delete slash dog slash ID and there are three separate routes.
Same thing goes for indexing create both of those are sashed dogs but index's that get and create is
a post.
OK so this is somewhat of an overwhelming amount of information.
I know the good news again is that you have this chart will be referencing it were going to break down
one piece at a time and create our blog site from scratch and just become naturally more comfortable
with all these wraps as we progress.
So lets go back and just want to wrap everything up again that rest this whole acronym representational
state transfer is not important.
What is important is that restful routing is a pattern of routes that we can follow.
So if we want to have full crud create read update destroy or delete for some entity users comments
campgrounds reviews ratings whatever it is in our application we want people to be able to create read
update and delete them.
We can map that functionality to the seven restful wraps just a pattern.
You do not have to use it to have cried in your application.
You can break the rules to whatever you want.
This isn't something that's enforced in any way.
It's just a convention in a nice pattern and architecture for how we structure our wraps.
So that's the really important part.
We can do whatever we want but we're going to follow restful routes again because it's just a good idea
.