My todo-app

[marinalendt]

Link to Netlify: https://todo-app-ml.netlify.app/

Todo

This app should be able to:

• Add a task
• See all the tasks
• Mark the tasks that are ready/not ready
• Remove a task
• See how many tasks there are in total
• Every file has its own responsibility for readability. Even Empty State has its own file.

The app should be simle and easy to use. A header, an inputfield with an add-button. Then the todos comes up underneath. Maybe also showing date and time and when the todo was posted. I saw a nice color-combination on Pinterest and use that in my app.

I am using Zustand since its a requiery for this course.

Full Accessibility will be applied.

For styling I use Styled-components.

[Npahlfer]

I really like how you organized the files, every file has its own responsibility and that makes the code very readable. It is nice to see that you keep reused colors in a separate file, like colors.js, which is a good habit.

It is great to see that you made use of Styled Components props, like the $completed and $hasColor in TodoItem, to make dynamic styling easier. You also included responsive media queries to make sure the app looks good on different devices. The accessibility looks good as well, with labels for the inputs and buttons.

You have done a good job with the styling, but try to be consistent in using the theme file for colors and media breakpoints. In TodoInput.jsx, you use the theme for background color, but not for the border of the input field.

It would be nice to see some of the stretch goals in there, like adding a timestamp to see when a task was created, or using local storage to save the data, but overall real solid work :)