19-basic-forms.html

<body>
  <div id="root"></div>
  <script src="https://unpkg.com/react@16.12.0/umd/react.development.js"></script>
  <script src="https://unpkg.com/react-dom@16.12.0/umd/react-dom.development.js"></script>
  <script src="https://unpkg.com/@babel/standalone@7.8.3/babel.js"></script>
  <script type="text/babel">
    function UsernameForm() {
      function handleSubmit(event) {
        event.preventDefault()
        const username = event.target.elements.usernameInput.value
        alert(`You entered: ${username}`)
      }

      return (
        <form onSubmit={handleSubmit}>
          <div>
            <label htmlFor="usernameInput">Username:</label>
            <input id="usernameInput" type="text" />
          </div>
          <button type="submit">Submit</button>
        </form>
      )
    }

    ReactDOM.render(<UsernameForm />, document.getElementById('root'))
  </script>
</body>