DEV Community

VIDHYA VARSHINI
VIDHYA VARSHINI

Posted on

Components in React

What is component?

• A component is a reusable, independent piece of UI.
• It is the building block of a react application.
• This can be used anywhere in the app.
• There are two main types of components in React :
• Functional Components
• Class components

Functional components:
• It is written as Javascript functions.
• This accepts props(input data) and return JSX.

Ex:

 function Greeting(props) {
  return(
  <h1>Hello, {props.name}!</h1>
  );
}
Enter fullscreen mode Exit fullscreen mode

Class components:
• This is written as ES6 class.
• It must extend React.component.
• It can manage state using this.state and lifecycle methods like componentDidMount.

Ex:

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

<Greeting name="Vidhya" />

Enter fullscreen mode Exit fullscreen mode

Top comments (0)