My Style of Matching Style and Function

Oct 07, 2016

This week we learned Angular, with a To Do webpage as our individual project. While learning more about Angular, I am also learning more about myself as a web developer. I found that before I could dive into the To Do program, I first needed to search for existing to do applications. I wanted to see what others considered important to include as well as the general layout and feel of the application. This search was in addition to the requirements of the project. While I understood the requirements, I needed a visible representation of my goal.

With the visual aspects in mind, I began by laying out my format via Bootstrap. Inside the container for the list, I created a title / header for the list, pre-set at first an later user definable. Next came the form box to enter a task and the submit button. After an entry form, rows to show the tasks within the to do list.

I am working on breaking my coding down in to smaller testable parts. At each of the above steps, I reviewed the webpage to ensure it was working as expected.

One of the first challenges of this was removing the intended task. When I first tried passing the task.index into the function, it was deleting the first entry instead of the one selected. Reading online, I found I needed to take the index of the task within the function to obtain the correct index.

Editing was a greater challenge, as it was creating a new entry each time. The problem was utilizing the same submit button as originally used for adding a new entry. This required help from Drew to solve.

When I hit roadblocks in functionality, HTML and CSS styling are always a welcome distraction. Moving forward, I hope to continue integrating design with a user focus and the functionality needed to create useful webpages.