3️⃣ Displaying posts

This third section can be considered to be the heart of this step-by-step tutorial. It contains the key concepts and information that you will need to properly understand Frontity and how it works.

We will start this section by taking a deep dive into Frontity's "state", and see how retrieving data from the state involves a two step process. This two step process starts with the current URL which we've already seen is available to us in state.router.link.

We will go on to use our conceptual understanding of the state and our knowledge of the two step process of data retrieval to firstly display a list of posts, and then the actual post content.

The knowledge thus gained will enable us to distinguish between posts and pages and treat them differently using separate components for each.

Frontity is fully compatible with a wide variety of JavaScript and React packages available on npmjs.com, so we'll end this section by looking at how we can use an external third party library with Frontity to format the post date.

By the end of this section most of the core functionality of our theme will be in place and your understanding of Frontity will have deepened greatly.

Last updated