It’s one thing to get a full breakdown of how a starter theme works. It’s quite another to actually use the starter theme to build something, especially when that starter theme does things in new and different ways.
So, in this chapter, we’ll build a new component together from scratch using PHP, JavaScript, and CSS.
That way, you get hands-on experience on how all the things we’ve talked about up to this point actually fit together and work in production.
For this chapter, there are exercise files you can download here. For each movie, there’s a beginning branch marked “b” and an end branch marked “e”. You can open them up and follow along.
In this chapter, we’ll build a “Related posts” component that sits below the main post content:
This component is powered by JavaScript, uses the Rest API, and has some really snazzy features.
First of all, it finds the categories of the current post, and displays the three latest posts in any of the same categories. That’s why it’s called a related post component: it displays content that’s related to the current one you’re looking at.
Second, the related posts are only loaded if and when a user scrolls down to the related post section. If they don’t scroll that far, the query never happens, and the user saves that data.
Finally, the related post component uses the Rest API and JavaScript to make this query so it’s fully dynamic, which is pretty cool. We’ll get started in the next video by building a basic component.