Feature Request: Categories

[kavinvalli]

Hey there!

Is there some way in which we could make categories and make posts inside certain categories? Would love it if you could suggest a way to do so

[JoseRFelix]

Hi @kavin25!

You could achieve this by filtering your posts.

First, add something to filter on the frontmatter like a category.

---
title: Coding Post
description: Coding is such a blissful activity.
date: 2020-04-19T11:00:00.000Z
category: fun
---

content

Finally, Filter posts on index.js according to a variable.

    const [currentCategory, setCurrentCategory] = React.useState("fun")

    posts
    .filter(({frontmatter: {category}}) => category === selectedCategory)
    .map(({frontmatter: {title, description, date}, slug}) => (
      <article key={slug}>
        <header className="mb-2">
          <h3 className="mb-2">
            <Link href={'/post/[slug]'} as={`/post/${slug}`}>
              <a className="text-4xl font-bold text-orange-600 font-display">
                {title}
              </a>
            </Link>
          </h3>
          <span className="text-sm">{date}</span>
        </header>
        <section>
          <p className="mb-8 text-lg">{description}</p>
        </section>
      </article>
    ))

You may have noticed that I did not include how to update currentCategory. This is because I don't know exactly how you want it to be changed, be it by chips, links, or another ingenious idea.

As an alternate solution, you could create a URL like /[category], and filter it on getStaticProps.

I will probably in the future add something like this.

Cheers! 🚀