Build a Todo List
Build a todo list. The markup ships with a hardcoded task — replace it with real state.
Requirements
- Typing a task and pressing Add (or Enter) appends it to the list and clears the input.
- Submitting an empty or whitespace-only input does nothing.
- Each task has a delete button that removes exactly that task.
- New tasks get a stable identity — deleting the second of three identical tasks must not confuse React about which row went away.
Hints
Hint 1
Model tasks as objects with an id (crypto.randomUUID() or a counter in a ref), not bare strings — the id is your key and your delete handle.
Hint 2
Make the input controlled and handle onSubmit on the form, calling preventDefault() — that gives you Enter for free.
Hint 3
Delete with setTasks(tasks.filter((t) => t.id !== id)) — never splice state in place.