Today I committed a to-do list website in Github, the most difficult project I’ve made so far. It was a complicated project, there were so many challenges I had to deal with, but I am happy to have my first version of the web. There are still a couple of things I want to fix and change, but as I said, this is my first version and I want to write about it. I have used Bootstrap 4, JQuery and a little bit of ECMAScript 6 (start learning now)
My to-do list has many awesome features that allow users to organize their task easily.
Change design of the website when you don’t have any note created.
This is the view of the website when there isn’t a note. The focus of the website is on the button of “New Task”.
Modal is opened after click on “New Task”.
In this modal, the user can write down a title and a description for the note. There are 5 different colors available for the background. In case any color has been chosen, the background will be transparent. The modal form will be reset after the user click on “Add”
Content editable and sortable
The user can edit the content of the note just clicking in the text area. Changes will save automatically. The notes can also be move and organize, using the arrow button in the bottom-left corner.
Popup is open to edit the background-color after click on «Edit»
A popup with 5 different colors is available to let the user change the color of the note. After click in one color, the popup will close.
«Done» button will change note style.
When the user press the «Done» button the note will move to the end of the website, the background color will change to grey and the text-area will be underlined.
Hope you like this features! I will be working on fixing the problems! You can find the repository in my Github profile.
Thanks for your support!
