React Features

Core Features of React:

1. JSX (JavaScript XML): A syntax extension that allows you to write HTML-like code in your JavaScript files. It enhances readability and makes it easier to visualize the structure of the UI.
2. Components: The building blocks of a React application. Components can be either class-based or functional, and they encapsulate their own structure, style and behavior.
3. State Management: React components can manage their own state, enabling dynamic and interactive user experiences. The state can be updated using the setState method.
4. Props (Properties): Props are used to pass data from parent components to child components, making components reusable and dynamic.
5. Lifecycle Methods: Class components have lifecycle methods that allow you to run code at specific points in a component’s lifecycle, such as mounting, updating and unmounting.

Example of Using State and Props:

class Counter extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  increment = () => {
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return (
      <div>
        <h1>{this.props.title}: {this.state.count}</h1>
        <button onClick={this.increment}>Increment</button>
      </div>
    );
  }
}