2. Dealing with React Events

Activity 2.01: Create a Blog Post Using React Event Handlers

Solution:

1. Create your project, called fieldlength, via the Create React App CLI, and then start up the application with Yarn:

   $ npx create-react-app fieldlength
   $ cd fieldlength

2. Delete all the unnecessary files for our project.
3. Delete App.css, delete the contents of App.js except for the import of react and the export default statements, and delete logo.svg.
4. In src/App.js, build the App React component as a class component, but leave it blank:

   import React, { Component } from 'react';
   class App extends Component {
   render() {
     return (
     <div className="App">
     </div>
     );
   }
   }
   export default App;

5. Give the component an initial state with a single element in the state; this will store the input from the textarea.
6. Still in App.js, add the following code:

     constructor(props) {
    ...