React Class Components

React Class Components

Before React 16.8 (which formally introduced Hooks), Class Components were the only way to track state and handle lifecycle methods in a React component. While Function Components are significantly more common today, understanding Class Components is still vital for reading legacy code.

Creating a Class Component

A class component requires you to extend from the base React.Component class and create a render() method which returns the HTML element.

import React from 'react';

class Welcome extends React.Component {
  render() {
    return <h1>Hello, Class Component!</h1>;
  }
}

Class components are still fully supported and valid in React, but the modern community has heavily shifted towards functional components paired with Hooks.