Adding a List of Markdown Blog Posts

Once you have added Markdown pages to your site, you are one step away from being able to list your posts on a dedicated index page.

Creating posts

As described in Adding Markdown Pages, you will have to create your posts in Markdown files which will look like this:

Creating the page

The first step will be to create the page which will display your posts, in src/pages/. You can for example use index.js.

Creating the GraphQL query

Second, you need to provide the data to your component with a GraphQL query. Add it, so that index.js looks like this:

Creating the PostLink component

The only thing left to do is to add the PostLink component. Create a new file post-link.js in src/components/ and add the following:

This should get you a page with your posts sorted by descending date. You can further customize the frontmatter and the page and PostLink components to get your desired effects!