About the hitchhikers series

This is a series of posts dedicated to help devs discover and navigate the web ecosystem. Look, web development is vast and intimidating everyone could use a guide.

User Interface Libraries

UI libraries are third party code that traditionally provide UI components and utility classes used developers create apps. Classes to affect styles and layouts and user the UI components provided the library. More modern libraries may also provide syntax for creating stateful reusable components.

The following are some popular libraries.

Tailwind CSS

These days it feels like this wouldn't be a Dev.to post without mentioning tailwind. It's a highly popular library for good reason. There's so many utility classes you can tweak the smallest details of you app needing to write any CSS.

Bootstrap

Another popular library that is usually the first for many devs is Bootstrap. It's not as flexible as tailwind but its easy to use and has tons of themes, and examples.

Materialize CSS

This is my personal pick for putting together a web app quickly. Materialize CSS is great for making an app that follows the material design specification.

jQuery

This legacy library is more of an honourable mention. Around 2017-2019 it was unfathomable to build a website without jQuery. It provided easy to use APIs for cross browser DOM manipulation, AJAX and attaching event handlers.

Since then the standardization of APIs such as document.querySelector() and fetch() have somewhat replaced the common use cases for the library.

However, jQuery is still used today and has spawned other projects like jQuery UI and Quint.

React JS

You are probably wondering why this wasn't at the top. According to the State of JS survey, ReactJS has been the most used 'Front-end Framework' since 2016. React is featured 5th in this post because it is both a library and a framework.

React allows for a gradual adoption where you can use it as a drop in library. However, it is recommended to be used more like a framework by utilizing the CLI tool for bootstrapping and compiling a project.

In my opinion React's documentation is easy to follow and the basics can be picked up fairly quickly. React also boats a declarative coding style that allows you to write more predictable code that is easier to debug.

Vue JS

Vue feels is like the de facto react alternative. It argues some performance improvement over react and doesn't require you to write JSX or CSS in JavaScript.

Vue is the third most popular 'Front-end Framework' behind React and Angular. Unlike the other frameworks Vue was not created within a big tech company like Facebook (react) or Google (angular) so its impressive to see how far it has come.

Conclusion

That concludes our visit to our first destination on this journey. There's 7 more stops to go! If you found this informational please consider following me on dev.to or on twitter so you won't miss the next post in this series.

What is your favourite UI Library and why?

References