React Component Lifecycle
- getInitialState
- getDefaultProps
- componentWillMount
- componentDidMount
- shouldComponentUpdate (Update only)
- componentWillUpdate (Update only)
- componentWillReceiveProps (Update only)
- render
#!/bin/bash -x | |
# This script will convert all your git submodules into git subtrees. | |
# This script ensures that your new subtrees point to the same commits as the | |
# old submodules did, unlike most other scripts that do this. | |
# THIS SCRIPT MUST BE PLACED OUTSIDE OF YOUR REPOSITORY!!!!!!!!!! | |
# Otherwise, the script will interfere with the git commits (unless you add it to .gitignore). | |
# Save the script in your home directory as `~/subtrees.sh` | |
# `cd` into your repository | |
# Run `~/subtrees.sh` | |
# Enjoy! |
// getComponent is a function that returns a promise for a component | |
// It will not be called until the first mount | |
function asyncComponent(getComponent) { | |
return class AsyncComponent extends React.Component { | |
static Component = null; | |
state = { Component: AsyncComponent.Component }; | |
componentWillMount() { | |
if (!this.state.Component) { | |
getComponent().then(Component => { |
React Component Lifecycle
This is a quick-and-dirty guide to setting up a Raspberry Pi as a "router on a stick" to PrivateInternetAccess VPN.
Install Raspbian Jessie (2016-05-27-raspbian-jessie.img
) to your Pi's sdcard.
Use the Raspberry Pi Configuration tool or sudo raspi-config
to:
This table was created in 2015 so may be quite outdated today.
Feature | Meteor Solution | Alternative Solutions | Description |
---|---|---|---|
Live DB Sync | [livequery][lq] ([mongo-oplog]), [ddp] | RethinkDB, Redis, ShareDB, [npm:mongo-oplog], [firebase], etc. | Push DB updates to client/server. |
Latency Compensation, Optimistic UI | [minimongo][mm] | [RethinkDB][lcr], [mWater/minimongo] (fork, not ws but http, browserify) | Imitate successful db query on client before it is done. |
Isomorphic Code | [isobuild] & isopacks | browserify | Write one code for server/client/mobile. |
Isomorphic Packaging | [isobuild], atmosphere | No more separate packages for server & client. Get bower + npm + mobile. |
var touchstartX = 0; | |
var touchstartY = 0; | |
var touchendX = 0; | |
var touchendY = 0; | |
var gesuredZone = document.getElementById('gesuredZone'); | |
gesuredZone.addEventListener('touchstart', function(event) { | |
touchstartX = event.screenX; | |
touchstartY = event.screenY; |
Hi Nicholas,
I saw you tweet about JSX yesterday. It seemed like the discussion devolved pretty quickly but I wanted to share our experience over the last year. I understand your concerns. I've made similar remarks about JSX. When we started using it Planning Center, I led the charge to write React without it. I don't imagine I'd have much to say that you haven't considered but, if it's helpful, here's a pattern that changed my opinion:
The idea that "React is the V in MVC" is disingenuous. It's a good pitch but, for many of us, it feels like in invitation to repeat our history of coupled views. In practice, React is the V and the C. Dan Abramov describes the division as Smart and Dumb Components. At our office, we call them stateless and container components (view-controllers if we're Flux). The idea is pretty simple: components can't
/** | |
* @author Juliano Castilho <[email protected]> | |
*/ | |
var React = require('react'); | |
var AffixWrapper = React.createClass({ | |
/** | |
* @type {Object} | |
*/ | |
propTypes: { |
var Bar1 = base => class extends base { | |
componentWillMount(){ | |
super.componentWillMount(); | |
console.log('Bar1'); | |
} | |
}; | |
var Bar2 = base => class extends base { | |
componentWillMount(){ | |
super.componentWillMount(); |
class SudokuSolver { | |
constructor(board) { | |
this.board = board; | |
} | |
solve() { | |
const index = this.board.indexOf('0'); | |
if (index === -1) return this.board; | |
for (let possibility = 1; possibility < 10; possibility++) { |