// React 18 

import {createRoot} from 'react-dom/client';

​

const container = document.getElementById('root');

const root = createRoot(container);

​

root.render(<App />);

// Before

import { render } from 'react-dom';

const container = document.getElementById('app');

render(<App tab="home" />, container);

​

// After

import { createRoot } from 'react-dom/client';

const container = document.getElementById('app');

const root = createRoot(container); // createRoot(container!) if you use TypeScript

root.render(<App tab="home" />);

// render in react class component

A render method is a property whose name is render, and whose value is a function. The term “render method” can refer to the entire property, or to just the function part.

​

class ComponentFactory extends React.Component {

  render() {}

}

​

A render method must contain a return statement. Usually, this return statement returns a JSX expression:

​

class ComponentFactory extends React.Component {

  render() {

    return <h1>Hello world</h1>;

  }

}