With Frontend libraries like React, we often don't use classes. But the same public/private differentiation can be made through…

When writing integration tests (tests that do minimal mocking) I often find myself duplicating test cases. In scenarios like this…

To share code between gatsby-node files and other components the shared file must use CommonJS syntax. For example: The exported…

This is part three in a series on Testing Hooks The final category of hook usage is one of utility. These are hooks from libraries…

This is part two in a series on Testing Hooks In the last section where we shuffled around some code to make it more readable, we…

This is part one in a series on Testing Hooks The first category of hook usage is code organization to make our code easier to…

The primary category of React hook usage is code reuse between components. When trying to determine a testing strategy for a…

For a quick overview on Compound Compounds check out this article. Compound components are made up of many component parts. The…

If you're here you're probably second-guessing your usage of GraphQL. It's a great tool but if your not deliberate about your…

React Context is a tool for designing flexible Component APIs. How we test it depends on the situation, we are going to explore…

This article will be enough to get you started with unit testing gatsby-node.js, we are not going to deep dive into every possible…

This article is walk-through of testing a React Bar Graph with Jest and React Testing Library. The style of tests documented here…

A few months ago I added a feedback textbox to the bottom of every article. I wanted to know when someone finds there way to an…

Often we can end up with complex logic in components because the shape of the data determines how we write our component code…

tells CSS grid to slot in items where there is space. This shuffles around the visual order of the elements, the DOM tree remains…

I had been following the Presentational and Container pattern invented by Dan Abramov, although it seems that even Dan has changed…

Kent C Dodds mentions in his article about snapshot testing when referring to a particular snapshot. "What makes this snapshot…

Sometimes typescript can feel like duplication, describing code that is already static (constant). Heres one trick to mitigate…

To some extent, it is the design of tools like slack that makes them addictive. To avoid the point of diminishing returns with…

After re-reading YDKJS: Async and Performance. I had the realization that I have been making over-optimizations. I had not taken…

This article will go over some component API design patterns at a high level without getting into implementation details of…

What are Compound Components? It's a base component that expects to be combined with other component parts. Below the is the base…

React-redux hooks like and the can have the same outcomes. The main difference between them is their ability to nudge (guide…

Tailwinds utility classes make styling lighting fast (for me at least) but I have found there is a point where conditional styling…

Update: You might be better off using TSDX "TSDX is a zero-config CLI that helps you develop, test, and publish modern TypeScript…

AngularJS has ng-class for conditionally applying classes. This is a replacement for that in React. At accelo we are in the…

This is a list of git aliases I commonly use, mainly this is just a reference for myself for when I change computers or when…

This article is not a tutorial on how to build a chrome extension from scratch. Maybe you know how to make an extension with…

This is a solution for implementing color themes with tailwind. It makes use of CSS variables which are great providing that you…

Never override them Avoid CSS where the utility class is overridden. For example, overriding with a child selector. You want them…

Let's go over some ways to keep your z-index usage sane. All in one place Keeping all of your z-indexes in one place, in order…

I learned some things about media queries while looking into how they are used in Tailwind. It's a CSS library that generates…

A problem I came across when using a mix-match of tailwind, purgecss and Gatsby is that selectors used in the generated pages were…

This article contains a strategy for creating category list pages from categories defined in a markdown article. There is an…

This article aims to show an alternative to overriding properties directly. Instead we can use CSS variables with the help of…

This article explores using the currentColor property to theme elements, to avoid writing extra CSS to override color. In cases…

A magic number is a number or value in code that does not have an explicit meaning. In CSS maybe we don't have to be too strict…

My approach to color usage is similar to a "no magic numbers" rule that you might find in javascript, where colors are always…

I like elements that move on hover to convey interactivity. A problem with this pattern is "flickering" that can happen when…