gaearon

// connect() is a function that injects Redux-related props into your component.
// You can inject data and callbacks that change that data by dispatching actions.
function connect(mapStateToProps, mapDispatchToProps) {
  // It lets us inject component as the last step so people can use it as a decorator.
  // Generally you don't need to worry about it.
  return function (WrappedComponent) {
    // It returns a component
    return class extends React.Component {
      render() {
        return (

GavinJoyce

with `react-native`:

npm set progress=false && rm -rf ~/.npm && rm -rf node_modules && npm cache clean && time npm install
npm install  83.72s user 26.03s system 100% cpu 1:49.32 total

npm set progress=true && rm -rf ~/.npm && rm -rf node_modules && npm cache clean && time npm install
npm install  199.30s user 27.32s system 91% cpu 4:08.29 total

--

soundyogi

void function() { "use strict"
/* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! WIP DO NOT USE WIP !!!!!!!!!!!!!!!!!!!!!

DO NOT USE THIS YET.
USE THE 2016 VERSION BELOW PLEASE.
                                                                         
                                                                         
WWWWWWWW                           WWWWWWWWIIIIIIIIIIPPPPPPPPPPPPPPPPP   
W::::::W                           W::::::WI::::::::IP::::::::::::::::P  
W::::::W                           W::::::WI::::::::IP::::::PPPPPP:::::P 

alexhayes

Force All Email Delivery To A Single Email Address

So, you're a developer testing lots of codes and you want to ensure that you don't accidentally send out email to people during testing.

However, you also want to actually view emails in a real email client, not a console.

This is how you can do it using Ubuntu and Exim ensuring that the email gets sent out through Google apps.

helderco

#!/bin/bash
set -e

show_help() {
cat << EOF
Usage: ${0##*/} [-u USER] [-p PASS] [-P PORT] [-H HOST] [DATABASE]
       ${0##*/} -h

Open a standard connection in Sequel PRO.

ptim

This handy 'alias' is actually a bash function allowing you to run bs from the directory you want to serve, giving you a dev server, with live reload, directory indexes, and the goodness of sync'd scrolling across multiple devices!

It prints out the command that's run and a link to the docs so that I don't completely forget what I'm actually doing!

bs() {
    echo
    echo "browser-sync start --server --directory --files \"**\""
    echo "http://www.browsersync.io/docs/command-line/"
    echo

browser-sync start --server --directory --files "**"

gaearon

function mapValues(obj, fn) {
  return Object.keys(obj).reduce((result, key) => {
    result[key] = fn(obj[key], key);
    return result;
  }, {});
}

function pick(obj, fn) {
  return Object.keys(obj).reduce((result, key) => {
    if (fn(obj[key])) {

paulirish

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

jondlm

React introduced shallow rendering in 0.13. This is an excellent feature that I wish was included earlier in React. It aims to solve the problem of unit testing components without going through a real, or jsdom mocked, DOM. I couldn't find any info online about what lifecycle events it actually fires. So I did some testing of my own. To reproduce, put component.js and test.js into a folder and run node test.js.

TLDR; shallow rendering only invokes the following lifecycle hooks (in order):

1. getDefaultProps
2. getInitialState
3. componentWillMount stops here until re-render
4. componentWillReceiveProps
5. shouldComponentUpdate
6. componentWillUpdate

chantastic

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