From Markup to Application State

The starter already gives you a board that looks complete, but the browser does not yet have a reliable data model behind it.

This module connects those two sides.

You will create a tasks array, render its contents into the three columns, and update the column counters from the same data. Each lesson makes one small part of that flow work before the next part is added.

The flow we are building

tasks array
    ↓
renderTasks()
    ↓
DOM cards + column counts

By the end of this module

You should be able to change a task in the JavaScript data and see the board reflect that change after rendering.