home
about
dashboard
posts
writing
posts
📌
Best Bits 2021 ...
26-Jul-2021
1-Jan-2021
Oh hey there! 👋 Here's a byte-size round up of things i've done so far this year. This post is pinned and will be updated as the year…
React
Gatsby
Gatsby Functions
Three.js
react-three-fiber
JavaScript
TypeScript
Theme UI
GitHub REST
View post
How to "fix" Gatsby slow local build times
28-Jul-2021
Ahoy, as the title suggests in this post I'm going to explain one way to resolve the "slow local build time" issues I know lots of you…
React
Gatsby
JavaScript
View post
Modify Gatsby's GraphQL data types using createSchemaCustomization
2-Jul-2021
Hi friends, yesterday I published a little post about how to Add data to Gatsby's GraphQL layer using sourceNodes , this post will be…
React
Gatsby
JavaScript
GraphQL
View post
Add data to Gatsby's GraphQL layer using sourceNodes
1-Jul-2021
In this post i'm going to demonstrate how to source data from a NASA API and inject the response into Gatsby's GraphQL layer without the…
React
Gatsby
JavaScript
View post
Using Gatsby Functions as an abstracted API
11-Jun-2021
They're here! Gatsby Functions are here! They're finally here! 💝 -- And I couldn't be more excited! A little while ago I wrote a post about…
React
Gatsby
Gatsbv Functions
JavaScript
Gatsby Plugins
View post
Gatsby Plugin Image: withArtDirection
9-Apr-2021
Hello! If you're reading this you probably already know about Gatsby Plugin Image, but if not here's a recap: Announcing: Gatsby Plugin…
React
Gatsby
JavaScript
Gatsby Plugins
View post
Sourcing local .json files with Gatsby
5-Apr-2021
Hi all, I recently had a discussion with Rahul on Twitter regarding building a Gatsby blog using only locally sourced .json files…
Node.js
Gatsby
JavaScript
JSON
View post
MDX "fold it in"
29-Mar-2021
In this post i'm going to discuss the term "Fold it in" which I think was first coined by spences10 and it relates to a method of using…
React
Gatsby
MDX
View post
Gatsby File System Route API: Multiple Source MDX
16-Mar-2021
In this post I'm going to provide an example of how to use Gatsby's File System Route API to source MDX files from multiple locations…
React
Gatsby
JavaScript
MDX
View post
Understanding Theme UI
8-Mar-2021
If you're new to Theme UI or have ben thinking about getting started with CSS-in-Js Theme UI is a great choice. The docs are great but…
JavaScript
React
Theme UI
View post
Understanding Theme UI: 6 - The Hacks
9-Feb-2021
In this post i'm going to explain some of my Theme UI "hacks"... to be honest they're not really hacks but you won't necessarily find these…
JavaScript
React
Theme UI
View post
Understanding Theme UI: 5 - Media Queries
3-Feb-2021
In this post i'm going to explain how Theme UI's Responsive Values work and to get us started... You don't need to write any @media…
JavaScript
React
Theme UI
View post
Understanding Theme UI: 4 - Scales
21-Jan-2021
In this post i'm going to explain how Theme UI's Theme Scales work. If you're new to Theme UI i'd suggest having a read of the first three…
JavaScript
React
Theme UI
View post
Understanding Theme UI: 3 - Components
19-Jan-2021
In this post i'm going to explain how to use Theme UI's built in components. If you're new to Theme UI i'd suggest having a read of the…
JavaScript
React
Theme UI
View post
Understanding Theme UI: 2 - Styled component
18-Jan-2021
In my last post I attempted to explain Theme UI's Jsx Pragma, if you missed that, here's the link again Understanding Theme UI: 1 - Jsx…
JavaScript
React
Theme UI
View post
Understanding Theme UI: 1 - Jsx Pragma
12-Jan-2021
In this post I'm going to try and explain Theme UI 's Jsx Pragma. I hope to create a series of these posts that might help lower to the…
JavaScript
React
Theme UI
View post
Create an Svg Doughnut Chart from scratch for your Gatsby blog
11-Jan-2021
Charting libraries are great don't get me wrong but sometimes... you just need a bloody doughnut! 🍩 This post is largely based on this…
JavaScript
React
SVG
Gatsby
CSS
View post
Use Netlify Functions and the GitHub REST API to add Data Visualization to your Gatsby blog
6-Jan-2021
After a recent Twitter conversation with my good chum Scott we decided we'd run a little experiment that will attempt to broadly achieve…
JavaScript
React
Gatsby
SVG
Netlify Functions
GitHub REST
View post
2020 Top Tweets
24-Dec-2020
This is a bit of a shameless plug but I was curious to see how my Twitter Analytics stacked up for this year so, here's a list of my top…
View post
Silly Site Challenge
21-Dec-2020
27-Nov-2020
Go Go Go Nov 23 2020 I'm at it again 🕺 If you followed along when I did my 100 Days Of Gatsby you'll know I have a tendency to write way…
Gatsby
React
TypeScript
JavaScript
Theme UI
SVG
Netlify Functions
GitHub REST
View post
Use Netlify Functions and the Twitter API v2 as a CMS for your Gatsby blog
17-Nov-2020
Apologies in advance for the rather long-winded blog title but as it suggests in this post i'm going to explain how you can use Netlify…
JavaScript
React
Gatsby
Netlify Functions
Twitter API v2
View post
Storybook - An alternative approach
27-Oct-2020
Hiya 👋, if you like Storybook you've come to the right place. I loooooooove Storybook!! It is in my opinion the ONLY way to develop a UI…
Storybook
JavaScript
React
View post
Gatsby SEO Component
24-Aug-2020
In this post i'm going to explain how to create an Seo component for use in a Gatsby application or site, I seem to always end up writing…
Gatsby
JavaScript
View post
styled-components Responsive Array Syntax
19-Aug-2020
In this post I'm going to discuss a new approach I've adopted when using styled-components , initially I wasn't sure what this approach was…
React
JavaScript
styled-components
View post
styled-components Style Objects
13-Aug-2020
styled-components optionally supports writing CSS as JavaScript objects instead of strings. This is particularly useful when you have…
React
JavaScript
styled-components
View post
Best Bits 2020 ...
18-Dec-2020
5-Aug-2020
Oh hey there! 👋 Here's a byte-size round up of projects I've Open-sourced, posts and articles I've written and contracts I've completed so…
React
Gatsby
Gatsby Cloud
JavaScript
TypeScript
Shopify
styled-components
Theme UI
Storybook
Jest
Enzyme
Testing Library
View post
React hooks and matter.js
3-Aug-2020
Recently I was creating a Shopify demo application and became a little underwhelmed with the Checkout experience and so decided to inject a…
React
JavaScript
matter.js
View post
Everything's a box
6-Jul-2020
In this post i'm going to introduce one of the concepts you can use when developing web pages/apps using Theme UI If you're not familiar…
React
Theme UI
View post
React Svg Bubble Slider
16-Jun-2020
You've probably seen reactions before on social media, Twitter, Instagram etc all have ways for users to show their like or dislike for user…
React
GSAP
SVG
View post
First Ever Donation
4-Jun-2020
I've been at the Open Source thing for a while now and never really intended it to be a way to make a living but... On all of my GitHub…
Gatsby
Gatsby Plugins
MDX
View post
Roll Your Own Comments
21-May-2020
After seeing the following Tweet by Fauna inviting users to take part in the Write With Fauna challenge i decided i'd submit a proposal…
React
JavaScript
Gatsby
Gatsby
Fauna
Apollo
GraphQL
Netlify
View post
Gatsby CLI Recipes
8-May-2020
I recently posted about two new Gatsby Recipes i was working on to help automate the sometimes quite tricky process of installing Storybook…
Gatsby
Gatsby Recipes
Storybook
JavaScript
TypeScript
View post
MDX Embed Intersection Observer
7-May-2020
If you're not familiar with my plugin gatsby-mdx-embed have a read of this post ... or to summarize.. Gatsby MDX Embed is a Gatsby MDX…
React
JavaScript
Gatsby
Gatsby Plugins
MDX
View post
gatsby-recipe-storybook-ts
8-May-2020
4-May-2020
In a recent post i introduced Gatsby recipes and talked about a new recipe i created that automates the Storybook setup process gatsby…
Gatsby
Gatsby Recipes
Storybook
TypeScript
View post
gatsby-recipe-storybook-js
8-May-2020
26-Apr-2020
If you haven't tried Gatsby Recipes yet you really should! You can read a bit more about them here which will give you a better overview…
Gatsby
Gatsby Recipes
Storybook
JavaScript
View post
TypeScript Theme UI Link
28-Apr-2020
24-Apr-2020
In a previous post; gatsby-or-theme-ui-link i talked about how to cast a Theme UI Link as gatsby Link... and that will work fine in…
React
Gatsby
TypeScript
Theme UI
View post
Officially published
21-Apr-2020
🎉 My work on 100DaysOfGatsby caught the eye of the editorial team and now Gatsby have officially published my 100 days journey on their…
Gatsby
View post
MDX Embedded Images
20-Apr-2020
In this post i'm going to show you how to use MDXRenderer to display embedded images in the body of your MDX by sourcing them from…
React
Gatsby
JavaScript
MDX
View post
Gatsby or Theme UI Link
18-Apr-2020
17-Apr-2020
I know this has tripped me up on more than one occasion and if you're using Theme UI components in your Gatsby project it might have caught…
React
Gatsby
JavaScript
Theme UI
View post
Svg Icon Systems
17-Apr-2020
If you're doing this in your React project... just stop it! 🛑 But why is that bad? As you're probably aware "design systems" are a current…
React
JavaScript
SVG
View post
Intersection Observer
16-Apr-2020
15-Apr-2020
Recently at work i was asked to create a scroll-jacking sticky nav and after trying out numerous open source projects react-visibility…
React
JavaScript
View post
100DaysOfGatsby - The Roundup
9-Apr-2020
For the past 100 days i've posted every day about the work i've been doing in & around the Gatsby eco-system. If you have a spare 20…
Gatsby
View post
Skin UI
1-Apr-2020
This has been a labour of love but www.skin-ui.com is now alive and kicking. If you're using Theme UI for your Gatsby projects Skin UI can…
Gatsby
Theme UI
Fauna
View post
gatsby-theme-terminal
6-May-2020
28-Feb-2020
This is my second attempt at creating a Gatsby theme and my approach to this build was very different to the first time round. If you want…
Gatsby
Gatsby Themes
View post
gatsby-plugin-prop-shop
15-Feb-2020
gatsby-plugin-prop-shop is my newest Gatsby Plugins and it's slightly different to my previous plugins. The reason for this is because of…
Gatsby
Gatsby Plugins
React
JavaScript
View post
gatsby-mdx-embed
30-Apr-2020
6-Jan-2020
Let's back track for just a second... What is MDX ? To quote the creators; MDX is an authorable format that lets you seamlessly use JSX in…
Gatsby
Gatsby Plugins
MDX
View post
100DaysOfGatsby
9-Apr-2020
1-Jan-2020
Day 100 Apr 9 2020 Stick a fork in me, i'm done! ✅ I can't quite believe it but for 100 days i've written code and updated this blog post…
Gatsby
View post
gatsby-remark-grid-system
27-Dec-2019
At the time of writing this post gatsby-remark-grid-system is still very much experimental, it is functional and has had mild testing. So…
Gatsby
Gatsby Plugins
View post
gatsby-mdx-routes
24-Dec-2019
This little plugin was as a result of seeing this tweet where Federico Zivolo was asking how to create a menu for .mdx files used in a…
Gatsby
Gatsby Plugins
MDX
View post
gatsby-remark-sticky-table
14-Dec-2019
At the time of writing this post gatsby-remark-sticky-table is still very much experimental, it is functional and has had mild testing. So…
Gatsby
Gatsby Plugins
View post
gatsby-theme-gatstats
12-Nov-2019
Boom! after months of work my theme is actually live! If you like data viz and want a blog that's a little bit different to the usual kinda…
Gatsby
Gatsby Themes
View post
