Writing

  1. Going Buildless

    code

    Can we do modern web development without a build step? How can we solve common build problems in HTML, CSS and Javascript using just the platform?

  2. Live CMS Previews with Sanity and Eleventy

    code

    How to set up on-demand building in Eleventy to allow live content previews with Sanity CMS.

  3. Upgrading to Eleventy v3

    code

    I took some time this week to upgrade my site to the newest version of Eleventy. Here's what I learned.

  4. Container Queries in Web Components

    code

    Container Queries are one of the most anticipated new features in CSS. I recently got a chance to play with them a bit and came up with this demo.

  5. Asset Pipelines in Eleventy

    code

    While some SSGs have a standardized way of handling assets, Eleventy does not. That's a good thing! Here are a few possible approaches you can take.

  6. Making Persistent Build Folders in Netlify

    code

    I recently learned how to make persistent cache folders that stick around between builds on Netlify, and I'm using it to store webmention data.

  7. Human Code

    general

    Some problems can’t be solved with technology. You can’t code away systemic racism, and you can’t design your way out of a human rights crisis.

  8. Color Theme Switcher

    code, design

    Let users customize your website with their favorite color scheme! Your site has a dark mode? Mine has ten different themes now, and they're named after Mario Kart 64 race tracks.

  9. Eleventy Résumé Builder

    code

    A free template to generate semantic, accessible & resilient résumés for the web and print.

  10. The Emergency Website Kit

    code

    In cases of emergency, many organizations need a quick way to publish critical information. But existing (CMS) websites are often unable to handle sudden spikes in traffic.

  11. On Simplicity

    general

    We assume that complex problems always require complex solutions. But sometimes the smarter way to build things is to try and take some pieces away, rather than add more to it.

  12. Connection-Aware Components

    code

    The Network Information API provides insight into a user's network condition. Combining it with React might enable us to build sites that can respond to different connection speeds.

  13. CSS Grid Admin Dashboard

    code

    A closer look at how CSS grid layout can be used in production today, including fallback styles for flexbox.

  14. Building Skeleton Screens with CSS

    code

    Designing loading states on the web is often overlooked or dismissed as an afterthought. Building an experience that works with slow connections is not only a developer's challenge...

  15. How to turn your website into a PWA

    code

    A Progressive Web App, or PWA, uses modern web capabilities to deliver an app-like user experience. Any website can be a PWA - here's how to do it.