Shawn Allen shawnbot

Here’s what I learned at Rustbelt Refresh 2019: “Next Steps with CSS Layout” with Rachel Andrew~!

📓 Reference

Converting CALC from JQuery to React/Redux

At the end of 2016, the [CALC][] team experimented with converting the single-page app on its front page, referred to as the [Data Explorer][], from JQuery to React + Redux.

Rationale

We inherited the [1350-line explorer.js][explorer-1] from a previous team. This code was written under different project and time constraints,

Short link to this page: caseywatts.com/quicktime

Other gists & tricks: http://caseywatts.com/gists-and-tricks

Unrelated update: my book is out! Debugging Your Brain is an applied psychology / self-help book

Quicktime + Hangouts Recording

Scenario: You want to talk with someone over google hangouts (like for a user study), and you want to record BOTH:

Reflections on Docker-based development

Note that these reflections are specifically tailored to a conversation about Docker we're having at 18F, and as such they have a few assumptions:

All developers use OS X.
Production deployments will be done via cloud.gov.
Developers have access to AWS sandbox accounts.

Advantages

Why we dropped Lerna from PouchDB

We dropped Lerna from our monorepo architecture in PouchDB 6.0.0. I got a question about this from @reconbot, so I thought I'd explain our reasoning.

First off, I don't want this post to be read as "Lerna sucks, don't use Lerna." We started out using Lerna, but eventually outgrew it because we wrote our own custom thing. Lerna is still a great idea if you're getting started with monorepos (monorepi?).

Backstory:

https://pouchdb.com/2016/01/13/pouchdb-5.2.0-a-better-build-system-with-rollup.html

Show me the code! Do you prefer seeing how something works instead of instructions? If so, check out this pull request to the Amortize module. Each instruction below lives as its own commit. cfpb/amortize#11

1. Add an `.npmrc` file.

The contents of the file should be:

save-exact=true

	class Frame extends Component {
	componentDidMount() {
	this.iframeHead = this.node.contentDocument.head
	this.iframeRoot = this.node.contentDocument.body
	this.forceUpdate()
	}

	render() {
	const { children, head, ...rest } = this.props
	return (

	//creates new point
	function P(x, y, color){
	var rv
	if (x.map){
	rv = {x: x[0], y: x[1], color: 'black'}
	} else{
	rv = {x: x, y: y, color: color \|\| 'black'}
	}
	rv.toString = function(){ return rv.x + ',' + rv.y }
	rv.type = 'point'

	ndjson-join 'true' <(cat oregon.json) <(shp2json -n data/shp/arc_reference/ned_1arcsec_g.shp) \
	\| ndjson-filter -r jsts 'function(d) { var r = new jsts.io.GeoJSONReader(), g1 = r.read(d[0].geometry), g2 = r.read(d[1].geometry); return !g1.intersection(g2).isEmpty() }.call(this, d)' \
	\| ndjson-map 'd[1]'