To Do App - Finished

So the last few days I've been working hard to get a finished To Do web app finished. Its not like I have to finish it by a certain date, but I really wanted to finish it before I started my new position. And I am happy to say that I have succeed on the most part, but there are a few things that I still want to do. Let me explain in the following screenshots:

The screenshot above is of my home page, its really similar to my mockup that I created a few days ago. The biggest difference is that I added tabs to the task list. One tab shows tasks that are outstanding, and the other shows the tasks that have been marked as completed.

The reason I added the separate tabs is that I didn't really know what to do with the tasks that were marked as done. I didn't want to delete them from the database, and I didn't want to leave them in the same list as the outstanding tasks. I decided that having a list of completed tasks would be the best thing to do.

Adding a new task also didn't work out as I wanted it to. In my mockup, I had planned to use a modal that would keep the user in the same page, but I couldn't figure out how to do it that way. The only way I could add a new item was to go to a dedicated page for adding a task, and then take the user back to the homepage with the new task.

On the home page, each task has three buttons that allows the user to perform an action on the task that it belongs to: Edit, Details, & Delete. Delete is self explanatory, it simply deletes the task from the SQL database and by extension from the list.

Edit and details are almost the same, so I will cover them at once. Edit allows you to go into the task and update any information for it. For example: if you need to add notes or change the due date you can do that in the edit page. The you save it and it updates in the database as well as on the list. This is also the page to mark the task as "Done" when you have completed the task. I was trying to figure out how to do it from the home page, but I couldn't.

The details page is exactly like the edit page, but its a "read-only" version and you can't change any of the information, you have to go to the edit page to do so.

And finally here is my database that I set up on MySQL. Its a really simple table with only 6 columns. The book that I got on SQL really helped me out on how I should set up the table. I am not done with the book yet, I think I am only a 1/4 of the way done with the book, but I already know way more than I did a week ago about SQL.

I will try to keep working on the app if I have time to make it better and work from a single page, but for now I am done. I am super nervous at the moment since I start my new job in the morning (its almost 1 AM), and I don't really know what it will be like. But I am ready and I hope that I leave a good impression so I can stay on the team after the 90 day trail ends. That's all for now, thanks for reading!