Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Desktop design screenshot for the Todo app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I am proud of using tailwind css for creating the layout and responsiveness of this app and also i am proud of using react especially useState hook which made this project very easy for me

What challenges did you encounter, and how did you overcome them?

During developing this project i have faced many challenges and thank god that those challenges made to learn new things like conditional rendering and how props work and some more things

Community feedback

@Mahmoud-ElAgamy

Posted

Great job, but i have noticed some issues:

  • Everytime i click on checkbox it is count at items left and never stops.
  • when i click on completed tasks, it should be activated. It would be great if you:
  • Add drag and drop functionality.
  • Make the data persist on Local Storage.
  • Wrap the input and the button inside form element to have the default behavior for the button when i press enter. Good luck
0

@Ahmadi1798

Posted

@Mahmoud-ElAgamy Assalmu Alaykom Brother, Thanks bro I kindly appreciate your helpful feedback bro 🙏🏻

  1. for the checkbox i should say that whenever it gets clicked the input will be transferred to an array which is the completed tasks and the items left comes from the substitution of all array length and completed array length.
  2. okay bro i will do that but it wasn’t in design
  3. bro actually i wanted to store the data into the database but i couldn’t and i don’t know how to use local Storage.
  4. i think the required property of input didn’t work out this might be the reason. Thanks in advance
1

@Mahmoud-ElAgamy

Posted

Peace and God's mercy and blessings be upon you, let's say you have uploaded the 1st version of your app to get reviews to work on it to improve the app. I think it's important to search about how to use local storage especially in React.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord