Components

React lets you define components as classes or functions. They serve the same purpose as JavaScript functions, but work in isolation and returns HTML via a render function. When creating a React component, the component's name must start with an upper case letter.

The component has to include the extends React.Component statement, this statement creates an inheritance to React.Component, and gives your component access to React.Component's functions.

Please read the official docs (opens new window)

class WelcomeToLenio extends React.Component {
	render() {
		return <h1>Hello, {this.props.name}</h1>;
	}
}

The only method you must define in a React.Component subclass is called render(). All the other methods are optional.

Constructor

If there is a constructor() function in your component, this function will be called when the component gets initiated.

The constructor function is where you initiate the component's properties. Its also where you honor the inheritance of the parent component by including the super() statement, which executes the parent component's constructor function, and your component has access to all the functions of the parent component

Please read the official docs (opens new window)

class WelcomeToLenio extends React.Component {
	constructor() {
		super();
	}
	render() {
		return <h1>Hello, {this.props.name}</h1>;
	}
}

In React, component properties should be kept in an object called state.