Skip to content
  • Learning paths
  • Challenges
  • Solutions
  • Articles
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted almost 4 years ago

First challenge with React^

Raymart Pamplona•16,040
@pikapikamart
A solution to the Todo app challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Hello!! This is my 21st challenge and my first challenge using React!!

I have been studying React right now, mostly google-ing things out since I don't have any course about it hahaha but managed to learn even in small increments.

This challenge was fun to create, I want to add other animation but useEffect really did make my head hurt a lot, so yeah, didn't add other but managed to add like in the design. But as I go coding this challenge, useEffect keeps making more sense and so yeyy.

Also, why does it keeps prompting that it needs the props that I used inside it, as well as the other functions that I used. It would be counterintuitive to include them in the dependency array since I am not firing the effect from those, but it keeps telling me put them inside. Then if I put the props inside, it says now it needs to be destructured, then when I desctructured it in the component, it now needs to be inside a useCallback. I have a lot to test.

I also implemented my own drag and drop, didn't want to use other modules because it is my first time creating a drag and drop, it is beneficial to first create it as much as you can before jumping to other solution. I got it right :>>

There would be a lot of improvements to be done and if you can point other things, I would really appreciate it. Thank you for checking it out!!

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Raymart Pamplona's solution.

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
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License