An Angular developer is using quite a lot of tools in his or her daily activities, but some of them are simply amazing and all devs end up relying on them constantly. One of these tools is Angular Material, which can be easily considered one of the…well, best inventions in terms of development!
Sure, some of you can call us subjective for making such a statement, but let us present a few of the main reasons that helped Angular Material gather such an impressive fanbase…
It’s all about Material Design
Obviously, if we’re going to talk about Angular Material, Material Design should be the first thing to cover, as it plays a very important role in creating its personality.
Simply put, Material Design is an incredibly powerful specification, developed by Google, to facilitate a multi-device experience, no matter the form factor or the input method. And Angular Material did one amazing thing by implementing the same intuitive and easy layout system!
The perfect layout? Could be.
Based on CSS’ flexbox, Angular Material can make layout simple and solve some of the most common problems encountered by devs, through just a few lines of HTML.
But this is not everything!
For example, if you want a first child to take a portion of the page for the simple fact that it’s in navigation, while the second child should take up the rest, the only thing you need to do is to add a number value to the flex attribute. And you’re done, that’s the percentage of layout that the element will fill.
Proper responsiveness
If you think that Angular Material is great just for the previous two reasons, wait until you hear about the entire set of layout options available!
Let’s say that you have two child elements and you want them to live side by side unless you are on a mobile device and then you want them to stack. In this case, you can consider adding an attribute calling out the layout for the small form factor. Therefore, you make the switch from row to column layout by using layout-sm=”column” in the parent container.
The right components
We can all agree that Material Design is one of the core features, but let’s not forget about the load of Angular components you have at your disposal!
Oh, and the documentation comes with a lot of working code ‘pieces’ that you can use right away. And this is also a great way to decipher the mysteries of Angular Material.
A big accent on accessibility
And finally, let’s not forget about one of the most important considerations that should be integrated into a web app.
In Angular Material’s case, accessibility is front and center of the framework and the best exemplification of this is its ability to log errors in the console if, let’s say, default text can’t be found on a button and aria-label is not defined.
So, are we still subjective with our statement about Angular? No, we don’t think so.
At IB Systems, we have been working with al Angular versions from 2+ through the last 20 years and believe that it doesn’t have so many secrets for us. If you are looking forward to starting your own project based on this framework and believe that our experience can add a plus, get in touch and we can see if we are on the same track!