UI Frameworks

19 Apr 2019

The Browser Is Your Canvas

UI frameworks are a creative medium for technical minds. Whether you’re building an MVP for your latest product idea, or hacking together a static website, a UI framework can increase the speed of your development exponentially. Pick up a UI framework and you instantly have access to pre-designed components to Html documents, that way you can focus less on designing and more on coding. Most frameworks mimic the Html language, utilizing tag-ular embedded components, while combining the power of Html, CSS, and JavaScript in the front-end.

Semantic UI was my first introduction to UI frameworks. My first impression was how clean the syntax is. It made my code a lot easier to read. Semantic UI’s approach to ‘semantic’ class variables reduces code bloat by relying less on traditional patterns of class hierarchy. For example an ‘a’ tag using a framework like Twitter Bootstrap may look something like:

	<a class="ui-grid ui-grid-stackable ui-grid-equal-height ui-grid-inverted ui-grid-stackable"></a>

When in Semantic UI it would be:

	<a class="ui stackable inverted divided equal height stackable grid"></a>

Which is easier to read?

That being said, UI frameworks are a wonderful tool for the creative programmer. Semantic UI in particular is effective, powerful, and rewarding. From a ‘back-end developer’ perspective UI is a rather small part of the system, and may require climbing over a rather steep learning curve to get the hang of. But once you become familiar with the attributes, elements, collections and modules you’ll be cranking out beautiful pages in a short amount of time.

Web design is a field thats been evolving since the dawn of the Internet. The standard aesthetic increases everyday, and with the advent of Semantic UI that standard jumped 5 notches.