John McDowall jmdfm

Strictly Frameworks

Mobiledoc - github.com/bustle/mobiledoc-kit - framework to build editors with a standardized JSON structure
ShareDB - github.com/share/sharedb - framework to sync any JSON document using operational transforms, add real-time collaborative editing to anything else
Bangle.dev - github.com/bangle-io/bangle.dev - toolkit built for building editors, based on prosemirror

Abstracted Editors

These use separate document structures instead of HTML, some are more modular libraries than full editors

Deploying Phoenix on Dokku

Worked 2015-09-08 for Phoenix 1.0.1 on Dokku 0.3.25.

These instructions assume you've set up Dokku. If not, go find a tutorial for that part. My notes for setting it up on Digital Ocean.

On your local machine, in the app's repo

Create a Dokku app:

Things that programmers don't know but should

(A book that I might eventually write!)

Gary Bernhardt

I imagine each of these chapters being about 2,000 words, making the whole book about the size of a small novel. For comparison, articles in large papers like the New York Times average about 1,200 words. Each topic gets whatever level of detail I can fit into that space. For simple topics, that's a lot of space: I can probably walk through a very basic, but working, implementation of the IP protocol.

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

This post is also on my blog, since Gist doesn't support @ notifications.

Components are taking center stage in Ember 2.0. Here are some things you can do today to make the transition as smooth as possible:

Use Ember CLI
In general, replace views + controllers with components
Only use controllers at the top-level for receiving data from the route, and use Ember.Controller instead of Ember.ArrayController or Ember.ObjectController
Fetch data in your route, and set it as normal properties on your top-level controller. Export an Ember.Controller, otherwise a proxy will be generated. You can use Ember.RSVP.hash to simulate setting normal props on your controller.

	def reload_config(path_to_config) do
	config = File.read!(path_to_config) \|> Poison.decode!

	Application.put_env(AppA, KeyA, config["key_a"])
	Application.put_env(AppB, KeyB, config["key_b"])

	Application.stop(AppA)
	Application.stop(AppB)
	Application.start(AppA)
	Application.start(AppB)

	import React from "react";
	import { isEqual } from "underscore";

	/**
	* HOC for diagnosing unnecessary renders and identifying faulty selectors
	*
	* Adds a logger function to a component that lists all changed props
	* Also checks if changed props are deeply equal
	*
	* Usage: Decorate the component you are investigating with renderDoctor:


	import React from 'react'

	const bgStyles = {
	strokeWidth: 3,
	strokeLinejoin: 'round',
	strokeLinecap: 'round',
	fill: 'none',
	stroke: '#c3fdff'
	}


	let rows = {}

	export default function(props = [], state = []) {
	return function(target) {
	const proto = Object.create(target.prototype)

	proto.shouldComponentUpdate = function(newProps, newState) {
	let id = (this._update_id = this._update_id \|\| Math.random())

	# author: tmwhere.com

	# --- third party dependencies
	PIXI = require('pixi.dev')
	_ = require('lodash')

	noise = require('perlin').noise
	Quadtree = require('quadtree').Quadtree
	seedrandom = require('seedrandom')
	# ---