
Inheritance versus composition
Facebook and the React community encourage the use of composition over classical inheritance. It can be said that any other pattern to reuse code is considered anti-pattern in React. A lot more can be said about that, but React has been heavily used in production at Facebook without using inheritance for sure. In such a large-scale application, the advantage of building independent pieces and combining them to form a complex functionally is what made React so popular. Components can be moved around, organized by common functionality; they can be well tested and refactored without much of a risk of breaking other parts of the system.
Extending from the React.Component:
class Greeting extends
React.Component {
constructor(props){ // ES6 class constructor
super(props) // ES6
}
render() {
return <h1>Hello, {this.props.name}</h1>; //local
}
}
Instead of creating a new Greeting instance, we are adding it as a <Greeting/> tag:
ReactDOM.render(
<Greeting name="Johny"/>,document.getElementById('root'))
Some components can be strictly presentational; others may not know who can be their children components in advance. Many namings later came from the community, Smart and Dumb components, Containers and Components, functional and classical.
How React is used it's all up to the developers, the team, and the organization. It's a very powerful and unopinionated library and can be used along with other frameworks.