A UI Framework, or User Interface Framework, is a software framework based in HTML that enables users to create web pages easier. There are many front-end frameworks, but for the purposes of this software engineering course, we are using Semantic UI. Prior to learning Semantic UI, I had only created a single webpage using pure HTML (shown below left). Even prior to this, I did not have much experience with HTML. When first learning to encorporate Semantic UI into my code, I first noticed how easy it was to remember a command after using it just once. This is because Semantic UI uses simple English phrases to call behaviors. For instance, to create a menu, simply make a div class called “ui menu”. This allowed me to easily recall past commands. I ended up creating the same website that I had originally created in HTML (shown below right).
In my opinion, learning Semantic UI at the same time as getting comfortable with HTML was a wonderful thing. It helped me to broaden my view faster as to how much you can do with HTML. Another great thing about Semantic UI is how many different features they provide. There are so many items you can create. It honestly gave me confidence in my ability the more I played around with the different features. It also made me realize that it is not that hard to build a basic website. With just a bit of knowledge of the right tools to use, a person can have a website up in no time. It makes me think back to my first Hackathon and I remember knowing nothing. If I knew what I know now, I would have been golden.
It was very interesting to play around with copying other websites. It made me realize how websites are not that hard to make, but only if you know where to start. Semantic UI made it not only easier to start but faster to finish. Semantic UI’s website has every feature and its accompanying code, and they make it very easy to find. Therefore even if you do not know how to do something, it is very fast to look up what you want and copy the code. Below are screenshots of the before and after of a website that I recreated.
Everyone should start with learning basic HTML and even try to build a website before using a UI Framework. This way you get comfortable with the idea of HTML and how to use it. You should also get comfortable with Cascading Style Sheets (CSS) to accompany the HTML. This way when you start integrating a UI Framework into your code, you understand how the code works (and also appreciate how much easier it is). Especially when first learning, play around with the different features. In the end, the faster you learn to use Semantic UI, the faster you create HTML code, the faster you can make your dream website come true.