- Replace
<your_account>
with your Github username in the DEMO LINK - Follow the React task guideline
- Use React TypeScript cheat sheet
Implement ability to add TODOs to the TodoList
implemented in Static list of todos
- Create
App
component storingtodos
array and displaying it usingTodoList
- Create a form to add new TODOs
- DON'T create a separate component for a form
- please add labels and placeholders where they are needed
- each TODO should have a
title
anduserId
selected from a list of givenusers
(./src/api/users.js
) - show user names in
<select>
- the
TODO
should be added to the list after clickingAdd
button - the
id
of each new todo should be the next integer after the current maximalid
in the array
- Clear the form after adding a TODO
- Add validation to the form
- add an empty option
Choose a user
to the users select - before creating a todo check if a
user
was selected, if not show an error message next to theselect
(Please choose a user
) - if the
title
is empty show an error message next to thetitle
field (Please enter the title
) - errors should appear only after pressing
Add
button - hide a message immediately after any change of the field with an error
- add an empty option
- (* Optional) Limit characters displayed in the
title
field. Allow entering letters (ru
anden
), digits andspaces
.