The biggest hurdle to overcome when starting to use a UI Framework is the time investment required to learn the syntax and keywords. When I did the Semantic UI Hello World practice, it made the framework seem really simple and just like a little visual add on to html for a few extra lines of code. Then I did the Browser History with Semantic UI WOD which seemed easy when I read the directions, but took me a lot longer than I thought it should have. The DNF time was 25 minutes and I couldn’t even finish on my first attempt. I watched the video tutorial and it started making a lot more sense. After finishing the first E34 Browser History practice WOD in my second attempt in a little less than 11 minutes, I got a little more confidence in Semantic UI. Then the next day I started the Island Snow practice WOD which seemed pretty simple because it was only a single website, but I DNF’d on my first attempt on the first 2 WODs. This was a little discouraging, but it got me motivated to work harder and get more practice in.
The failures I got on the previous few WODs definitely didn’t feel good, but it led me to actually learn the right way to do it and practice more to finish in a faster time. To get better at my use of Semantic UI, I watched the video tutorials for the WODs I failed, read more Semantic UI documentation (menu, dropdown, button, container, icon, etc.), and went to the BWOD for the week. The in-class practice Murphys WOD also looked easy when I first looked at it, but I still couldn’t get it to work in the 40+ minutes that we were given. The UI Design (Frameworks) module of this class was probably the most challenging for me so far and it really bothered me that I couldn’t finish my assignments in the expected time. I got humbled even more when I couldn’t finish the BWOD in the given 45 minutes after getting a little confident from finishing the practice WODs within the DNF time. Then came the day of the actual in-class WOD which I was actually a little nervous for. When I saw the page we were going to be recreating, I felt a little relieved, but I knew not to underestimate the difficulty like the last few WODs I had failed. I’m not sure if it’s because I practiced a lot, or the WOD was just easy, but I finished in 17 minutes when the Rx time was <20 minutes and the DNF time was 45 minutes. I’m going to say it’s because I learned a lot from my failures which pushed me to redo my failed WODs and get better times on them so that I could recreate web pages faster in general.
Raw HTML and CSS by themselves can make decent looking websites, but it will take a lot longer than using any UI framework. Semantic UI was the framework I was using, but the important thing wasn’t the framework itself, it was the fact that I was using a framework to save time and make things look better. Similar to learning a first programming language, my experience in learning my first framework will help me learn other frameworks faster in the future. Next up is React which I’ve heard is a step up from Semantic which I am excited for. The time investment for learning Semantic was less than 10 hours, but I learned a lot and got a lot faster at remaking websites. I believe learning Semantic was worth the time I invested as the knowledge I gained was not limited to only Semantic UI, I learned a little about the nature of UI frameworks and got more comfortable with HTML/CSS as well.