Skip to content

Writing

Advanced internationalization with Next.js and middleware
  • Next.js

Advanced internationalization with Next.js and middleware

February 24, 2022 2 Min

Next.js 12 introduced middleware for handling logic at the CDN level (sometimes called an edge function) before a page loads. This is incredibly powerful and unlocks the potential for static pages to have limited server-side logic. There are lots of examples of this but one compelling use case…

Gatsby Themes Pros and Cons
  • Gatsby

Gatsby Themes Pros and Cons

November 13, 2021 4 Min

Here is the TLDR. I think for most projects, most of the time, you should use a "starter" when beginning a new Gatsby project. In my opinion Gatsby themes are best suited for two main use cases; large enterprise size projects or a high flow design/development agency. I say this as someone who has…

Using conditional fields in SANITY for better links
  • SANITY.io

Using conditional fields in SANITY for better links

September 1, 2021 2 Min

SANITY.io has just released conditional fields for their content studio which enables developer superpowers to fine tune the editing experience in ways that just weren't possible before. You can now conditionally hide and show fields in the editor based on content in other fields. Heyo! This post…

Ch-ch-changesets: turn and face the changelog
  • Monorepos

Ch-ch-changesets: turn and face the changelog

August 26, 2021 4 Min

Monorepos, arggg, it's complicated . As monorepos grow in size and complexity managing the linked packages gets more and more finicky. I've spent a lot of time trying to sort out better workflows and tooling to automate changelogs, versioning and publishing. After some trial and error, I eventually…

Reflections on RedwoodJS
  • RedwoodJS

Reflections on RedwoodJS

May 20, 2021 5 Min

I spent a fair amount of time in March and April digging into RedwoodJS after having toyed around with it briefly last year when it was first introduced. I wanted to capture some of my reflections for future me; and maybe this is useful to someone else who is considering adopting Redwood for a…

How to setup a staging website with SANITY
  • SANITY.io

How to setup a staging website with SANITY

April 3, 2021 4 Min

Heads up! This guide uses an experimental feature of SANITY. Did you know that you can easily give your client a staging environment with SANITY? Even on their developer plan? Staging environments empower content editors and developers to test major content and code revisions without fear of…

Notes from CSS-for-JS Course
  • CSS

Notes from CSS-for-JS Course

March 16, 2021 2 Min

Heads up! This is a "digital garden" type of post that will be updated over time as I complete the course. I purchased early access for Josh Comeau's CSS-for-JS Developers course and will be keeping some adhoc notes here about my progress completing the course. I am coming into this course with…

Adding global script and stylesheets to Gatsby head
  • Gatsby

Adding global script and stylesheets to Gatsby head

February 16, 2021 1 Min

Adding a global script or stylesheet to your <head> element in Gatsby can feel a bit tricky. You can't just copy and paste into an html template from days of yore. The final html document structure is composed by Gatsby at build time which means we need a couple of extra steps to get this done…

Advanced mapping with Gatsby and React Leaflet
  • Gatsby

Advanced mapping with Gatsby and React Leaflet

January 26, 2021 8 Min

Hang on to your hats - this is a blustery one! In this post we walk through creating an imaginary real estate mapping app using Gatsby and React Leaflet . We are using v3.0 of react-leaflet which was released at the end of 2020 - this code won't work for v2 but I have working code for v2 of react…

Gatsby Theme Catalyst in 2021
  • Gatsby

Gatsby Theme Catalyst in 2021

January 9, 2021 3 Min

2020 - what a year. I want to begin by acknowledging that this post is about a bunch of insignificant computer code when cast against the pain and suffering that has unfolded across the globe this past year. I hope you are safe and healthy with your loved ones. The future is bright for Gatsby…

Load more button and infinite scroll in Gatsby
  • Gatsby

Load more button and infinite scroll in Gatsby

December 21, 2020 3 Min

Load more buttons and infinite scrolling are common UI patterns on websites with large amounts of content. It improves page load performance and allows users to dynamically view more content as needed. From a web development perspective this data is often refreshed via an API call and on very large…

Form submission using Gatsby, SANITY, Netlify and React Hook Form
  • Gatsby
  • SANITY.io
  • Netlify

Form submission using Gatsby, SANITY, Netlify and React Hook Form

December 17, 2020 7 Min

Heads up this guide was written with v6 of react-hook-form, v7 introduced some changes that will need updates from this code. Check out the migration guide for more info. Buckle up. This is a big one. We are going to walk through creating a contact form in Gatsby that submits to both an email…

How to setup a Gatsby themes monorepo
  • Gatsby
  • Monorepos

How to setup a Gatsby themes monorepo

August 25, 2020 5 Min

I manage a Gatsby themes monorepo that currently has 11 themes and 8 starters with over 1500 commits - lots of moving parts to keep organized. At the end of this tutorial you will have a Gatsby themes monorepo setup with automated testing, automated dependency management, automated publishing…

Geocoding with Gatsby and SANITY.io
  • Gatsby
  • SANITY.io

Geocoding with Gatsby and SANITY.io

July 20, 2020 2 Min

Geocoding is the process of turning a regular address into latitude and longtitude coordinates that can be used in a mapping application like Google Maps or LeafletJS . I am going to walk through setting up a SANITY.io schema, querying the SANITY.io API via gatsby-node.js , passing the query…

Validation snippets for SANITY.io
  • SANITY.io

Validation snippets for SANITY.io

July 18, 2020 1 Min

A great feature of SANITY.io is the ability to add field validation to schema types. This can ensure data conforms to specific patterns, e.g. a ZIP code is actually a valid ZIP code or an email field is a valid email. This brief article covers just a few of the ways you can validate a field, I…

How to use Theme UI variants
  • Gatsby
  • Theme UI

How to use Theme UI variants

June 8, 2020 2 Min

I am a big fan of using Theme UI to style Gatsby projects. For me one of the standout features is the less well known - but very powerful - API called variants . Variants allow you, as a theme developer, to enable a happy path for users to customize their visual design without having to shadow…

Using Theme UI with RedwoodJS
  • RedwoodJS
  • Theme UI

Using Theme UI with RedwoodJS

May 21, 2020 1 Min

This is current as of Redwood v0.28 and Theme-UI v0.6 RedwoodJS is a new javascript framework bringing the frontend and the backend together in one incredible fullstack package. They have a great tutorial that gives you a good feel for what is possible with Redwood. While I was completing the…

10 reasons to use Theme UI in your next Gatsby project
  • Gatsby
  • Theme UI

10 reasons to use Theme UI in your next Gatsby project

March 25, 2020 4 Min

Combining Theme UI with Gatsby has been a huge productivity win for me; design tokens, quick mobile styles, a robust component library and more. I am building every new project using Theme UI and here are 10 reasons I think you should consider it too. Consistent design system At the heart of…

Should we be thinking differently about imposter syndrome?
  • Mental Health

Should we be thinking differently about imposter syndrome?

March 6, 2020 3 Min

Before you read. I write from a place of significant social privilege and my experiences are not reflective of everyone's experiences. I work full time as a mental health therapist and have a Masters in Social Work degree. References are at the end. I was at a mental health training recently where…

Building a sub-menu with Gatsby
  • Gatsby

Building a sub-menu with Gatsby

February 24, 2020 3 Min

You have a great Gatsby site! You followed all the tutorials and it is blazing fast. But wait, you need a sub-menu (or dropdown menu) in your navigation? It is not as easy as it sounds if you want to keep a modern component architecture and use things like the javascript .map method. This is a…

Using Theme UI with SANITY.io
  • Theme UI
  • SANITY.io

Using Theme UI with SANITY.io

February 8, 2020 1 Min

Gatsby, SANITY.io and Theme UI are quickly becoming my go-to stack of development tools. Gatsby on the frontend. SANITY on the backend. Theme UI as the design system interface. Combining these three tools has been fairly smooth, but it took me a while to realize I could link Theme UI design…

Examples of using options in Gatsby themes
  • Gatsby

Examples of using options in Gatsby themes

February 1, 2020 2 Min

The ability to define options for Gatsby themes unlocks a powerful set of development opportunities. You may have already used an option like contentPath before but there is so much more you can do! Before you go any further, you need to pause and read Chris Biscardi's excellent post about…

Getting Started With Gatsby-Theme-Catalyst-Writer
  • Gatsby
  • SANITY.io

Getting Started With Gatsby-Theme-Catalyst-Writer

January 28, 2020 2 Min

This theme has been depreciated, instead use gatsby-theme-catalyst-hydrogen , which is an updated version of this theme with an improved API. There is a complete tutorial for this updated theme you can follow. This Gatsby theme is for freelance writers and journalists who want a fast, easy to…

Understanding latent component shadowing in Gatsby themes
  • Gatsby

Understanding latent component shadowing in Gatsby themes

January 12, 2020 2 Min

As I worked on building themes for Gatsby I went through a number of different iterations trying to find an approach that would allow for easy composition and clear separation of concerns. The lightbulb went off for me when I read John Otander’s blog post on the topic of latent component shadowing…

How to display alternate content in dark mode using Theme UI
  • Gatsby
  • Theme UI

How to display alternate content in dark mode using Theme UI

January 8, 2020 1 Min

Theme UI provides a great pattern for implementing dark mode on your Gatsby website. If your site is primarily text, this can be as straightforward as changing a few colors in your theme and off you go. Most websites are not so minimal and include images, icons, background patterns, etc. If you…

Introduction to Gatsby Theme Catalyst
  • Gatsby

Introduction to Gatsby Theme Catalyst

January 1, 2020 2 Min

Gatsby Theme Catalyst has been launched along with a new website and docs . The content in this post is outdated and probably not worth reading anymore. Gatsby Theme Catalyst is my opinionated view of a modern tech stack relying on a combination of Gatsby , MDX , and Theme UI . I built this…

Illustrations by Diana Valeanu
© 2022 Eric Howey - eric@erichowey.dev

In the spirit of reconciliation, I acknowledge that I live, work and play on the traditional territories of the Blackfoot Confederacy (Siksika, Kainai, Piikani), the Tsuut’ina, the Îyâxe Nakoda Nations, the Métis Nation (Region 3), and all people who make their homes in the Treaty 7 region of Southern Alberta.