Dark mode has been around for quite a long time now and you see a lot of websites embracing the power of what it can do by applying themes to a website. …

If you have wrote CSS for fonts before you have probably experienced having to introduce a lot of media queries for different breakpoints. A designer will provide designs for mobile/desktop and then the developer ends up asking “what about tablet?”, sound familiar? …

The other day I was building a storybook page component and I was having issues where the page had a useEffect hook that hit an api from the dev environment to populate the state. …

On my personal website I use Medium as my content platform so I can channel my content via multiple channels. This is great because it allows me to take advantage of medium’s rich text editor and the implementation is really easy to do in 11ty. Tech Stack Website The website is built…

Minifying html is a really useful feature that can improve TTFB on the page and with 11ty it is very simple to do. In the eleventy.js config file we need to add a transform to the config which will check if the output is a .html …

Lazy loading is a concept where you only load the images within the viewport of the device the user is in. As the user navigates around the site, images will load in on demand. …

Fonts have the potential to be extremely slow. The more you include the more it can impact multiple metrics such as page weight, page load, first paint and first contentful paint. What performance issues can occur? Chain requests A chain request is when a resource that is required by another file instead of the document. When you…

Day one was focused around CSS and each talk was truly inspiring. Here are a couple of talks that really stood out for me. Sarah Dayan — Utility based design systems The first talk was about Utility based design systems. Sara explained how to build design systems/style guides more efficiently using the utility based classes. …

Yesterday I spent some time learning about how to use the context and when I read the docs I thought, “this sounds extremely complex for something that does a simple thing”. I definitely felt like this at first: