Outline

Our images are loading, but we need to make one small change to our Events page. The Events page is showing some weird extra things in our index of events. We can fix this easily by modifying the query in events.mdx. We just need to add a filter to only list items in our /content/events folder. The fixed query looks like this:

// src/pages/events.mdx
export const pageQuery = graphql`
  query {
    allMdx(
      limit: 5
      sort: { fields: frontmatter___date, order: DESC }
      filter: { fileAbsolutePath: { regex: "//content/events//" } }
    ) {
      nodes {
        excerpt
        fields {
          slug
        }
        frontmatter {
          category
          date(formatString: "MM/DD/YYYY")
          title
        }
        id
      }
    }
  }
`

Okay, let's learn the first way to use images in Markdown: using frontmatter.

 

I finished! On to the next chapter