3douhao

The Rules of React

All libraries have subtle rules that you have to follow for them to work well. Often these are implied and undocumented rules that you have to learn as you go. This is an attempt to document the rules of React renders. Ideally a type system could enforce it.

What Functions Are "Pure"?

A number of methods in React are assumed to be "pure".

On classes that's the constructor, getDerivedStateFromProps, shouldComponentUpdate and render.

3douhao

How to remove node_modules

1. Create a .gitignore file in the git repository if it does not contain one

touch .gitignore

2. Open up the .gitignore and add the following line to the file

**/node_modules

3douhao

class Square extends React.Component {
  render() {
    return (
      <button className="square">
        {this.props.value}
      </button>
    );
  }
}

3douhao

return React.createElement('div', {className: 'shopping-list'},
  React.createElement('h1', /* ... h1 children ... */),
  React.createElement('ul', /* ... ul children ... */)
);

3douhao

class ShoppingList extends React.Component {
  render() {
    return (
      <div className="shopping-list">
        <h1>Shopping List for {this.props.name}</h1>
        <ul>
          <li>Instagram</li>
          <li>WhatsApp</li>
          <li>Oculus</li>
        </ul>

3douhao

• a task list item
• list syntax required
• normal formatting, @mentions, #1234 refs
• incomplete
• completed

3douhao

• a task list item
• list syntax required
• normal formatting, @mentions, #1234 refs
• incomplete
• completed