Semantic Antics
24 Feb 2021Don’t go raw on the Front-end
UI frameworks. The pretty stuff. The User Interface, or UI for short, is the front-end of any given application. It is what the user sees. The API or application programming interface is the back-end, and users don’t see much of that! The UI is like the hard body of a sports car. It can protect the car from debris and provide an aerodynamic shape for added speed but ultimately the body is just for looks; For outside viewing pleasure. While the API is similar to the engine and battery of a car. Without the engine, battery, and all the other intertwined and dependent components, that car isn’t going anywhere! The synchronicity of the API and UI for software work much the same way. The API and the UI work in concomitance to combine functionality, with aesthetics and organization. For the past two weeks I have been learning the basics of front-end development. I’ve been figuratively priming and painting the body of different cars. The first week of my learning experience took place through the HTML and CSS languages to build janky websites. Messing around with colors and positioning paired with lots and lots of practice was the name of the game for my first week developing in HTML. If the UI is the color and shape of a car’s hardbody, then I was using paper mache for the mold and painting it with watercolors. That’s what it felt like to use raw HTML and CSS to construct a website. It felt like I was missing something. Surely there was no way that all those nice company websites were made with only these two languages at their disposal. Then the second week of my introduction to front-end development came along and I began to understand how other entities make their websites look so clean. The truth is, these big companies have actual good developers working on their site rather than undergraduate students who just learned HTML. So that’s the main reason why my creations couldn’t compare to their masterpieces! Another more important reason however, was the fact that these companies use UI frameworks that make the job far easier. Moral of the story, don’t limit yourself to raw HTML and CSS if you want to build something worthwhile.
The right tools for the job
In the analogy I used up there, raw HTML and CSS equate to building a car’s hardbody out of paper mache and adding color with watercolor paint. With UI Frameworks I feel as if I have any tool or mechanism ever conceived at my disposal. UI Frameworks are platforms for developing a front-end. Instead of getting down and dirty with the specific HTML, JavaScript, and CSS code, someone else has already done it for you. Your hands will remain unsoiled when using a framework of any kind. I personally experienced the Semantic UI framework and I can vouch for its utility without a doubt. But it’s not all sunshine and rainbows when using UI frameworks. It would be too good to be true for frameworks to have both simplicity and greater functionality than raw code. The increase in functionality comes at a cost. It feels like learning to walk again. I was just beginning to take my first steps coding in HTML and then I was quickly introduced to Semantic UI. I transitioned from barely taking my first baby steps to running on roller skates in the matter of two weeks. Semantic UI is admittedly a lot to take in, especially if you’re new to front end development as I am. The reason it can be difficult at first is because of all the meaningful keywords that are present in Semantic UI. I had to learn all sorts of meaningful keywords that each had significance. Keywords such as Grid, Container, Menu, Column, item, icon that can make your life easier in the long run. But in the short run, I was tripping and falling at every corner when making an attempt to decipher the subtle disparities between these keywords. Just like most things related to software, there is a steep learning curve at first. Once I familiarize myself with all the keywords and their functions it will be smooth sailing. In conclusion I would vouch for Frameworks such as Semantic UI. It could be difficult at first but once you get the hang of it you’ll be able to produce high quality beautiful sites in a fraction of the time as you would be able to with just raw HTML.