Thanks for checking out this front-end coding challenge.
You can check the result through this link: Todo task list
Frontend Mentor challenges help you improve your coding skills by building realistic projects.
To do this challenge, you need a advanced understanding of HTML, CSS and Javascript.
Users should be able to:
- View the optimal layout for the app depending on their device's screen size
- 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
- Live Site: Todo task list
- Frontend Mentor challenge: Todo App challenge
- React - JS library
- Chakra UI - For structure and styles
- React Icons - Library with a great diversity of icons
- React-toastify - Allows you to add Toast Notifications to your app with ease
- React-beautiful-dnd - Used to create the drag and drop feature
- RBDnD Tutorial - Tutorial on how to use react-beautiful-dnd
- Frontend Mentor - @NavarKartalian
- Linkedin - Navar Kartalian