E3 WOD Preparation

17 Nov 2022

E3 WOD Preparation

Summary

This blog post will briefly summarize what I did for the past 5 WODs; These WODs allowed us to utilize all the knowledge we acquired in our class labs and previous WODs. Every WOD has been a little bit more complex than the last one, however, going through each builds up our repertoire of skills that is critical to work on future assignments and projects. For each WOD, I will disclose the task in a nutshell; what went wrong, what went right, what I should have done, and what I should maintain. My overall experience with the WODs was incredible and stimulating; they were challenging, but completing them before the Rx time is very gratifying. For further details about what will be covered in this essay, click here

Browser History 6

The task for Browser History 6 is to split BrowserHistory 3’s three-column “History of Browsers” web page into four separate web pages: a front page with the Introduction and three button hyperlinks to three other pages possessing the history of the three browsers. We were tasked to make the page when the mouse moves over a button and displays the corresponding browser icon in the area below the buttons. I had trouble writing the code to display the logos when the mouse moved over the buttons, I took a step back and watched the screencast, but even after this, I could not make the code work. I thought I understood what I needed to do; however, during my second attempt, I had the same problem: my logos weren’t showing up. After doing it repeatedly, on my 5th try, I realized I didn’t correctly type out my image source tags. I believe that what went right with this WOD is that I utilized the find and replace feature effectively. Using this feature shaved a lot of time in my WOD that I could pass under Rx. Watching my recording, I see most of my mistakes were mistyping the code and figuring out what I did wrong. I would be more careful when more type.

Smart Phone Products with Variables

In this WOD, we were tasked to use variables instead of hard coding for product display on SmartPhoneProducts1. This aims to keep the product data isolated from the rest of the code so I can more easily manage it. After getting more comfortable using the RegEx instead of manually making changes, I replaced elements utilizing the feature. This helped eliminate minor spelling errors, and I highly suggest using this method for every situation that permits you to do so.

Invoice 1

In invoice 1, our task was to create an invoice for items using JavaScript and HTML. Just like all the previous WODs. I started by reading all of the instructions on the prompt. I found that starting the WOD was not as challenging as I thought. I started by following the instructions and timed myself. After the first go, I realized I had difficulty completing the task, and when I did, it was consistently DNF. I watched the screencast, found the solutions to my issues, and decided to try again. After a few trial and errors, I completed the WOD in Rx time. I read the instructions carefully and tried my best to follow them. I could have improved my preparation by watching the screencast more thoroughly.

Invoice 2

In this WOD, we were tasked to modify our Invoice1 to determine the shipping cost. Surprisingly, I could do the tasks quickly compared to Invoice1, but then as I re-read the prompt, it asked us not to hard-code the values. Because of this, I took a lot of time to complete the WOD as I had to find a way to write an algorithm to avoid hard coding. Also, I had trouble at the end as the table didn’t properly format the totals at the bottom. I did a few practices for this WOD. I referred to my notes from the lecture and reading assignments under the Module. To do better for the next WOD, I decided to do some examples from the lecture screencast and assigned readings to become more familiar with the tasks that need to be performed during the WOD.

SmartPhoneProducts 2

This WOD aims to use a loop and a generic <section> to eliminate the redundant code for displaying the products. We were also tasked to generate the product display from the data rather than hard-code each section. We were given the variables to create the product data but no specific instructions on how to do it. I read the directions and then went over my notes, but I didn’t know how to do this alone. So I watched the screencast and eventually figured it out. The most challenging step was when we had to use a for-loop instead of the variable initialization.

Conclusion

After taking a step back, I realized there were many ways I could have done faster and more efficiently when doing these WODs: I need to familiarize myself more with the fundamental coding concepts and formatting to perform better in the tasks. I also learned I did better if I thought simpler when reading through the instructions. I found that I could solve problems better by reading WODs more carefully. I believe coding is often easier than what I picture in my head.