Skip to content

Instantly share code, notes, and snippets.

@kellyrmilligan
kellyrmilligan / fetchUtils.js
Last active May 10, 2017 13:53
reduce boilerplate in handling fetch responses and errors in redux actions
function isJson (response) {
const contentType = response.headers.get('content-type')
return contentType && contentType.indexOf('application/json') !== -1
}
export function handleResponse (response) {
if (response.ok) {
if (isJson(response)) {
return response.json()
} else {
@kellyrmilligan
kellyrmilligan / s3Sync.sh
Created June 8, 2017 13:38
Sync files to s3 and set cache control headers
#!/bin/bash
if [[ "$1" != "" ]]; then
S3BUCKETNAME="$1"
else
echo ERROR: Failed to supply S3 bucket name
exit 1
fi
aws s3 sync build s3://$S3BUCKETNAME --delete --cache-control max-age=31536000,public
@kellyrmilligan
kellyrmilligan / circle-deployment-example.yml
Created June 8, 2017 13:42
circle config file example for calling shell script from deployment section
deployment:
prod:
branch: master
commands:
- NODE_ENV=production yarn run build
- ./bin/s3Sync.sh [s3 bucket name]
staging:
branch: staging
commands:
@kellyrmilligan
kellyrmilligan / registerServiceWorker.js
Last active April 10, 2018 11:29
modified service worker registration from create react app
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
@kellyrmilligan
kellyrmilligan / service-worker-redux.js
Created June 8, 2017 14:32
redux example for service worker notification
import { createSelector } from 'reselect'
// CONSTANTS
export const UPDATE_SERVICEWORKER = 'UPDATE_SERVICEWORKER'
export function updateServiceworker () {
return {
type: UPDATE_SERVICEWORKER
}
}
@kellyrmilligan
kellyrmilligan / index-example.js
Created June 8, 2017 14:39
integration example for redux and cra
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { updateServiceworker } from 'service-worker-redux'
import configureStore from 'store/configure-store'
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
const store = configureStore()
@kellyrmilligan
kellyrmilligan / App-example.js
Created June 8, 2017 14:49
sending a notification when service worker is updated in top level component
componentWillReceiveProps (nextProps) {
// see if new content was found by the service worker
if (nextProps.serviceWorker.serviceWorkerUpdated) {
this.setState({
notifications: this.state.notifications.concat({
'The app has been updated! Hooray! Refresh your browser to enjoy the latest and greatest',
'some unique key',
action: 'Dismiss',
dismissAfter: 4000,
onClick: this.removeNotification
@kellyrmilligan
kellyrmilligan / flow type example
Last active July 6, 2017 14:44
flow type example
// @flow
import React from 'react'
import classnames from 'classnames'
import type { ButtonT } from './ButtonT'
const Button = ({ className, type = 'button', text, tabIndex, onClick = () => {}, disabled = false }: ButtonT) => (
<button
className={classnames('button', className)}
type={type}
@kellyrmilligan
kellyrmilligan / multiple calls from a loop
Created August 22, 2017 17:00
multiple calls from a result - no caching
[{
id: 1234,
title: 'test',
view: 'two-column'
},
{
id: 1234,
title: 'test',
view: 'image-only'
}]
@kellyrmilligan
kellyrmilligan / multiple calls from a loop with caching
Last active August 22, 2017 18:35
multiple calls with client side caching
import CacheClientPromise from 'cache-client-promise'
const myCache = new CacheClientPromise();
[{
id: 1234,
title: 'test',
view: 'two-column'
},
{