Todo App with Vue3, Typescript, and Firebase

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

It was the first time I created a drag and drop feature. Very challenging, since I have to do twice for desktop and mobile view. I did a lot of experiments, trial, and error, tried some libraries, and I am glad I can do this.

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

Custom the checkbox was quite challenging, it was my first time. But creating the drag and drop feature was more challenging. I did trial and error to figure out what is the easiest way to do that. I used traditional method and didn't use any library in the end.

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

I have several things those I would like to be helped with.

1. Firebase doesn't accept query parameters, so I can't filter the list from the server side. I even have to loop the completed tasks myself on the client side to clear them, which sometimes creates some bugs. At least that's what I know; please let me know if you have any ways to filter the list on the server side with Firebase.

2. Drag and drop in the mobile screen is still tricky for me. I tried it on my phone and it's hard to scroll without triggering the touch event. Any solutions to prevent touch event while scrolling?