Open in app

Sign In

Write

Sign In

George Griffiths
George Griffiths

22 Followers

Home

About

Jan 10, 2022

How trip yourself up with React hooks and break production

Recently I started working in a new React codebase, here is a story of how I “corrected” some hooks code and broke a feature in production. — React is so ubiquitous now it’s pretty difficult to avoid it if you want to be employed and working in Web application development. …

Java Script

11 min read

How trip yourself up with React hooks and break production
How trip yourself up with React hooks and break production
Java Script

11 min read


Jan 1, 2022

Ensure your site automatically updates in future!

If you are using a static site generator you might want to have some static content that periodically updates, such as a year, let’s see how you can automate it! — Every year you probably want to ensure your copyright header on your site(s) is up to date, if you manage lots of sites you will want to automate this! To solve this you might want to periodically build your website on Netlify (or similar), the answer isn’t that straight forward and some tools (Github Actions) have gotchas.

HTML

3 min read

Ensure your site automatically updates in future!
Ensure your site automatically updates in future!
HTML

3 min read


Dec 19, 2021

Beautiful drag and drop interactions with react hooks

In this article we’ll explore how you could build a drag and drop sortable table using @dnd-kit and react-table. Drag and drop table using react-table and dnd-kit. When looking for drag and drop libraries in React there are a lot of options, some of the popular ones are: Many of…

Java Script

6 min read

Beautiful drag and drop interactions with react hooks
Beautiful drag and drop interactions with react hooks
Java Script

6 min read


Nov 7, 2021

Just a friendly reminder that React isn’t really Just JavaScript (Don’t nest Functional Components)

This is my first blog post I’ve written about React, despite reluctantly using it every day due to the UK frontend job market. I’ll probably regret talking about such a popular Framework, oh and it is a Framework 😉. Recently, I was writing an animated slide-in sidebar component, which could…

React

5 min read

Just a friendly reminder that React isn’t really Just JavaScript (Don’t nest Functional Components)
Just a friendly reminder that React isn’t really Just JavaScript (Don’t nest Functional Components)
React

5 min read


Oct 20, 2021

Building progress indicator cards with a single css property

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. — Here is a full demo of the css which I’ll show you how to build, by learning the structure of the css background shorthand property. Before today I’ve always shied away from full understanding all of the shorthand property capability that is baked into the background attribute but today…

HTML

4 min read

Building progress indicator cards with a single css property
Building progress indicator cards with a single css property
HTML

4 min read


Jun 23, 2021

Adding dynamic content from an API to a static website at build time

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 recently launched a re-write of my brothers Guitar teaching business website: cgguitar.co.uk, during this rewrite I had some guiding principles which I believe are best practices when building any website:

11 Ty

6 min read

Adding dynamic content from an API to a static website at build time
Adding dynamic content from an API to a static website at build time
11 Ty

6 min read


Apr 22, 2021

Natural language search for blog posts using TensorflowJS

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. — In this post i’ll go into how you can get started using pre-trained Tensorflow models to do Machine learning in the browser, examine some of the potential gotchas, such as not blocking the main thread with custom logic and consider the impact of the size of models on UX.

Java Script

9 min read

Natural language search for blog posts using TensorflowJS
Natural language search for blog posts using TensorflowJS
Java Script

9 min read


Apr 18, 2021

Type checking global JavaScript libraries in VS Code for when you just want learn and code.

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. — I’ve been learning a little bit of artificial intelligence/machine learning in my spare time and I recently started learning a little TensorflowJS. The quickest and simplest way of getting TensorflowJS is a good old script tag. …

Java Script

4 min read

Type checking global JavaScript libraries in VS Code for when you just want learn and code.
Type checking global JavaScript libraries in VS Code for when you just want learn and code.
Java Script

4 min read


Mar 18, 2021

Memory leaks and why should you never write such bad code, even for tests

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. — A project that I work on started showing crashed Pods in our Kubernetes (K8s) cluster, which runs a NodeJS server in a container, it was failing with a dreaded “OOMKilled” (Out of memory killed) error, which sent me down the path of learning about profiling NodeJS applications for memory leaks.

Java Script

6 min read

Memory leaks and why should you never write such bad code, even for tests
Memory leaks and why should you never write such bad code, even for tests
Java Script

6 min read


Jan 13, 2021

Building a responsive, progressively enhanced, masonry layout with only CSS and HTML

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. — A few days ago I found that I had talked myself into re-designing a website. The website is for my brothers’ guitar teaching business which I had previously worked a few years ago, when I was a student. …

Web Development

6 min read

Building a responsive, progressively enhanced, masonry layout with only CSS and HTML’
Building a responsive, progressively enhanced, masonry layout with only CSS and HTML’
Web Development

6 min read

George Griffiths

George Griffiths

22 Followers
Following
  • Netflix Technology Blog

    Netflix Technology Blog

  • David Gilbertson

    David Gilbertson

  • Eric Elliott

    Eric Elliott

  • Meteor Software

    Meteor Software

  • Kapil Pau

    Kapil Pau

Help

Status

Writers

Blog

Careers

Privacy

Terms

About

Text to speech