Skip to content
Submitted 8 months ago

DoMore (TODO) App | React.js

Sahil Kumar•190
@Vi-r-us
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Todo app
  • HTML
  • CSS
  • JS
3intermediate

Design comparison

SolutionDesign

Solution retrospective

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

Hi everyone! I wanted to share my React implementation of the todo app challenge. I've incorporated drag and drop functionality using onPointerDown, onPointerMove, and onPointerUp events. I would like to use onDrag pointer events instead of that.

What specific areas of your project would you like help with?

However, I would appreciate any feedback or advice on a few points.

  • I feel like using Pointer Events for the drag and drop functionality made my code a bit complicated and messy. I did my best to keep it clean by adding lots of comments, but any advice on keeping my code cleaner would be much appreciated.
  • Additionally, I would like to implement a locked axis drag like the one from the DnD Kit Library. If someone could help me with that, it would be great.
  • Lastly, there is a question mark sign on the webpage that I haven't been able to figure out where it's coming from. If anyone has any ideas, I would be grateful for your input.

Thank you all in advance! 😊

Community feedback

  • Ahmed Huzain•380
    @ElHuzainPosted 8 months ago

    Regarding the question mark problem. Check in the AppProvider component. Right after rendering out children in a {children}, there's a question mark right next to it.

    Marked as helpful
    0
    Sahil Kumar•190
    @Vi-r-usPosted 8 months ago

    @ElHuzain Thank you for pointing it out. I totally missed that. 👍

    1
  • Ahmed Huzain•380
    @ElHuzainPosted 8 months ago

    Well done 👏🏻👏🏻

    0

Please log in to post a comment

Log in with GitHub

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