Skip to content

Instantly share code, notes, and snippets.

@jamesarosen
jamesarosen / cloudflare-cache.js
Created Feb 20, 2020
Caching with Cloudflare
View cloudflare-cache.js
function isCacheable(response) {
const vary = response.headers.get('Vary')
return (
response.status >= 200 &&
response.status < 400 &&
response.status !== 206 &&
response.headers.get('Cache-Control') != null &&
vary !== '_' &&
vary !== '*'
@jamesarosen
jamesarosen / react-state-machines.jsx
Created Dec 12, 2019
Using state machines in hook-based React components
View react-state-machines.jsx
const STATUSES = {
initial: {},
fetching: { showLoadingIndicator: true },
fetched: { showResults: true },
error: { showError: true },
}
function Foo() {
const [status, setStatus] = useState(STATUSES.initial)
const [results, setResults] = useState(null)
@jamesarosen
jamesarosen / helper-functions-in-redux.md
Last active Feb 13, 2021
Helper Functions in the Redux Store
View helper-functions-in-redux.md

I have a function that generates image URLs. This function combines some relatively static global configuration with some dynamic data that changes on every invocation. I say "relatively static" because the configuration is loaded asynchronously during the application boot, but remains fixed after that.

Option One

export default async function imageUrl(imageId, { size = 'normal' }) {
  if (imageId == null) return null
  
  const constantsResponse = await fetch('/api/constants')
  const imagesRoot = constantsResponse.json().imagesRoot
@jamesarosen
jamesarosen / 1.1.1.1.md
Created Oct 11, 2019
Does 1.1.1.1 resolve .org domains properly?
View 1.1.1.1.md

A friend asked me whether Cloudflare's 1.1.1.1 service was having trouble resolving .org domains. Here are some findings.

From SF:

dig zendesk.com
;; ANSWER SECTION:
zendesk.com.		3432	IN	A	54.172.126.223
zendesk.com.		3432	IN	A	34.206.241.1
zendesk.com.		3432	IN	A	34.225.199.37
@jamesarosen
jamesarosen / notes.md
Last active Aug 27, 2018
Quality Engineering
View notes.md
@jamesarosen
jamesarosen / 0-README.md
Created Aug 25, 2018
addon-mirage-supprot
View 0-README.md

The following code will let an ember addon provide an addon-test-support/ folder whose contents get merged into app/mirage/. It excludes addon-test-support/ from the build if mirage is disabled.

See Better Addon Support on the Ember CLI Mirage feature-request board.

@jamesarosen
jamesarosen / emberjs2018.md
Last active May 31, 2018
Ember 2018 Roadmap
View emberjs2018.md

Background

I have been working with Ember since the SproutCore days. I have watched a passionate, dedicated team spend the last 7 years continually improving the framweork and its ecosystem. Along the way, many things have changed (almost always for the better), but some things have remained constant.

Many of the things I say below have been said by others before. I particularly recommend reading Matt McManus's Improve the interoperability of the community and the framework and Chris Garrett's Ember as a Component-Service Framework.

View controllers.application.js
import Ember from 'ember';
console.clear()
export default Ember.Controller.extend({
appName: 'Ember Twiddle',
clearLog() {
this.get('log').clear()
},
foo: undefined,
View components.fui-truncate.js
import Ember from 'ember'
import hbs from 'htmlbars-inline-precompile'
export default Ember.Component.extend({
suffixLength: 4,
text: null,
prefix: Ember.computed('suffixLength', 'text', function() {
const suffixLength = this.get('suffixLength')
const text = this.get('text') || ''
View components.click-me.js
import Ember from 'ember'
import hbs from 'htmlbars-inline-precompile'
export default Ember.Component.extend({
// The key is the argument to `sendAction`, below.
// The value is the name of the action that bubbles up. In this case,
// it matches something in controller:application.
clickMe: 'clickMeWasClicked',
layout: hbs`