class component vs function component

class Hello extends React.Component {
	render() {
		return (//we only can return one obj-> so we must wrap components with div or else
			<div>
				<h1>Hello there!</h1>
				<h1>Hello there!</h1>
				<h1>Hello there!</h1>
			</div>
		);
	}
}

 

 

Historically, function component couldn't use important features (-State, Lifecycle Method)

BUT, with Hook(introduced on 2019)!! we can write full-featured function.

 

 

function Hello() {
	return (
		<div>
			<h1>Hello there!</h1>
			<h1>Hello there!</h1>
			<h1>Hello there!</h1>
		</div>
	);
}


ReactDOM.render(<Hello />, document.getElementById('root'));