Simple Quality UI for Angular: The origin

This is a story of how an open-source idea came to be.

A tale of an idea

Early 2017. I had been working on a client project for some time. It was originally written with Angular 2, and I was migrating it to Angular 4. I had already become a big fan of the framework, even though I had never considered myself to be a “technology evangelist”.

The main reason? Its dedicated and very steadily growing community. I loved how many new useful Angular packages were (and still are!) constantly being created.

Since I liked the framework and I still hadn’t found my “go-to” UI-kit, an idea popped up — why don’t I try and contribute to the ecosystem?

And for some time, I kind of brushed that concept off since I didn’t want to create a library that didn’t bring anything new to the table. Moreover, it would take way too much time for it to become as developed and battle-tested as some already established UI-kits ( PrimeNG and ngx-bootrstrap being very good examples).

Fast-forward to early 2018

The latest Angular version introduced a super cool new feature —libraries. What’s more — it came with ng-packagr which made creating npm packages from Angular projects a breeze. At that point, another thought had sunk in — wouldn’t it be awesome if there were more OSS UI libraries that consisted mainly of community-demanded components?

The notion of creating a UI-kit had gradually become more tempting. Since I wanted this new library to contain community-demanded components, I thought, “Why don’t I just ask fellow developers what they are mostly looking for and try and base the initial stable release on that?”.

Laying the basis

I have a lovely life companion who also happens to be a developer. And more experienced than me, at that. I shared with him my thoughts about the “great new UI-kit” I wanted to create. And luckily, he enthusiastically agreed to help me. He is now an active contributor and is responsible for spreading the word about the project.

The first official step we took as a team was to come up with a list of components that could be considered as the most sought-after.

So, naturally, both of us asked our colleagues at work. After that, we created a survey (beware: it’s in Bulgarian) that we published in a Bulgarian developer Facebook group (its member count is nearly 15 000). A week or so later, we took the results of the survey and added our colleagues’ responses to them. We compiled a list of components that were voted the most and started the development. This was the starting point for Simple Quality UI for Angular (ng-sq-ui, for short).

Our initial release was on github in August, 2018. It only consisted of one module which provided form-related components , such as: regular input field, typeahead, dropdown, etc, and a simple modal component . We gradually extended the UI-kit with more modules and 6 months later — at this point in time — ng-sq-ui contains all of the components voted by fellow devs as most commonly looked for. Additionally, we launched our own site with live previews and have also added Stackblitz examples to our documentation .

In the light of the fact that ng-sq-ui has reached its first milestone, I am going to highlight some of the features it provides in the next series of posts. Stay tuned!

What’s next?

We would like to stick to the idea of releasing components that are entirely demanded by the community. Your input would be much appreciated! Feel free to file a feature request or submit a bug !

Our plan in the long run includes releasing Simple Quality UI for React and Vue. We’d be thrilled to welcome new contributors as well :)