Exercise: Lists

Your goal is to implement the todos app. Please check your test file to see the full list of requirements. You are required to:

  1. Show “0 TODOs” text when no todos are created
  2. Add a new TODO when the “Add To-Do” button is pressed
  3. Mark TODO as complete, crossing the text with a line
  4. Remove todo and show the correct text if number of todos reaches zero.

Your solution should behave as in the image below.

Slides

Let's practice!

This time, you must create your to-do app's front end. Like the last exercise, you would need to show all todos and be able to mark them complete or delete them. Newly, you need to show the message that there are zero todos when the component has no todos in the state. Also, make sure that all four tests successfully pass!