Developing Gutenberg Blocks with Parcel.js and Astroturf

Originally published at:

A huge pain point for getting started with developing Gutenberg blocks in JavaScript is the learning curve for build tools. In this demonstration we’ll pragmatically work our way up from mkdir to a working "Hello, World!" block, including support for styling with CSS-in-JS, an approach which bears out myriad workflow improvements. And we’ll do it…


Great idea congratulation.

But i have a question you have any idea how separe unused block ?

if i dont use any block i dont want load it on page.

Thanks Sebastian.

Most of my blocks only end up having a few lines of CSS so it’s really no big deal. Would be worse for the user to not just include in my primary stylesheet. The rest of the block content is just stored in the database — same as posts. There is no Gutenberg JS loaded on the frontend of WP so the only assets you need to worry about managing are your own.