Skip to content

Instantly share code, notes, and snippets.

View wildlyinaccurate's full-sized avatar
🐕‍🦺

Joseph Wynn wildlyinaccurate

🐕‍🦺
View GitHub Profile
@wildlyinaccurate
wildlyinaccurate / morph-module-checklist.md
Last active April 18, 2017 14:33
Morph module PR checklist
@wildlyinaccurate
wildlyinaccurate / ubuntu-setup.sh
Last active February 16, 2024 09:05
Setting up a new Ubuntu machine
#!/usr/bin/env bash
# Generate an ED25519 key and display the public key
ssh-keygen -o -a 100 -t ed25519
cat ~/.ssh/id_ed25519.pub
read -p 'You should add your public key to GitHub now. Press any key to continue...'
read -p 'Now you will generate a GPG key. Please use RSA/RSA with a keysize of 4096 bits. Press any key to continue...'
gpg --default-new-key-algo rsa4096 --gen-key
@wildlyinaccurate
wildlyinaccurate / morph-duplicate-style-checker.js
Last active May 31, 2017 07:51
Check any Morph-powered page for duplicate styles.
var page = require('webpage').create()
var system = require('system')
if (system.args.length === 1) {
console.log('Usage: morph-style-checker.js <URL>')
phantom.exit(1)
}
var url = system.args[1]
@wildlyinaccurate
wildlyinaccurate / client.js
Last active June 4, 2017 20:04
Simplified approach for hydrating statically-rendered React components on the client.
import React from 'react'
import ReactDOM from 'react-dom'
const hydrateComponent = (scriptEl) => {
const componentId = scriptEl.getAttribute('data-hydration-data-id')
const componentElement = document.querySelector(`[data-hydration-component-id="${componentId}"]`)
const props = JSON.parse(scriptEl.innerHTML)
import(componentId).then(Component => ReactDOM.render(<Component {...props} />, componentElement))
}
@wildlyinaccurate
wildlyinaccurate / safe-component.jsx
Created June 21, 2017 17:28
Proof-of-concept for making React components "safe" or "optional" by catching errors during rendering.
// Paste this into https://preactjs.com/repl to see it working
// This function takes any component, and returns a higher-order (wrapper)
// component. This wrapper attempts to render the wrapped component, catching
// any errors.
const safeComponent = (Component) => function WrappedComponent () {
// Handle both class components and stateless functional components
const wrappedRender = Component.prototype.render || Component
try {