BIS601 - FSD - React Application to Increment and Decrement a counter using Buttons

 Below is a simple React application written using React Class Components. It includes:

• A class component named App
  
  

• A counter value in state
  
  

• Two buttons to increment and decrement the counter

import React, { Component } from 'react';

class App extends Component {

  constructor(props) {

    super(props);

    this.state = {

      count: 0

    };

  }

  handleIncrement = () => {

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

  }

  handleDecrement = () => {

    this.setState({ count: this.state.count - 1 });

  }

  render() {

    return (

      <div style={{ textAlign: 'center', marginTop: '2rem' }}>

        <h1>Class-based Counter</h1>

        <h2>{this.state.count}</h2>

        <button onClick={this.handleIncrement}>Count Up</button>

        <button onClick={this.handleDecrement} style={{ marginLeft: '1rem' }}>

          Count Down

        </button>

      </div>

    );

  }

}

export default App;

Creating the application and running it as usual.