Finish and Verify
12 min read
Review the Component Flow
Review the Component Flow
Before calling the project finished, trace one task from the top of the component tree to the card.
The structure should be easy to explain:
App
├── Column
│ └── TaskCard
└── TaskModal
App owns the shared task list and the handlers that change it. Column receives the full list and derives the tasks for its status. TaskCard receives one task and reports actions such as delete or drag start. TaskModal manages the form fields and reports a completed form submission back to App.
This separation is what lets the same tasks state drive counts, columns, cards, and persistence.
Checkpoint
Pick one action—such as deleting a task—and explain its path aloud: card click → callback → App handler → setTasks → React re-render → updated column and count.