Our application is close to being completed. Now that you are familiar with how to implement the full set of CRUD functionality in your application, we're going to move on to the last main feature of our application which is our blog.
In this guide, we're gonna walk through building out the initial architecture.
Now that we have our class component in place, we're ready to actually call the blog API and then return our data.
Now that we have our blog items in our local component state, we can work with 'em and we can render them on the screen.
So, now that we're rendering our titles on the screen, in this guide we're gonna create a dedicated item, a dedicated blog item component and it's gonna start off pretty basic.
In this guide we're gonna build out the blog detail component and we're gonna connect it both with the routing engine and also with our blog index page.
In this guide, we are gonna start building out our blog detail component, and I'm actually filming this on the road from the DeveloperWeek Conference in the San Francisco area, so that's why I'm filming this from a hotel room.
So now that we know that we can properly call the API, and we can get a single blog item back, now let's render it on the screen.
Now that we're rendering all of the content we want for right now onto the page, let's spend a little bit of time making this look better.
Now that we have our basic styles set up, in this guide we're gonna populate those to our blog index view page.
These next few guides are going to be very exciting and at the same time very challenging. The topic that we're gonna cover which is how to build a infinite scrolling feature in your application, is not a trivial feature.
In the last guide, we walked through the window object in the browser and also how to add a onscroll event listener to be able to track and see whenever a user is scrolling inside of our application.
Now that we can work with scroll events and we know the dimensions of the document and of the window size and where the user is scrolling, what we can do is connect that with the ability to go and retrieve more blog records.
The next step in our infinite scroll feature build is to build in the ability to have a little loader.
This is gonna be a really fun guide, I know that we've taken a number of lectures to get up here and you've written quite a bit of code and in this guide, all of your work is going to come to fruition.
In this guide we are going to take care of a subtle, but important bug with our infinite scroll feature.
This is gonna be a relatively short guide and we're not gonna write a lot of code. Instead, we are going to plan out the next feature we're gonna build, which is the blog modal.
In this guide, we are going to call our new modal and we're gonna create a component dedicated to just managing the blog modal. I'm also recording this set of guides from the Bottega offices in Lehi, Utah, so let's get started.
So, in the last guide, we were able to get our modal working and to have it automatically show up whenever the blog loads, but obviously, that is not our long-term goal.
Now that we have the ability to open the Modal by simply clicking on it, we now need the ability to close it.
devCamp does not support ancient browsers.
Install a modern version for best experience.