Full playable demo

Try Mission Checklist

Add, reject and delete tasks in the finished mini app.

Playable result only — the source code stays hidden.

Mission 00 4 min

Mission 0: Try the Checklist

Try the finished Mission Checklist. Add a few tasks, try adding a blank one, then delete tasks individually. This project combines form input with dynamic DOM elements.

Build roadmap

What you’ll build, mission by mission

  1. 1
    Build the interface

    Create the input, controls and list.

  2. 2
    Add typed tasks

    Turn input text into new list items.

  3. 3
    Clear the input

    Reset the field after each task.

  4. 4
    Validate input

    Stop blank tasks.

  5. 5
    Delete tasks

    Add working Delete buttons to dynamic items.

Mission demoBuild the Checklist Interface

Finished result only — the answer code stays hidden.