text: import React from 'react';
  import Axios from 'axios';
  
  class App extends React.Component {
    constructor(props) {
      super(props);
  
      this.state = {
        pokemon: "",
        searchValue: "",
        loaded: false
      };
    }
  
    fetch() {
      Axios('https://pokeapi.co/api/v2/pokemon/' + this.state.searchValue)
      .then((response) => {
        this.setState({pokemon: response.data});
        this.setState({loaded: true});
      });
    }
  
    render() {
      return (
        <div>
          <h2>Search</h2>
          <input type="text" onChange={(event) => {this.setState({searchValue: event.target.value})}} />
          <button onClick={() => {
            this.setState({loaded: false});
            this.fetch()
          }}>Search</button>
          {
            this.state.loaded ?
            (
              <div>
                <img src={this.state.pokemon.sprites.front_default} />
                <p>{this.state.pokemon.name}</p>
                <p>{this.state.pokemon.id}</p>
              </div>
            ) :
            (
              <p></p>
            )
          }
        </div>
      );
    }
  }
  
  export default App;
  