Tutorials, Projects and Experiments.

A collection of stories, career paths, links and resources that I have collated from colleagues and my own experiences to help those who ask me how to get into programming.

A long list of curated resources that I've sourced from my experiences and from my colleagues.

In this part 2, I dive into some of the different programming disciplines and roles, with a view to exposing you to different programming languages.

A collection of links and resources that I use or have used in the past to help me learn

Recently I started working on a new React codebase, here is a story of how I "corrected" some React hooks code and broke a feature in production, and then went on vacation.

Recently I needed to enhance a table with drag and drop re-ordering in React. There are lots of solutions out there from roll your own to a library with large dependencies. In this article I explore using an exciting new library called dnd-kit as well as how to integrate it with react-table.

React is super popular and has often touted itself as "Just JavaScript", but in reality it has lots of quirks and gotchas that come along with it being a framework that adds limitation into JavaScript. Oh, and also write tests!

I recently had to implement an indicator of progress onto a card component, I challenged myself to see if this could be done with a single css property, here's how.

Sometimes you might want to periodically build your website on Netlify, the answer isn't that straight forward and some tools have gotchas.

You may not need client side JavaScript to add dynamic content from an API. In this article I will show the approach I recently took to embed YouTube playlists into an website created by a static site generator (Elventy), and how this approach lends itself to less JavaScript and progressive enhancement.

I've been learning TensorflowJS and Machine Learning, as an experiment, I thought I would implement a search across my current blog posts using sentence similarity on natural language, running in the browser.

Sometimes when you're prototyping and learning a new library you want a quick way to get type-checking/intellisense/auto-complete to assist with your learning. Here is a quick way to enable type checking without fully opting into TypeScript.

That feeling when you see some awful code, and then realise you wrote it. Here's a story of how some bad code I wrote in a unit test, made it into production and caused a memory leak in a NodeJS application.

Masonry layouts, think bricks, think Pinterest, have had many solutions in the web over the years. Many use too much JavaScript, but there is some exciting new things coming to CSS grid to enable Masonry layouts. But you don't have to wait, you could implement today, using progressive enhancement. Progressive enhancement is like technical debt that fixes itself.

It turns out configuring ESLint to use Stage 3 proposals is actually a massive pain, and sends you down a rabbit hole of Babel, assumed knowledge, renamed packages and half answered questions.