Paul Scanlon's Site

Home
Hire Me
About
Articles
Posts
Ghosts
Dashboard
Tags
RSS Feed
1Demos
Open-source
Streams

Twitter/X
GitHub
LinkedIn

React x116

Tagged with React

Here you'll find 116 pieces of content I've written about React. They've either been published here on my site, or by external publications.

NEW
The New Stack
• Thursday, June 27, 2024 CSS-in-JS and React Server Components: A Developer Guide
With React’s evolving ecosystem, particularly with Next.js shifting toward a “server-first” approach, applications using...
- React
- Next.js
- styled-components
NEW
The New Stack
• Monday, June 17, 2024 How To Use Google Sheets as a Database With React via Next.js
In this tutorial I’ll be explaining how to use Google Sheets as a database to store the results of a user poll. I’ve use...
- Next.js
- React
- JavaScript
NEW
Netlify Developers
• Monday, May 13, 2024 Getting Started with React, Vite and Clerk Auth on Netlify
Very many applications and interactive tools on the web require some sort of user authentication and authorization. Hist...
- JavaScript
- React
- Clerk
NEW
The New Stack
• Wednesday, April 24, 2024 Global state management in React with Jotai
Jotai is a global state management solution for React, explains Paul Scanlon in this tutorial about Waku developer Daish...
- React
- JavaScript
- Waku
NEW
The New Stack
• Thursday, April 18, 2024 Did Signals Just Land in React?
"Signals" are used to manage client-side state, and recent developments suggest they could be useful in React. Paul Scan...
- React
- JavaScript
NEW
The New Stack
• Tuesday, April 9, 2024 React Server Components in a Nutshell
Paul Scanlon uses Waku to show how RSCs give React developers access to asynchronous server-side requests and data at th...
- React
- JavaScript
- Waku
NEW
The New Stack
• Saturday, February 17, 2024 JavaScript on Demand: How Qwik Differs From React Hydration
Paul Scanlon explains resumability, Qwik’s approach to solving the beastly client-side JavaScript problem, and how it di...
- JavaScript
- React
- Qwik
NEW
The New Stack
• Wednesday, January 24, 2024 Take a Qwik Break from React with Astro
Paul Scanlon compares React to Qwik using several examples (code included). He concludes that Qwik is worth exploring as...
- Astro
- JavaScript
- React
- Qwik
NEW
The New Stack
• Friday, December 15, 2023 Recreating Shopify’s BFCM Globe Using react-globe.gl
Developer Paul Scanlon shows how to recreate Shopify's 3D Thanksgiving globe, using a React component for globe data vis...
- JavaScript
- React
- three.js
NEW
Monday, December 11, 2023 Punk Squirrel: GitHub Statistical Analysis
Project Overview This project, initially, was something I thought i could turn into a product, with subscriptions, or pa...
- Remix
- React
- PostgreSQL
- GSAP
- Svg
- Tailwind
- Supabase
- ffmpeg/WASM
NEW
The New Stack
• Thursday, November 23, 2023 How Qwik’s Astro Integration Beats Both React and Vanilla JS
Paul Scanlon tests Qwik with Astro, and finds it's the best of both worlds — lighter than React and less verbose than Va...
- Astro
- JavaScript
- React
- Qwik
NEW
The New Stack
• Tuesday, November 21, 2023 I’m in an Open Relationship with Remix
Paul Scanlon takes the Silicon Valley ethos perhaps a little too far. He's in an open relationship with Remix, but swear...
- React
- Remix
- Vite
- Op-ed
NEW
The New Stack
• Monday, November 6, 2023 How to Build a Server-Side React App Using Vite and Express
A demo of server-side rendering and server-side data fetching without using a framework — showing what React-powered fra...
- React
- Vite
- Express
NEW
The New Stack
• Wednesday, November 1, 2023 SPAs and React: You Don’t Always Need Server-Side Rendering
The React docs suggest picking one of the popular React-powered frameworks that support server-side rendering (SSR) — bu...
- React
- Vite
NEW
The New Stack
• Tuesday, October 24, 2023 How to Use Astro with a Sprinkling of React
Here's how to use Astro to incrementally adopt a “reduced JavaScript” approach to building websites. No more refactoring...
- Astro
- React
- Netlify
NEW
Tuesday, September 19, 2023 How to use Postgres at the Edge
Project Overview This is my first project since joining Neon, it's actually a little something I was playing around with...
- Next.js
- React
- React Query
- Tailwind
- Neon
- Edge Functions
- three.js
- react-three-fiber
- PostgreSQL
NEW
Monday, June 19, 2023 CockroachDB Toolbox: A suite of tools to help you design your CockroachDB clusters
Project Overview This was a collaborative project with my "partner in crime", Technical Evangelist for Cockroach Labs, a...
- Next.js
- React
- Tailwind
- CockroachDB
NEW
Cockroach Labs
• Wednesday, May 17, 2023 The Art of Data Residency and Application Architecture
In this post Rob and Paul explain how they built Silo, a fully functioning multi-region Next.js application combining Co...
- Next.js
- React
- React Query
- Tailwind
- CockroachDB
- AWS Lambda
- PostgreSQL
NEW
Tuesday, May 16, 2023 The Art of Data Residency and Application Architecture
Project Overview This is to be my second project since joining Cockroach Labs but the first project that fully aligned w...
- Next.js
- React
- React Query
- Tailwind
- CockroachDB
- AWS
- PostgreSQL
NEW
Cockroach Labs
• Thursday, April 6, 2023 What is the CockroachDB Cloud API and why should you use It?
In this post you’ll learn about the CockroachDB Cloud API and how I’ve used it to create an application Dashboard with N...
- Next.js
- React
- React Query
- Tailwind
- NextAuth
- CockroachDB
NEW
Thursday, April 6, 2023 What Is the CockroachDB Cloud API?
Project Overview My first task after joining Cockroach Labs was to design and build something that demonstrates the capa...
- Next.js
- React
- React Query
- Tailwind
- NextAuth
- CockroachDB
- CockroachDB Cloud API
NEW
The New Stack
• Sunday, March 19, 2023 The Distance from Data to You in Edge Computing
How does data transfer work between the browser, the server, and the database? You may be surprised at the distances tha...
- Next.js
- Serverless Functions
- SSR
- React
- JavaScript
- AWS Lambda
- Serverless
- PostgreSQL
NEW
Sunday, March 19, 2023 Edge
Project Overview In this demo I set out to show how data transfer works between the browser, the server, and the databas...
- Next.js
- React
- three.js
- react-three-fiber
- React Query
- Tailwind
- NextAuth
- pg-promise
- CockroachDB
- PostgreSQL
NEW
Smashing Magazine
• Tuesday, March 7, 2023 How To Create Dynamic Donut Charts With TailwindCSS And React
In this article, Paul Scanlon shares a super lightweight approach to creating a Donut chart using conic-gradient(). Ther...
- HTML
- JavaScript
- React
- Tailwind
- CSS
- SVG
NEW
Friday, February 24, 2023 Getting Started With CockroachDB, pg-promise and Next.js
In this guide you should find everything you need to get started with CockroachDB, pg-promise and Next.js (API Routes). ...
- Next.js
- React
- pg-promise
- CockroachDB
- PostgreSQL
NEW
Thursday, February 9, 2023 My Cockroach Labs Interview App
Hello there! In November 2022 I started a new role at Cockroach Labs, and worked as a Technical Evangelist, and here's a...
- Next.js
- React
- three.js
- react-three-fiber
- React Query
- Tailwind
- NextAuth
- pg-promise
- CockroachDB
- PostgreSQL
NEW
Thursday, December 22, 2022 How to Create Custom Marketo Forms With React
Hello. It's been a little while, and I have a new job! I'm now at Cockroach Labs and in the coming months I'll be respon...
- Next.js
- React
- Marketo
NEW
Gatsby
• Monday, November 14, 2022 How to Use Function Props with Gatsby's Slice API
As good as the Slice API is, it does come with one or two restrictions. To be clear, these are by design rather than an ...
- Gatsby
- React
NEW
Gatsby
• Tuesday, November 8, 2022 Gatsby 5 Upgrade. Say No to YOLO
In this post Paul explains how he upgraded paulie.dev to Gatsby 5 and is now experiencing ~47% faster build times! ...
- Gatsby
- React
NEW
Tuesday, November 1, 2022 How to use React's Context API with Gatsby
Hey there, in this post I'll be explaining how to use React's Context API with Gatsby to provide a "global state" variab...
- Gatsby
- React
NEW
Thursday, October 20, 2022 React hydration error 425 "Text content does not match server-rendered HTML"
If you're upgrading to React 18 and have run into the following error, this post should help explain what causes the err...
- Gatsby
- React
NEW
The New Stack
• Monday, October 17, 2022 How to Use Google Sheets as a Database with React and Serverless Functions
In this tutorial I'll be explaining how to use Google Sheets as a database, to store the results of a user poll. I've us...
- Gatsby
- Next.js
- Serverless Functions
- React
- JavaScript
- Tailwind
NEW
The New Stack
• Saturday, October 8, 2022 How to Build SVG Line Charts with React, SSR and Tailwind CSS
A tutorial on how to roll your own SVG Line Charts in React using Server-side rendering, with either Next.js or Gatsby. ...
- Gatsby
- Next.js
- Serverless Functions
- SSR
- React
- JavaScript
- SVG
- Tailwind
NEW
Tuesday, September 27, 2022 How to use Serverless Functions with SSR
In this post I'll explain how to abstract and reuse the same function logic across all sides of the Gatsby stack; Server...
- Gatsby
- Serverless Functions
- React
- JavaScript
- Tailwind
- Google Analytics
NEW
Smashing Magazine
• Tuesday, September 20, 2022 What's New In Gatsby 2022?
Gatsby has evolved quite dramatically in the last two years. In this article, Paul Scanlon explains what Gatsby can do t...
- Gatsby
- Serverless Functions
- SSR
- React
- JavaScript
- MDX
- Tailwind
NEW
Thursday, September 8, 2022 How to use TanStack Query (react-query) with Gatsby
In this post I'll be discussing how to use TanStack Query, or more specifically @tanstack/react-query to replace the oft...
- Gatsby
- Serverless Functions
- React
- JavaScript
- React Query
NEW
Wednesday, August 10, 2022 How to use Utterances with React
Ahoy! In this post I'll be explaining how I used the fantastic Utteranc.es 🔮 with React. On the below links you'll find...
- React
- JavaScript
NEW
Monday, August 8, 2022 Syntax highlighting with Gatsby, MDX, Tailwind and Prism React Renderer
In this post I'll explain how I use the excellent {" "} Prism React Renderer by {" "} Formiddable to add syntax highligh...
- Gatsby
- React
- JavaScript
- MDX
- Tailwind
- Prism
NEW
Friday, July 29, 2022 How to use Gatsby's Head API with MDX
Hi there! I'm excited, are you? Of course you are! In Gatsby 4.19.0 the team shipped the Gatsby Head API 🎉 But what doe...
- Gatsby
- React
- JavaScript
- MDX
NEW
Tuesday, July 26, 2022 How to use Gatsby's Script API with Google Analytics
In this post I'll be explaining how to add Google's "new" Google Analytics Property (GA4) to your Gatsby Site using the ...
- Gatsby
- React
- JavaScript
- Partytown
- Google Analytics
NEW
Thursday, July 14, 2022 How to Use Gatsby's Script Component, Powered by Partytown 🎉
Cut your page load times in half by optimizing your third-party scripts! How to use Gatsby’s Script Component, powered b...
- Gatsby
- React
- Partytown
NEW
Contentful
• Tuesday, July 5, 2022 Building Rise of the Robots with Gatsby and Contentful
Hi there! I recently built Rise of the Robots using Gatsby + Rive to demonstrate how Jamstack creativity and performance...
- Gatsby
- React
- Contentful
- Rive
- Tailwind
NEW
Tuesday, June 14, 2022 Achieving Performant Creativity with Gatsby and Rive
How to deliver highly creative, animated, accessible web experiences without sacrificing web performance Creating an imm...
- Gatsby
- React
- Contentful
- Rive
NEW
Wednesday, June 1, 2022 Rise of the Robots
Project Overview From April 2022 to June 2022 I designed and built Rise of the Robots. The motivation for this project, ...
- Gatsby
- React
- JavaScript
- Rive
- Tailwind
NEW
Gatsby
• Monday, May 23, 2022 Building Rise of the Robots
I’d like to Introduce Rise of the Robots. 🤖 A Gatsby + Rive + Contentful powered creative, performant, and accessible d...
- Gatsby
- React
- Contentful
- Rive
- Motion Graphics
- Tailwind
NEW
Gatsby
• Wednesday, April 6, 2022 How to Migrate from Netlify Functions to Gatsby Serverless Functions on Gatsby Cloud
In this post I'll explain how to migrate from Netlify Functions hosted on Netlify to Gatsby Serverless Functions hosted ...
- Gatsby
- React
- Serverless Functions
- Gatsby Cloud
NEW
Gatsby
• Thursday, March 31, 2022 How to Add Custom Fonts to Gatsby
Using methods outlined in this post I'll be demonstrating how to add custom fonts to a Gatsby site in a more performant ...
- Gatsby
- React
NEW
Gatsby
• Wednesday, March 23, 2022 How to Add Google Analytics gtag to Gatsby Using Partytown 🎉
On Wednesday Mar 2nd 2022 I watched Ersin Akinci's talk at GatsbyConf: Improve Your Lighthouse Score with Partytown and ...
- Gatsby
- React
- JavaScript
- Partytown
- Google Analytics
NEW
Wednesday, March 2, 2022 GatsbyConf 2022
Project Overview From December 2021 to Feb 2022 I built GatsbyConf 2022. This site was the main conference site and was ...
- Gatsby
- React
- JavaScript
- three.js
- react-three-fiber
- Motion One
- SVG
NEW
Gatsby
• Sunday, January 23, 2022 Performance Optimization for three.js Web Animations
In this post I'm going to be discussing how to work with JavaScript animation libraries without negatively impacting you...
- Gatsby
- React
- three.js
- react-three-fiber
NEW
Gatsby
• Thursday, January 6, 2022 Building GatsbyConf 2022
Hello! Paul here and I've been given a new assignment! I've been tasked with building the new GatsbyConf 2022 site - yik...
- Gatsby
- React
- three.js
- react-three-fiber
- Contentful
- Tailwind
NEW
Sunday, January 2, 2022 Using a useLocalStorage hook and rehydration
Recently I ran into an issue using the useLocalStorage hook from useHooks.com -- which is brills by the way! The Problem...
- JavaScript
- React
NEW
Gatsby
• Friday, December 17, 2021 Fetch Data from the Unsplash API and render using DSG
Learn how to use Gatsby's latest page rendering method DSG (Deferred Static Generation) to defer the creation of pages a...
- Gatsby
- React
- DSG
- JavaScript
- Tailwind
NEW
Gatsby
• Thursday, December 9, 2021 Fetch data from the New York Times API and render using SSG
As I'm sure you know, Gatsby is absolutely brills for statically generating web pages using any type of data from any ki...
- Gatsby
- React
- SSG
- JavaScript
- Tailwind
NEW
Gatsby
• Sunday, December 5, 2021 Fetch data from the US National Weather Service API and render using SSR
As you may have heard, the latest release of Gatsby, Gatsby 4 now supports SSR (Server Side Rendering) 🥳 This new addit...
- Gatsby
- React
- SSR
- JavaScript
- Tailwind
NEW
Gatsby
• Saturday, December 4, 2021 Become a Data Champion with Gatsby
Data is hard right? I think so too, and with Gatsby there's more than one way to boil that egg so in this series of blog...
- Gatsby
- React
- JavaScript
- Tailwind
NEW
Gatsby
• Thursday, December 2, 2021 Gatsby Plugin Not Working, But Why?
I know where you're coming from and understand the frustration, so here's my top tips that might make using Gatsby plugi...
- Gatsby
- React
- Gatsby Plugins
NEW
Gatsby
• Monday, November 22, 2021 Content Querying with Gatsby + Contentful
In this post Paul explains how you can make use of Gatsby's useStaticQuery hook to query different kinds of Contentful d...
- Gatsby
- React
NEW
Gatsby
• Thursday, November 18, 2021 Deploy4Swag - Use the best Gatsby ever to get free goodies!
Hello, good morrow and good day! Paul here and I'm back with another super, smashing, great, Gatsby swag giveaway! ...
- Gatsby
- React
NEW
Gatsby
• Monday, November 15, 2021 A Quick Start Guide To Gatsby and Contentful
If you're looking to build a website using Gatsby and Contentful you've come to the right place. In this guide you'll ma...
- Gatsby
- React
- Contentful
NEW
Gatsby
• Tuesday, November 2, 2021 How To Use The Contentful Rich Text Field with Gatsby
Contentful's Rich Text Editor provides content creators with powerful text editing capabilities via the use of Contentfu...
- Gatsby
- React
- Contentful
NEW
Gatsby
• Thursday, October 28, 2021 Gatsby FuncJam `21 - The Winners
From August through September Gatsby ran the internet's func'y-est ever community competition: FuncJam '21 -- And here a...
- Gatsby
- Serverless Functions
- React
NEW
Smashing Magazine
• Tuesday, October 19, 2021 Building An API With Gatsby Serverless Functions
In this tutorial, Paul Scanlon explains how to build an API by using Gatsby Serverless Functions and what you need to ke...
- Gatsby
- Serverless Functions
- React
NEW
Wednesday, August 18, 2021 Gatsby FuncJam 21
Groovy Analytics, It's gonna be something to do with Google Analytics 🕺 Visit Groovy Analytics Go Go Go Aug 18 2021 Her...
- Gatsby
- React
- TypeScript
- JavaScript
- Theme UI
- Serverless Functions
- Google Analytics
NEW
Wednesday, July 28, 2021 How to "fix" Gatsby slow local build times
Ahoy, as the title suggests in this post I'm going to explain one way to resolve the "slow local build time" issues I kn...
- React
- Gatsby
- JavaScript
NEW
Smashing Magazine
• Monday, July 26, 2021 Gatsby Serverless Functions And The International Space Station
Gatsby recently announced the launch of “functions”. In this article, Paul Scanlon explains how to get the current locat...
- Gatsby
- Serverless Functions
- React
- three.js
- react-three-fiber
NEW
Gatsby
• Wednesday, July 7, 2021 How We Made the Gatsby 500 Bottles Giveaway
I was keen to explore how Gatsby + Shopify might be adopted in a more incremental way. To test the water in a way that m...
- Gatsby
- Serverless Functions
- React
- three.js
- react-three-fiber
NEW
Wednesday, July 7, 2021 500 Bottles
Project Overview In the summer of 2021 I created 500 Bottles. I designed the logo and the bottle, and worked with Market...
- Gatsby
- React
- JavaScript
- three.js
- react-three-fiber
- Shopify
NEW
Friday, July 2, 2021 Modify Gatsby's GraphQL data types using createSchemaCustomization
Hi friends, yesterday I published a little post about how to Add data to Gatsby's GraphQL layer using sourceNodes, this ...
- React
- Gatsby
- JavaScript
- GraphQL
NEW
Thursday, July 1, 2021 Add data to Gatsby's Data layer using sourceNodes
In this post i'm going to demonstrate how to source data from a NASA API and inject the response into Gatsby's GraphQL l...
- React
- Gatsby
- JavaScript
NEW
Friday, June 11, 2021 Paulie API
Project Overview In November 2020 I had an idea, I wanted to build an API so I could consume my Twitter Profile Data in ...
- Gatsby
- React
- JavaScript
- Serverless Functions
- Tailwind
NEW
Friday, June 11, 2021 Using Gatsby Serverless Functions as an abstracted API
They're here! Gatsby Serverless Functions are here! They're finally here! 💝 -- And I couldn't be more excited! A little...
- React
- Gatsby
- Serverless Functions
- JavaScript
- Gatsby Plugins
NEW
Gatsby
• Thursday, April 15, 2021 Gatsby Cloud - Better, Faster... Greener?
Gatsby sites are optimized to be smaller, sleeker and faster. When built and deployed in Gatsby Cloud they also use fewe...
- Gatsby
- React
NEW
Gatsby
• Tuesday, April 13, 2021 MDX Embedded Images with the All-New Gatsby Image Plugin
A gatsby-plugin-mdx and gatsby-plugin-image demo, taking a deep dive into MDX frontmatter and how it can be used to stor...
- Gatsby
- React
NEW
Gatsby
• Friday, April 9, 2021 Getting Started with Gatsby Source WordPress - Choose Your Own Adventure
A step by step guide to setting up your first Gatsby + WordPress website using gatsby-source-wordpress -- choose your ow...
- Gatsby
- React
NEW
Friday, April 9, 2021 Gatsby Plugin Image: withArtDirection
Hello! If you're reading this you probably already know about Gatsby Plugin Image, but if not here's a recap: Announcing...
- React
- Gatsby
- JavaScript
- Gatsby Plugins
NEW
Gatsby
• Thursday, April 1, 2021 Shaping the Future of Headless WordPress
Like many devs, Paul Scanlon avoided WordPress projects whenever possible — until he tried Gatsby’s new WordPress source...
- Gatsby
- React
NEW
Monday, March 29, 2021 MDX "fold it in"
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 ...
- React
- Gatsby
- MDX
NEW
Saturday, March 27, 2021 Create Accessible Data Visualization for your Gatsby Blog with Charts.css
Ahoy M'Hartys! ‍⚓ in this post i'm going to demonstrate how you can create Accessible Data visualization using Charts.cs...
- React
- Gatsby
- JavaScript
- MDX
- Charts CSS
NEW
Tuesday, March 16, 2021 Gatsby File System Route API: Multiple Source MDX
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 multi...
- React
- Gatsby
- JavaScript
- MDX
NEW
Monday, March 8, 2021 Understanding Theme UI
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...
- JavaScript
- React
- Theme UI
NEW
Tuesday, February 9, 2021 Understanding Theme UI: 6 - The Hacks
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 nec...
- JavaScript
- React
- Theme UI
NEW
Wednesday, February 3, 2021 Understanding Theme UI: 5 - Media Queries
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 writ...
- JavaScript
- React
- Theme UI
NEW
Gatsby
• Thursday, January 28, 2021 Bottoms Up: Gatsby File System Route API + Bums = BumHub
BumHub: A silly idea, butt a firm working process. Hello, I’m Paul and for my Silly Site Challenge I created BumHub: “Th...
- Gatsby
- React
- GitHub REST
NEW
Thursday, January 21, 2021 Understanding Theme UI: 4 - Scales
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 ...
- JavaScript
- React
- Theme UI
NEW
Tuesday, January 19, 2021 Understanding Theme UI: 3 - Components
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 havin...
- JavaScript
- React
- Theme UI
NEW
Monday, January 18, 2021 Understanding Theme UI: 2 - Styled component
In my last post I attempted to explain Theme UI's Jsx Pragma, if you missed that, here's the link again Understanding T...
- JavaScript
- React
- Theme UI
NEW
Tuesday, January 12, 2021 Understanding Theme UI: 1 - Jsx Pragma
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 hel...
- JavaScript
- React
- Theme UI
NEW
Monday, January 11, 2021 Create an SVG Doughnut Chart from scratch for your Gatsby blog
Charting libraries are great don't get me wrong but sometimes... you just need a bloody doughnut! 🍩 This post is largel...
- JavaScript
- React
- SVG
- Gatsby
- CSS
NEW
Wednesday, January 6, 2021 Use Netlify Functions and the GitHub REST API to add Data Visualization to your Gatsby blog
After a recent Twitter conversation with my good chum Scott we decided we'd run a little experiment that will attempt to...
- JavaScript
- React
- Gatsby
- SVG
- Netlify Functions
- GitHub REST
NEW
Friday, January 1, 2021 Best Bits 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 updat...
- React
- Gatsby
- Serverless Functions
- three.js
- react-three-fiber
- JavaScript
- TypeScript
- Theme UI
- GitHub REST
NEW
Storybook
• Thursday, December 10, 2020 Storybook Addon - MDX Embed
The MDX Embed addon allows you to embed 3rd party media content such as YouTube videos, Tweets, Instagram posts, Egghead...
- Storybook
- React
- MDX
NEW
Friday, November 27, 2020 Silly Site Challenge
BumHub The cheekiest way to explore GitHub 🍑 Visit BumHub Go Go Go Nov 23 2020 I'm at it again 🕺 If you followed alon...
- Gatsby
- React
- TypeScript
- JavaScript
- Theme UI
- SVG
- Netlify Functions
- GitHub REST
NEW
Tuesday, November 17, 2020 Use Netlify Functions and the Twitter API v2 as a CMS for your Gatsby blog
Apologies in advance for the rather long-winded blog title but as it suggests in this post i'm going to explain how you ...
- JavaScript
- React
- Gatsby
- Netlify Functions
- Twitter API v2
NEW
Tuesday, October 27, 2020 Storybook - An alternative approach
Hiya 👋, if you like Storybook you've come to the right place. I loooooooove Storybook!! It is in my opinion the ONLY wa...
- Storybook
- JavaScript
- React
NEW
Gatsby
• Tuesday, October 13, 2020 Hacktoberfest Spotlight A More ‘Polite’ MDX Embed Plugin
Enabling the community to easily write and release plugins for use with Gatsby is an absolute hammer of an idea. It give...
- Gatsby
- React
- MDX
NEW
Gatsby
• Tuesday, September 1, 2020 Gatsby Cloud is Your (Good) Friend
If you’re a Gatsby open source enthusiast you’re probably aware of Gatsby Cloud. But W.T.Flip actually is Gatsby Cloud, ...
- Gatsby
- Gatsby Cloud
- Gatsby Themes
- React
- Shopify
NEW
Wednesday, August 19, 2020 styled-components Responsive Array Syntax
In this post I'm going to discuss a new approach I've adopted when using [styled-components](https://Styled Components.c...
- React
- JavaScript
- styled-components
NEW
Thursday, August 13, 2020 styled-components Style Objects
styled-components optionally supports writing CSS as JavaScript objects instead of strings. This is particularly useful ...
- React
- JavaScript
- styled-components
NEW
Wednesday, August 5, 2020 Best Bits 2020 ...
Oh hey there! 👋 Here's a byte-size round up of projects I've Open-sourced, posts and articles I've written and contract...
- React
- Gatsby
- Gatsby Cloud
- JavaScript
- TypeScript
- Shopify
- styled-components
- Storybook
- Jest
- Enzyme
- Testing Library
NEW
Monday, August 3, 2020 React hooks and matter.js
Recently I was creating a Shopify demo application and became a little underwhelmed with the Checkout experience and so ...
- React
- JavaScript
- matter.js
NEW
Netlify
• Thursday, July 16, 2020 Add Playful Animated SVG Reactions to a Gatsby Blog
In this blog post I'm going to discuss how to add user reactions to your Gatsby blog posts using a fun, open-source Reac...
- Gatsby
- React
- GSAP
- SVG
NEW
Monday, July 6, 2020 Everything's a box
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...
- React
- Theme UI
NEW
Tuesday, June 16, 2020 React SVG Bubble Slider
You've probably seen reactions before on social media, Twitter, Instagram etc all have ways for users to show their like...
- React
- GSAP
- SVG
NEW
Gatsby
• Thursday, May 21, 2020 Gatsby Recipes, What's All the Fuss About?
Gatsby Recipes were introduced just last month, as a new tool to automate common site building tasks. A Gatsby Recipe is...
- Gatsby
- Gatsby Recipes
- React
NEW
CSS Tricks
• Thursday, May 21, 2020 Roll Your Own Comments With Gatsby and Fauna
If you haven’t used Gatsby before have a read about why it’s fast in every way that matters, and if you haven’t used Fau...
- Gatsby
- React
- Fauna
NEW
Thursday, May 21, 2020 Roll Your Own Comments
After seeing the following Tweet by Fauna inviting users to take part in the Write With Fauna challenge i decided i'd su...
- React
- JavaScript
- Gatsby
- Fauna
- Apollo
- GraphQL
- Netlify
NEW
Thursday, May 7, 2020 MDX Embed Intersection Observer
If you're not familiar with my plugin gatsby-mdx-embed have a read of this post ... or to summarize.. Gatsby MDX Embed ...
- React
- JavaScript
- Gatsby
- Gatsby Plugins
- MDX
NEW
Thursday, April 30, 2020 MDX Embed
Project Overview In April 2020 I released the first interation of MDX Embed. MDX Embed allows you to easily embed popul...
- React
- JavaScript
- MDX
NEW
Friday, April 24, 2020 TypeScript Theme UI Link
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 w...
- React
- Gatsby
- TypeScript
- Theme UI
NEW
Gatsby
• Monday, April 20, 2020 Challenge Accepted, One Developer, 10 Projects, 100 Days of Gatsby
Paul Scanlon took the #100DaysOfGatsby challenge quite literally: Each day for 100 days, he worked in and around the Gat...
- Gatsby
- React
NEW
Monday, April 20, 2020 MDX Embedded Images
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...
- React
- Gatsby
- JavaScript
- MDX
NEW
Friday, April 17, 2020 Gatsby or Theme UI Link
I know this has tripped me up on more than one occasion and if you're using Theme UI components in your Gatsby project i...
- React
- Gatsby
- JavaScript
- Theme UI
NEW
Friday, April 17, 2020 SVG Icon Systems
If you're doing this in your React project... just stop it! 🛑 // some-file.js import iconA from './icons/icon-a.svg'; i...
- React
- JavaScript
- SVG
NEW
Wednesday, April 15, 2020 Intersection Observer
Recently at work i was asked to create a scroll-jacking sticky nav and after trying out numerous open source projects re...
- React
- JavaScript
NEW
Saturday, February 15, 2020 gatsby-plugin-prop-shop
gatsby-plugin-prop-shop is my newest Gatsby Plugins and it's slightly different to my previous plugins. The reason for t...
- Gatsby
- Gatsby Plugins
- React
- JavaScript

Paul Scanlon

Independent Advocate (Freelance)

Click to Copy

Accessability Statement