React Components

Stateless Functional Component

function Heading(props) {
  return <h1>{props.title}</h1>;
}

Stateless Functional Component (with arrow function)

const Heading = (props) => {
  return <h1>{props.title}</h1>;
}

ES6 Class Component, can have states

class Heading extends React.Component {
  render() {
    return <h1>{this.props.title}</h1>;
  }
}

Always start component names with capital

<Heading />

Leave a Reply

Your email address will not be published. Required fields are marked *