react for dummies

react_readme.md

react for dummies

• docs
• JSX produces React "elements" via React.createElement()
• wrap JSX in parens to get multiple lines
• element != component
• ok to have multiple root nodes
• React elements are immutable
• components are like functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen.

Functional and Class Components

const foo(props) => <h1>hi {props.name}</h1>
// ..is equivalent to
class foo extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}
// user-defined component. Always start component names with a capital letter.
const element = <Welcome name="Sara" />;

• Components must return a single root element
• UI as a function of state
• a fn that returns react elements can be called like
• All React components must act like pure functions with respect to their props
• State is similar to props, but it is private and fully controlled by the component.
• local state requires a components to be defined as a class