[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Web-App (Angular 6): Choice of Design Framework - Angular Material vs bootswatch and ng-bootstrap)

 Hello everyone,

After some discussion, Anwesh and I have a come up with the following
points regarding the decision to use Angular Material or bootswatch and
ng-bootstrap for the new MifosX Web App (Angular 6):

1) ng-bootstrap is a wrapper over bootstrap.js which contains a set of
Angular Directives that can be implemented without any dependencies on
jQuery or popper.js  https://ng-bootstrap.github.io/#/home
2) Bootswatch provides a collection of themes(21 + 1 default) for
Bootstrap  https://github.com/thomaspark/bootswatch/
3) Bootswatch provides with an API which can be integrated with the
platform for theme configuration easily and provide the organizations with
a choice from these 21 themes  https://bootswatch.com/api/4.json
4) We are currently using the bootswatch material theme to compete and
provide with a similar kind of look as by angular-material
5) New themes if required can be configured easily using bootstrap, as a
simple example I have created a demonstration here:
6) We can also provide instructions so that the organizations will be able
to clone the project, create their own custom theme, build the app and use
that theme.
7) Overall, ng-bootstrap and bootswatch built on top of bootstrap are easy
to implement and could be modified and used to suit our needs

8) On the other hand, angular-material provides with 4 inbuilt material
themes to chose from  https://material.angular.io/
9) More custom themes can be configured according to organizations needs
using angular-material as well but it will be a bit more complex
10) Overall, angular-material will be more time consuming and a little
difficult to implement

We would like to share this with the community and get their opinion
regarding our choice of design framework so that we can finalize the same
as soon as possible in the initial stage of the project.

Looking forward to your responses.