- Fork and clone this repo
cd
into it and runnpm install
- Run
npm start
and open http://localhost:8080/ in your browser
Open index.js and follow the prompts in the comments - use them in conjunction with the code here.
-
Add an input field in app > index.js
Username: -
Add an onSubmit={handleSubmission} to the
-
Create the handleSubmission function with a console.log: function handleSubmission(event) { event.preventDefault(); console.log("my target:", event.target); }
-
Add name="username" to the
- Adding the username lets us access that specific field on the form, using event.target.username.value
- Add in conditonal rendering to show an error The form should look like this:
<form onSubmit={handleSubmit}>
<label>
Username:
<input type="text" name="username" onChange={changeHandler}></input>
</label>
{error && <p>Can't have more than 9 letters!! Try again</p>}
<input type="submit"></input>
</form>