E1 UI Basics Technical Essay

29 Jan 2020

Summary/Advice

These browser history workouts each provided a unique opportunity to learn more about different skillsets and practice what we have learned in class. Going into these WODs, I thought they would be relatively short because I had seen the times we needed to complete them, but I couldn’t have been more wrong. Each of these WODs took me multiple tries, and all of them required me to watch the screen-cast at one point as I would get stuck on something and not be sure how to complete part of it. Also, when writing this assignment, I did not record my narration while completing the screen-cast. I assume that narrating what I’m doing while completing these assignments will probably make it more difficult for me to focus and longer to complete but will help reinforce my understanding of what I’m doing. Therefore, my advice for these WODs is to make sure that you complete the readings and watch the lecture, as they will help you not be completely lost on your first attempt. Furthermore, be patient, and even if you take a long time, that is okay as you are learning, and good repetitions allow you to get better.

Browser History 1

This WOD took the longest for me to complete since there were many aspects of the WODs compared to the 2nd and 3rd WOD. In total, this took me about 45 minutes to complete, including setting everything up to do my screen-cast and recording myself. In the beginning, I did not think it would take that long, but I quickly realized that I was wrong as on the first attempt, I acknowledged the fact that I did not review the readings and lectures well enough. As a result, I decided to re-watch the lessons and review the readings so that I would not take too long and be looking things up as I went. One of the most significant issues I was having was getting my server to run, as every time I tried to get to the path for the file, it would not work. I found out that I had put the static directory into my WODs directory, so instead of using localhost:8080/WODs/BrowserHistory1/index.html, I had to eliminate the WODs in that path. Also, I realized that I had not changed my view to enable word wrap, so having to scroll left and right between all the text got annoying until I changed it. Finally, I wanted to complete this WOD a couple of times to get into a proper rhythm. For this specific WOD and the other 2 WODs, what helped me was having all the external links that I wanted to put into my HTML open and already have my server running so that I would not take additional time looking those up. In the end, after three attempts, I achieved an Rx time of 10.5 minutes.

Browser History 2

This WOD was much simpler than WOD #1 and the easiest of the three for me. As it mostly had to do with CSS, I was a bit more familiar because of the lab that was completed in class earlier. The only thing I had trouble with was getting the headings in Oswald font because I had forgotten that I needed to connect a link to the Google Fonts in my HTML document. However, once I had figured that solution out and double-checked my code with the screen-cast, I quickly completed the final screen-cast in an Rx time of about 4 minutes.

Browser History 3

Finally, the third WOD was deceivingly challenging because it had the fewest steps, but then I realized that the few steps listed required a lot of work. I understood that I needed to use the div command in my HTML but did not realize that I needed to give each div an id to style them separately, including the navbar. I had to use W3Schools to make sure the styling ended up like the example that was shown. My 2nd attempt was within the SD time; however, I attempted it again to make sure that I could complete it quickly. So, I restarted my screen-cast and was able to do the WOD pretty quickly in a little under 5 minutes and get an Rx time since I did it right before, so everything was fresh in my mind.