Skip to content

Instantly share code, notes, and snippets.

Avatar

Paul Scanlon PaulieScanlon

View GitHub Profile
@PaulieScanlon
PaulieScanlon / index.html
Last active February 17, 2023 11:43
Cars with animateMotion
View index.html
<!DOCTYPE html>
<html>
<head>
<title>animateMotion</title>
</head>
<body>
<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
<path fill="none" stroke="gray" d="M20,50 C20,-50 180,150 180,50 C180-50 20,150 20,50 z" />
@PaulieScanlon
PaulieScanlon / react-hydration-error-425-Text-content-does-not-match-server-rendered-html.md
Created October 20, 2022 12:09
React hydration error 425 "Text content does not match server-rendered HTML"
View react-hydration-error-425-Text-content-does-not-match-server-rendered-html.md

If you're upgrading to React 18 and have run into the following error.

Text content does not match server-rendered HTML

This post should help explain what causes the error, and a couple of solutions.

I recently ran into this issue myself when building this demo for the following blog post:

@PaulieScanlon
PaulieScanlon / 5.0.0-next.2
Created October 18, 2022 12:02
5.0.0-next.2 Raw Log
View 5.0.0-next.2
12:58:34 PM:
From https://github.com/PaulieScanlon/paulie-dev-2019
* branch main -> FETCH_HEAD
12:58:34 PM:
Your branch is up to date with 'origin/main'.
12:58:34 PM:
HEAD is now at ebcdf21 chore: upgrade to Gatsby 5 (#81)
@PaulieScanlon
PaulieScanlon / 4.24.4
Created October 18, 2022 12:00
4.24.4 Raw Log
View 4.24.4
10:47:26 AM:
Cloning into '/usr/src/app/www'...
10:47:27 AM:
Using default node version: 14
10:47:31 AM:
yarn install v1.22.19
10:47:31 AM:
@PaulieScanlon
PaulieScanlon / create-vote.diff
Created October 10, 2022 08:17
Calculate the votes
View create-vote.diff
...
export default async function handler(req, res) {
...
try {
...
@PaulieScanlon
PaulieScanlon / create-vote.diff
Last active October 10, 2022 08:16
Read and Update the Google Sheet
View create-vote.diff
...
export default async function handler(req, res) {
...
try {
...
@PaulieScanlon
PaulieScanlon / create-vote.js
Created October 10, 2022 08:15
Create the Serverless Function
View create-vote.js
const { GoogleSpreadsheet } = require('google-spreadsheet');
const doc = new GoogleSpreadsheet(process.env.GOOGLE_SHEET_ID);
export default async function handler(req, res) {
const {
query: { id }
} = req;
try {
@PaulieScanlon
PaulieScanlon / shell
Created October 10, 2022 08:14
Install google-spreadsheet dependency
View shell
npm install google-spreadsheet
@PaulieScanlon
PaulieScanlon / index.diff
Created October 10, 2022 08:13
Adding the Interface
View index.diff
import React, { Fragment, useState } from 'react';
...
const Page = () => {
...
- return
+ return (
@PaulieScanlon
PaulieScanlon / index.diff
Created October 10, 2022 08:13
Adding the "click" handler
View index.diff
import React, { useState } from 'react';
...
const Page = () => {
...
+ const handleClick = async (id) => {
+ setIsSubmitting(true);