Siemko

const Commentlist = ({comments}) => (
  <ul>
    {comments.map(({ body, author }) =>
      <li>{body}-{author}</li>
    )}
  </ul>
)

Siemko

const Greeting = ({ name, ...props }) =>
  <div {...props}>Hi {name}!</div>

Siemko

const Greeting = ({name}) => <div>Hello {name}!</div>

Siemko

const Greeting = props => <div>Hello {props.name}!</div>

Siemko

<div class="better" data-gorrion="gorrion" data-other="other prop">Gorrion is always bettter</div>

Siemko

<MyBetterDiv data-gorrion="gorrion" data-other="other prop">Gorrion is always bettter</MyBetterDiv>

Siemko

const MyBetterDiv = props =>
  <div className="better" {...props} /> 

Siemko

class ButtonIncrement extends React.Component {
    state = { counter: 0 }

    handleOnClick = () => {
        this.setState((prevState) => ({
            counter: prevState.counter + 1
        }));
    }

    render() {

Siemko

const MyBetterDiv = props => (
  <div className="better" {...props} />
)

Siemko

React+Redux action + reducer + usage

Actions

actions/index.js

export function actionFunction() {
  /*do somethings with data*/
  return {
    type: 'SAMPLE_ACTION' /*action type name, best from constants folder*/
    payload: data /*your data*/
  }