Input state manipulation

gistfile1.txt

import React, { Component } from 'react';
import './App.css';

const ShowingYourName = (props) => {
    return (
        <p>{props.firstName}</p>
    )
}

class App extends Component {
  state = {
      firstName: ''
  };

  saveToState = (e) => {
      this.setState({
        [e.target.name]: e.target.value
      });
  }

  render() {
    return (
        <div className="center-this">
            <input type="text" name="firstName" placeholder="What is your first name..." value={this.state.firstName} onChange={this.saveToState} />
            <ShowingYourName firstName={this.state.firstName} />
        </div>
    );
  }
}

export default App;