Skip to content

sanderdechering/Frontend-Mentor_todo-app-react

Repository files navigation

Design preview for the Todo app coding challenge

Frontend Mentor - Todo app solution

This is a solution to the Todo app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

The challenge

Users should be able to:

  • View the optimal layout for the app depending on their device's screen size
  • See hover states for all interactive elements on the page
  • Add new todos to the list
  • Mark todos as complete
  • Delete todos from the list
  • Filter by all/active/complete todos
  • Clear all completed todos
  • Toggle light and dark mode
  • Bonus: Drag and drop to reorder items on the list

Screenshot

![](images/Screenshot 2023-03-13 at 11.45.39.png) ![](images/Screenshot 2023-03-13 at 11.53.42.png)

Links

Built with

What I learned

This was my first time developing with React. Because I have used Vue for my whole college career, I wanted to try out something different. Therefore, I created this todo app. My experience with React is a lot messier than I expected, maybe because writing a .vue page has a lot of less clutter and is more seperated than jsx, but it could also be me being an uber noob at React. I am looking forward to creating more with React and trying out different types of project.

Author

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published