Nick Taylor nickytonline

Stuff I wish I'd known sooner about service workers

I recently had several days of extremely frustrating experiences with service workers. Here are a few things I've since learned which would have made my life much easier but which isn't particularly obvious from most of the blog posts and videos I've seen.

I'll add to this list over time – suggested additions welcome in the comments or via twitter.com/rich_harris.

Use Canary for development instead of Chrome stable

~~Chrome 51 has some pretty wild behaviour related to console.log in service workers. Canary doesn't, and it has a load of really good service worker related stuff in devtools.~~

Setup

Replace IRB with Pry (in your Gemfile) and Byebug with pry-byebug.

gem 'pry-rails', group: [:development, :test]
gem 'pry-byebug', group: [:development, :test]

Using PRY

Observable React elements with RxJS

Note: if you want to skip history behind this, and just looking for final result see: rx-react-container

When I just started using RxJS with React, I was subscribing to observables in componentDidMount and disposing subscriptions at componentWillUnmount.

But, soon I realised that it is not fun to do all that subscriptions(that are just updating property in component state) manually, and written mixin for this...

Later I have rewritten it as "high order component" and added possibility to pass also obsarvers that will receive events from component.

Essential JavaScript Links

I no longer mantain this list. There are lots of other very comprehensive JavaScript link lists out there. Please see those, instead (Google "awesome JavaScript" for a start).

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

JavaScript Crypto Libraries

List some crypto libraries for JavaScript out there. Might be a bit out dated. Scroll to the bottom.

WebCryptoAPI

http://www.w3.org/TR/WebCryptoAPI/

This specification describes a JavaScript API for performing basic cryptographic operations in web applications, such as hashing, signature generation and verification, and encryption and decryption. Additionally, it describes an API for applications to generate and/or manage the keying material necessary to perform these operations. Uses for this API range from user or service authentication, document or code signing, and the confidentiality and integrity of communications.

	if (
	process.env.NODE_ENV === 'production' &&
	window.__REACT_DEVTOOLS_GLOBAL_HOOK__ &&
	Object.keys(window.__REACT_DEVTOOLS_GLOBAL_HOOK__._renderers).length
	) {
	window.__REACT_DEVTOOLS_GLOBAL_HOOK__._renderers = {}
	}

	import { Component } from "React";

	export var Enhance = ComposedComponent => class extends Component {
	constructor() {
	this.state = { data: null };
	}
	componentDidMount() {
	this.setState({ data: 'Hello' });
	}
	render() {

	#!/bin/sh
	echo Install all AppStore Apps at first!
	# no solution to automate AppStore installs
	read -p "Press any key to continue... " -n1 -s
	echo '\n'

	echo Install and Set San Francisco as System Font
	ruby -e "$(curl -fsSL https://raw.github.com/wellsriley/YosemiteSanFranciscoFont/master/install)"
	echo Install Homebrew, Postgres, wget and cask
	ruby -e "$(curl -fsSL https://raw.github.com/Homebrew/homebrew/go/install)"

	git remote prune origin
	git branch -r --merged master \| egrep -iv '(master\|develop)' \| sed 's/origin\///g' \| xargs -n 1 git push --delete origin