7 Angular front-end component libraries worth trying in 2021, come and collect them!

Angular is a front-end framework that can span multiple platforms of Web, mobile Web, mobile applications, native applications and desktop native applications. After decades of development With the development, a huge ecosystem has been formed, and there are countless component libraries based on Angular.

If you want to try the Angular framework in 2021, the following Angular component libraries may be a good choice!

1. Material Design for Angular

The first thing to recommend is, of course, Angular’s ​​official Material component library, Material Design is a design system of Google.

Based on this design system, both the official and the community provide various component libraries, including the Web side (Angular/React/Vue ), there are also mobile versions (Android/iOS/Flutter).

Among them, the Angular version of the Material component library is now the official component library designated by Angular, so it has a very large audience. Whether it is the number of Stars/Forks on Github or the weekly downloads on NPM, it is TOP 1 of. [Related recommendations: "angular Tutorial"]

The following is the data on April 19, 2021:

##IndicatorsValue##Star21.4k ForkNPM Weekly Download891,480

5.7k

Material Design for Angular

The first Alpha version based on Angular 2 was released as early as March 2016: 2.0.0-alpha.0, which evolved over a year. However, the official version of 2.0 has not been released for a long time. It was not until December of the following year that the official version of 5.0.0 based on Angular 5 was released. However, Material Design for Angular is not the earliest Angular component library. PrimeNG, which we will introduce later, was born earlier than it, but Material is undoubtedly the most popular and popular.

2. NG/NGX Bootstrap

Bootstrap

is an open source toolkit launched by Twitter for front-end development. It is also very Popular HTML/CSS/JS framework for developing responsive, mobile-first web applications. How popular is it? We will know just by looking at a set of data.

Framework/LibraryVueReactBootstrapAngular

As can be seen from the above data, Bootstrap even has more stars than the Angular framework. This shows the popularity of Bootstrap. Therefore, it is not difficult to imagine that the Angular component library based on Bootstrap is also very popular.

There are two main Angular component libraries based on Bootstrap:

• NG Bootstrap
• NGX Bootstrap

NG Bootstrap and NGX Bootstrap are two different projects by two different project teams, and they can both be used in Angular using only Bootstrap without using jQuery. The main difference is the Bootstrap version they support:

• NGX Bootstrap supports Bootstrap 3 and 4
• NG Bootstrap supports Bootstrap 4 and requires Angular5

Judging from the weekly downloads of Github Star/Fork and NPM, they are also comparable, and NG Bootstrap seems to have the upper hand:

Star number
182k
167k
149k
72.5k

Indicators	NG Bootstrap	NGX Bootstrap
Star	7.7k	5.3 k
Fork	1.4k	1.7k
NPM Weekly Download	386,485	235,662

##Judging from the version release time, NGX Bootstrap needs Earlier:

IndicatorsNG BootstrapNGX BootstrapFirst release version1.0.0-alpha.0 July 20161.0.1-beta.2 January 2016First official version1.0.0 January 20181.0.4 February 2016From above The data shows that whether it is the first release or the first official version, NGX Bootstrap is earlier than NG Bootstrap. Especially the release time of the first official version, NGX Bootstrap is two full years earlier than NG Bootstrap.

So we can roughly understand that NGX Bootstrap is an earlier library and can support Angular 2 and Bootstrap 3, while NG Bootstrap is relatively new and requires Angular 5 and Bootstrap 4 to use.

If your project is a new project using Angular 5 and Bootstrap 4, it is recommended to use NG Bootstrap, otherwise use NGX Bootstrap.

3. NG Zorro

The third Angular component library to be recommended is based on the

Ant Design design systemNG ZorroComponent library.

Ant Design is a design language of Ant Financial. After years of iteration and accumulation, its UI design ideas have become a set of de facto standards and are sought after and loved by many front-end developers and enterprises. , is also a magic weapon in the hands of React developers.

As the Angular implementation of Ant Design, NG Zorro not only inherits the unique ideas and ultimate experience of Ant Design, but also combines the advantages and features of the Angular framework. The style of the component is kept in sync with the latest version of Ant Design, and the interface of the component is also kept consistent with the React version of Ant Design.

It is said that Zorro is the most popular Angular component library in China, I believe no one will object.

In August 2017, Zorro officially

open source and released the first version: 0.5.0-rc.0. After a year of evolution, it was released on the second Version 1.0 was released in June.

Judging from Zhihu, Zorro’s community response is very good: https://www.zhihu.com/question/63992236

The following is the data on April 19, 2021:

IndicatorValueStarFork2.6kNPM Weekly Download

4. Nebular

Nebular is a customizable Angular UI library, based on the Eva Design design specification, including 40+ UI components, 4 visual themes, authentication and security modules.

Nebular does not contain many components, only 40, but it contains many practical tools, such as theme packages, login authentication, role authentication management, Admin system, etc.

If you have this need, you can still try it.

The release time of Nebular is very close to that of Zorro. The first version was released in August 2017, and the first official version was released the following year. However, based on the weekly downloads of Github Star/Fork and NPM Look, Nebular is slightly inferior:

	7.4k
	35,941

##IndicatorValueStar##ForkNPM Weekly Download17,0375. PrimeNG

	7k
2.6k

What I recommend next

PrimeNG

is also a foreign Angular component library. This is an old Angular component library. The first version was released in February 2016, which was earlier than the official Material. PrimeNG has very rich components, with a total of 90 components. It may be the most comprehensive Angular component library currently on the market.

The following is the data of PrimeNG:

IndicatorStar6.7kForkNPMWeeklyDownloads260,712##6. Clarity

Value
3.3k

Clarity

is also an Angular component library with its own design system, based on the

Clarity Design design language. This has the same name as Teambition’s Clarity Design, but it is from a different company. of different products, do not confuse them.

IndicatorValueStarFork701NPM Weekly Download

7. DevUI

The last thing I want to recommend is a new domestic Angular component library called DevUI, based on DevUI Design Design language.

DevUI is an open source front-end solution for enterprise mid- and back-end products. It advocates the design values ​​of immersion, flexibility, and simplification , advocates designers to serve real needs, design for the majority of people, and reject designs that are sensational and eye-catching.

DevUI is incubated from Huawei Cloud DevCloud R&D tool system. It is most suitable for ToB tool products, because such products do not pursue cool styles, but care more about whether the tools are stable and efficient to use. , whether it can truly make users forget about tools and achieve a flow state during the use of tools.

Since DevCloud is a R&D tool product with rich scenarios, DevUI incubated in it has its own unique advantages. DevUI provides many special components that other UI component libraries do not have, such as Gan Special pictures , quadrant pictures, and the new category search, elf navigation, etc.

DevUI has been used in many DevCloud businesses since early 2017. After many years, DevUI has withstood the test of a large number of DevCloud online users and has become a stable, efficient and smooth Angular component library.

If you are developing ToB's tool products, DevUI will be a very good choice!

6.2k
18,014

Indicator	Value
Star	638
Fork	106

For more programming related knowledge, please visit:programming video! !

The above is the detailed content of 7 Angular front-end component libraries worth trying in 2021, come and collect them!. For more information, please follow other related articles on the PHP Chinese website!