React Component Library for Gutenberg


I started playing with my website a few weeks ago and decided that I wanted to try moving the CMS back to WordPress and continue using Gatsby for the front-end. If I was going to use WordPress, I really wanted to use the Gutenberg block editor instead of the classic editor. After installing WPGraphQL and wp-graphql-gutenberg, I came to the conclusion that I needed to create components to display each block. So, I decided to create a component library that I could publish to NPM. Something I had never done before.

The first blocks that I decided to support were the ones that this website uses. Headings, Paragraphs, Code, and Lists. Images were also just added since almost every site needs to display images. My plan is to work through adding support for the most common blocks first and working my way towards the more obscure blocks.

The component library is on GitHub if you’d like to submit a pull request and on NPM if you’d like to use it in your project. Please mention me on Twitter if you’re using it. I’d love to take a look. Th