Web UI Design Basics

Web development is an alien subject to me.  I had very minimal prior experience with any web related coding.  The most I did was for MySpace back in 2007 for simple text editing.  I didn’t really grasped the concept of HTML back then.  Which might be why I prefer embedded programming over web development to this day.

I never thought I would revisit HTML (or any web development subject, for that matter).  Ever since the introduction of HTML 5 standard, I got interested in web development.  Now here I am, learning HTML and CSS for a software engineering class I’m currently taking.

WOD 1: Browser History 1

The first WOD was straight forward, even when I am completely new to the web development.  We created a simple webpage containing the history of various web browsers such as Internet Explorer, Firefox, and Chrome.  The first iteration took me about 21 minutes which isn’t a stellar time but I was able to finish it before the DNF time.  Second iteration took me about 16 minutes because I had Google’d less for other online resources.  Through this, I got acquainted with basic editing using HTML for a web page.

WOD 2: Browser History 2

The second WOD was completely foreign to me as I have never encountered CSS before.  I had to refer to a lot of different online resources to get an idea for CSS.  This WOD particularly took longer than other ones.  The first three tries, I DNF’d.  I just was not familiar with syntax and some ideas behind HTML and CSS integration.  On the fourth try, without referring to other references, I was able to to complete the second WOD little under 15 minute mark.

WOD 3: Browser History 3

The third WOD was a little familiar to me thanks to the second WOD that I completed four times.  But by no means it was easier to complete.  This third WOD did not provide a clear instruction (for a person who is completely new to this).  So it came down to a lot of reference to Google and trial and error until something worked, without breaking the page.  I have learned about different ways to create navigation bars.  However, I wouldn’t be able to code one if I was asked to do so right now.  I need more practice to get familiarized with HTML and CSS.  It took me about 17 minutes 30 seconds on my second try.

Conclusion

This week’s WODs were interesting to do.  Every aspect of it were completely new to me.  Some were challenging without clear cut instructions but that is what search engines are for, I guess.  This was a good learning experience for me as I was interested in developing websites for some of my side projects.  HTML and CSS were easy to learn.  Organizing and making sense out of all the syntax (wall of texts, literally) was a bit challenging for me.

 

Beauty of Coding Standards

Elements of Java Style was an interesting book to read.  The book lists code styling conventions for Java and it should be a must-have for any programmers.  It contains 108 style rules to follow, which makes your code look standardized and easier to follow for external developers.  This book would be really help to start someone off in Java, not requiring new learners to adjust their coding style.

This week’s practice WOD (workout of the day) involved Scribble, repository found in GitHub, where we had to correct any styling errors.  For the software engineering class I am currently taking, we followed 108 rules found in Elements of Java Style and additional 19 rules used for this particular class.  We were given a custom checkstyle.xml which we used for CheckStyle in IntelliJ.  We did a similar practice WOD in class, so I was able to correct all errors within 17 minutes.  This time could be reduced if I could find a way to set the custom rules as default for the CheckStyle in IntelliJ.

I personally think this athletic software engineering approach is allowing me to quickly obtain skill sets introduced and master it in relatively quick pace.  And the fact that there is a time pressure allows me to work quickly, driving me to improve my results wherever I can.

Honestly, it will take me some time to memorize all the style rules for Java.  Without the custom rules provided in xml file, I wouldn’t have been able to finish the WOD in 17 minutes.  Maybe one day (very soon, hopefully) I will be able to write a code with 0 styling error.