Journal

I thought it might be interesting to look back through the years at how the tools in Engineering have changed as our company has grown from 3 to over 240 (and engineering to over 100), and to give a shout out to (some of!) those tools that we consider crucial to our workflow today – especially in these most unusual times where most of the world is working remotely.

A great insight from FreeAgent CTO, Olly Heady, describing how the engineering team have benefitted from tools such as G Suite (Google Apps), Github, Trello, Datadog, Humio and Notion.

grep.app searches code from over a half million public repositories on GitHub.

This could be useful when you’re struggling to use a certain new CSS property, or npm package, and want to see how other programmers are using it.

I wanted there to be an easy way to complete crosswords together that didn’t need people to pass a phone back and forth or for a copy of the crossword to be made in a shared Google Spreadsheet.

Several People are Solving is a lovely React app which started as a fork of The Guardian’s Frontend repo in order to further develop their crossword component.

See author Chris Zetter’s article on how he then introduced WebSockets (within a Rails application) to facilitate real-time collaboration.

The crosswords are updated regularly so what are you waiting for? Get solving!

Here’s a handy resource providing BEM-based naming suggestions for some of the most common web components.

It includes sensible BEM naming for such common components as:

• Breadcrumb;
• Button;
• Card;
• Navigation;
• Tabs; and
• Stack.

It’s also important to do research with all the different kinds of people who may need your service, including those who: have disabilities or use assistive technologies; have limited digital skills or poor literacy; and may need help to use your service.

Useful advice regarding user research from GOV.uk covering how to define participant criteria, find participants for research and handle incentives.

(via @paddyduke)

Documentation for the BEM component and CSS class-naming notation

methodology BEM was invented at Yandex to develop sites which should be launched fast and supported for a long time. It helps to create extendable and reusable interface components.

Here’s Chris Ferdinandi with a list of resources to help those who are new to web development get started. I’m keeping this one handy so I can share it with any friends who’re thinking of getting into this game.

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.

Fantastic effort by Max Böck here, stepping up during the COVID-19 pandemic to provide this Eleventy template for organisations to use to publish critical information as lean, resilient, static HTML pages.

In this tutorial we'll use the box-shadow property to create a layered card component, and animate it on hover.

Beautiful effects expertly combining colour, clever box-shadow configurations and position-based animation.

Check whether or not a CSS property is a good candidate for smooth animation based on whether updates to its value trigger expensive changes (to, for example, “element geometry”) causing layout updates and repaints.

width and height are both poor candidates whereas transform is good.