Object-fit and background-size
One very frustrating thing when working with images on the web is when you're trying to fit an image into a container. If the image has different dimensions and aspect ratio than the container, the...
Building a website to host Codelabs
Introduction # I use Codelabs to document processes and step-by-step instructions for given processes or topics. However, unlike tools for authoring codelabs, there is no real way to author a codelabs...
Building a backend using Express.js
A lot of times when I try a new front-end technology or decide to work with a new framework, I need a backend to work with. For the longest time, I've used a project database hosted locally but I've...
Revisiting WebAssembly with Go
It's been a while since I've looked at WebAssembly and Go. Some things have changed since then and I want to document them as I revisit them. Some of these changes deal with the evolution of Go as a...
Gutenberg review: blocks
In a previous post I briefly discussed how to configure blocks and themes using JSON files. The emphasis of that post was on theme configuration and briefly mentioned block.json in passing as a way to...
Gutenberg: My Issues (2022 version)
This is a place to document issues I'm finding as I build my theme. A lot of these issues may be caused by my lack of experience with Gutenberg and the way the full site editor works. I will file...
Gutenberg Pagination and Post Navigation
Gutenberg gives you the tools to do pagination visually but, unfortunately, I haven't found a way to customize the pagination tool so that it works the way I want to. There are two different types of...
Revisiting Gutenberg as a design system
Gutenberg presents an interesting way to create and use design systems and present them to the user. I use the following definition of a design system: A design system is a complete set of standards...
@wordpress/create-block
@wordpress/create-block (create-block for short) is a Node package that provides the officially supported way to create blocks. The basic structure the script provides is as follows: . ├── build │ ...
Nesting Gutenberg blocks
Often we want to create a block with multiple child blocks. For example, block quotes may have lists and other elements nested inside them. Container blocks like the columns blocks also support...