Unless section we spend some time to talk about the goals of our application including what we want
to build and exactly what we want to learn while building it.
Now one of the core aspects of this application is the ability to save and then later retrieve blog
posts in this section aren't a little bit of time to talk to you a little bit about exactly how we're
going to save these blog posts to some remote API.
So first thing we'll do is take a look at the general architecture that we're going to use here.
When a user visits our page or when they start up our application they're going to load up our redux
application are reacting redux application into their web browser.
The instant that the application loads up inside their browser We want to show the user a list of blog
posts.
So presumably we're gonna have to somehow source or find a list of blog posts to show to the user to
store all of these blog posts.
We're going to make use of an API that I've already taken the liberty of setting up for this application.
So inside of our browser are reacting Reebok's application will make an Ajax request over to this blog
post API fetch a list of posts and then show them on the screen to the user.
So we've done quite a few applications now where we fetch some amount of data and show it to the user.
This is going to be very similar in that regard.
So we're going to fetch this list of posts shown to the user.
I want to spend a little bit of time inside the section to talk to you more about this blog post API.
We're not going to make immediate use of the API.
You know we're not going to use it in the next section or two but it's going to have a huge impact on
how we structure our application.
So I want to make sure that you've got at least a preliminary understanding of how the API works.
So we're going to check out some documentation.
We're going to make a sample request or three and get a better sense of what it's going to do for us.
OK.
So let's first pull up the documentation for this API inside of my browser.
I'm going to manually navigate to redux blog dot Heroku app dot com.
Now do make sure that you're going to Heroku app dot com not just Heroku dot com.
So don't do double check that.
Get on this page.
I've set up some amount of documentation that profiles the four different routes that you're going to
be able to make access to.
So you can see every single one of these rows on here is a different route that we can make a request
to.
And each one has a different purpose.
Now the documentation here is you know I think somewhat clear.
So I just want to do a very brief overview of each of the routes and if you wish.
You can certainly pause the video right now and read through all the documentation yourself.
So let's go through each of these four routes.
The first route that we can make and request to will fetch a list of all the different blog posts that
the user has created.
The next one will accept a post type request to create a brand new blog post and save it to the server.
The third one fetches a very particular post so you can see in here the intent is to provide the ID
of the post that we're trying to fetch and then the last one is intended to delete a very particular
post.
So you're supposed to provide the ID of the post that you want to delete.
I want to now try out some of these different routes inside of API client or a request client and we'll
get just a better sense of how they work and just kind of clarify a couple of loose ends on exactly
what the API is doing for us to make a couple of practice or test requests.
I'm going to use an API client called post man so I'm going to open up a new tab.
I'm going to go to my chrome installed applications and I'm going to open up post man.
Now I already have postman installed again.
It is a network request client that we can use to make network requests to arbitrary endpoints.
You don't have to install postman.
It's totally optional.
I'm going to show it to you just to kind of demonstrate exactly how the API works.
If you want to install post man and follow along.
You can open up chrome and then go to the web store and do a quick search for man and download it and
install it in case I open the thing up and we'll go ahead and make a test request
or wait for the load.
Any minute now there we go OK.
So in this interface we can select the type of request up here we can enter in the URL that we want
to send the requests to and we can specify some of the different options that are going to accompany
that request and then eventually click send to send the request off.
So I want to go through the process of first creating a post fetching it and then deleting it.
So in total we're going to make three separate requests.
Flipping back over to the API documentation I'll find the second route down here which is the route
that we can use whenever we want to create a new blog post.
So I'm going to copy this endpoint right here and copy it a flip back over to postman and put it up
in the request you are l because the documentation says that to create a new blog post I have to make
a post type request and make sure that I've got posts selected here.
And then I'm also going to make sure that I specify some body of the request so you can see that I've
already entered in a body here.
Now if you're following along with postman some really important settings to make note of do make sure
that you've selected rawe on here and make sure that you've also selected a post type of Jason or excuse
me application slash Jaison.
Now in the body of the request This is not a javascript object it's a sign object which has just slightly
different semantics.
Essentially just make sure that you're using double quotes around all the keys and all the values.
If you use single quotes like so you're going to see a little error message pop up.
And if you omit the quotes altogether.
Yeah still going to be an error as well.
So do make sure that you're making use of double quotes everywhere in here.
OK.
So when I send this request it should create through post on this server and then return the newly created
post to me.
Now one last thing that I want to mention before I actually send this thing off because this API right
here it doesn't really have the concept of unique users or anything like that.
So the kind of semantic that we're using for identifying posts that belong to a particular user is to
add a little API key.
So this is going to be a parameter that we'd tack onto the R L.
The key is you don't have to generate it ahead of time you could just enter in a completely random string
of characters.
The only requirement is that you must provide the key on every followup request that you make some practice.
All I really have to do is out on key and then some unique string that I continue to use to all the
time.
So for me I think I'll use Stephen.
One two three four.
That's good enough OK.
So I'll send the request off.
And yep.
Looks like the post was created.
I get back the title categories and content of the post.
And you'll also notice that I now have an idea assigned to the post as well.
So now I can make a follow up request to my API to fetch this particular post right here if I so chose.
Let's try to do that now.
So I'm going to copy the ID I'm going to change the type of request over to get and just to make sure
everything is really clear.
Let's check out the documentation on this as well.
If I go down to the third line right here you'll see that to fetch a very particular post with a given
ID will make a get type request to API slash posts slash the ID of the post I want to get.
Ok so I'm going to make sure I go to API slash posts slash the API or something the idea of the posts
I just created.
So now make my request and I get the same request back or do I get the same post back.
Now the last thing that we can do is make a delete type request with the same exact you are l and that
will delete this post so I'll delete it and OK.
That should pretty much be it.
Now if I make a follow up get request.
I would expect to see an error message saying hey can't find that post.
So yep for a 4 status error not found.
OK so that's the three big routes.
And of course there's one other big route that we are going to care about which is the index route that
fetches a list of all the different blog posts that are tied to this particular API key.
Now there's one last thing I want to mention about this API that I put together.
I'd put a throttling mechanism around the API so that you can only make a limited number of requests
per second.
This is just to avoid you accidentally writing a request inside of a for loop or something like that
and firing off too many requests.
So if you start to make a ton of requests and we're talking about like 5 in one second you might start
to see some requests fail and again that's just because I'm making sure that you know you're not accidentally
writing some mistake code here that starts to crash the API or anything like that in practice.
I really don't expect you to run into that limitation at all.
So it should definitely be A-OK.
OK so in this section we did a big overview of the API that we're going to use.
We've got a better idea of how the API is going to work.
So let's continue talking about the architecture of our application inside the next section.