rafaellucio

#!/bin/sh
#######################################################
#  UNIX TREE                                          #
#  Version: 2.3                                       #
#  File: ~/apps/tree/tree.sh                          #
#                                                     #
#  Displays Structure of Directory Hierarchy          #
#  -------------------------------------------------  #
#  This tiny script uses "ls", "grep", and "sed"      #
#  in a single command to show the nesting of         #

rafaellucio

import React, { Component } from 'react'

export default class Counter extends Component {
  increment = () => {
    this.props.dispatch({ type: 'INCREMENT' });
  }

  decrement = () => {
    this.props.dispatch({ type: 'DECREMENT' });
  }

rafaellucio

function brokenReducer(state = initialState, action) {
  switch(action.type) {
    case 'INCREMENT':
      // NO! BAD: this is changing state!
      state.count++;
      return state;

    case 'DECREMENT':
      // NO! BAD: this is changing state too!
      state.count--;

rafaellucio

import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import CounterContainer from './Counter.container'

const initialState = {
  count: 0
}

function reducer(state = initialState, action) {

rafaellucio

import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import CounterContainer from './Counter.container'

const initialState = {
  count: 0
};

function reducer(state = initialState, action) {

rafaellucio

import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import CounterContainer from './Counter.container'

const initialState = {
  count: 0
};

function reducer(state = initialState, action) {

rafaellucio

import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import CounterContainer from './Counter.container'

function reducer(state, action) {
  return {
    count: 42
  }
}

rafaellucio

import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import CounterContainer from './Counter.container'

function reducer() {
  return {
    count: 42
  }
}

rafaellucio

import React from 'react'
import { Provider } from 'react-redux'
import { createStore } from 'redux'
import CounterContainer from './Counter.container'

function reducer() {}

const store = createStore(reducer)

const App = () => (

rafaellucio

import { Provider } from 'react-redux';

...

const App = () => (
  <Provider>
    <CounterContainer />
  </Provider>
);