Is there a UI framework or library that is as comprehensive as Twitter Bootstrap, uses Material Design, and is a good fit with AngularJS?
I have used Twitter Bootstrap for a few years. Recently I have started developing in AngularJS and have been trialing Angular Material.
I really like the overall look and feel of Angular Material and the way it uses flexbox. My design skills are limited though, so I really need a comprehensive solution and I find that Angular is just not comprehensive enough (yet).
By way of example, the kinds of things that are available in Bootstrap but not Angular Material include:
Typography: Definition lists, address formatting, inline forms
Components: Jumbotron, page header, panels
I realize that Angular Material has similar things in some areas, but they seem to be quite specialized. For example, you could say that Angular Material cards are akin to Bootstrap Panels, but as far as I can see there's no real point in having a card that doesn't have an image header.
Should I be looking at Polymer? Or something else? Bootstrap 4 looks promising, but I need something now.
Bootstrap has been already 'angularized': https://angular-ui.github.io/bootstrap/ . You can now use the framework you are comfortable with together with angular.
Splitting your requirements: "UI framework or library that is as comprehensive as Twitter Bootstrap, uses Material Design, and is a good fit with AngularJS"
UI framework or library that is as comprehensive as Twitter Bootstrap:
Twitter Bootstrap.
Uses Material Design:
Twitter Bootstrap + Bootstrap material design theme.
Is a good fit with AngularJS:
Twitter Bootstrap + Bootstrap material design theme + Angular Bootstrap Material
Disclaimer: I wrote the last component, Angular Bootstrap Material
Related
I am very curious to know whether anyone has tried to use both angular material (for angular 1.x) and kendo ui components in the same project, and if so, then:
what were the conflicts, if any, they experienced with respect to css and/or javascript, and
because both libraries have a certain amount of cross-over in terms of similar components, what was your thought process when determining which library to use for a component?
While kendo-ui does have a few "material" based themes, I don't see them following the google material design spec nearly as close as angular-material does.
I am also using both, Kendo und Material Design, in my desktop client project.
I use Material Design for the general website structure
toolbar
sidebar,
navigation, etc.
and Kendo UI components
buttons,
forms, etc.
for everything else. I imported CSS declarations from both.
The only component I use from Material Design is the Snackbar as I think it works better with the common workflow of desktop applications.
So far i have not experienced any conflicts.
So I am developing a new MVC application using AngularJS and I wanted to implement bootstrap for the UI but upon searching for bootstrap from within NuGet I see AngularJS UI Bootstrap.
I did a little reading to find that this unfamiliar flavor of Bootstrap could actually serve as a replacement for the traditional bootstrap that I am more familiar with but I really don't understand what the core difference is of when one would opt to use one over the other.
So what are the advantages of using AngularJS UI Bootstrap instead of Bootstrap? Given my current stated position for what I am doing, would it be more advantageous to use AngularJS UI Bootstrap or is it purely a matter of personal preference?
Angular UI-bootstrap is a replacement for the Bootstrap javascript, not for the css framework. It has rebuild the bootstrap JS functionalities such as modals and popovers to 'the Angular way', so if you want to use those functionalities use Angular UI-bootstrap
My project was developed by normal jquery with material design. But, now I am implementing AngularJs in my project. Material design does not support angular js(won't bind to scope object). My friend suggest me to use angular material design. My customer don't like angular material design UI, He wants material design UI.
Any solution to use MaterialDesign with angular instead of AngularMaterialDesign
Angular.js is a MVC framework, Material Design is just a design guide made by Google.
If you want to have your angular frontend look like Google's material design, you can either include the CSS only or use something like Angular material lite, which wraps angular with material design.
There is no need for you to include Angular.js if you want to have material design or the other way, include material design together with angular, both of them can be used separatly.
I have been researching options to using Bootstrap with Angular and it appears to focus on two:
Angular UI Bootstrap
AngularStrap
I see a third option of just using native Bootstrap. What are the pro/cons of all approaches? This seems to hint that Angular UI Bootstrap is not feature complete:
Which one to use, AngularUI Bootstrap or AngularStrap?
I don't use both of them because I don't want my project depends on too many 3rd party libraries. So I just use native Bootstrap JS, but I have to customize it to fit requirement of my project.
I don't say Angular UI Bootstrap and AngularStrap are not good, but with my project's requirement, I don't need all features so they are quite heavy. I just want you to pay attention to a point: currently, AngularStrap supports AngularJS 1.2+, this means it should support IE8 but Angular UI Bootstrap doesn't.
Hi in my case its not about either or, its about getting things done. If a component or directive exists already from aforementioned libraries (probably isn't much difference between angular ui bootstrap and angularstrap) e.g. modal, datepicker and it fits requirements then I'll use it. Otherwise I use vanilla bootstrap to make my own directives :-)
Here's a link to building components using directives in angular.
I've been developing a mobile app with AngularJS and zeptoJS but the combination of those two is not providing any UI widgets
I've seen this topic: Is there a UI library for angularjs for use in a phonegap app?
but I'm looking for more answers ( really, LungoJS is the only answer? and I'm not going to use jQueryMobile. ). Are there any other light libraries ?
IonicFramework is a framework designed for exactly this purpose. Its fairly modern though. As such it doesn't have much in the way of backwards compatibility.
Angular Material (currently for 1.x only)
Material Design components for Angular 2
OnsenUI - "The answer to PhoneGap UI Developement"
React Native
NativeScript Angular
Mobile Angular UI lets you use Bootstrap 3 css stripped out of desktop related media queries and Angular.js to develop mobile apps fast.
Its purpose is to achieve the same of Jquery Mobile but using Bootstrap 3 for the UI and AngularJs in place of Jquery.
It provides also other essential mobile components that are not included in Bootstrap 3 like sidebars, scrollable areas, absolute positioned top and bottom navbars that don't bounce on scroll and more.
I also like TopCoat which is a CSS mobile/desktop framework that works well with Angular. See it in action with angular here: http://coenraets.org/blog/2013/11/sample-mobile-application-with-angularjs/ and the library at http://www.topcoat.io
Check my answer here where I resumed other options for UI frameworks as well as Pros and Cons.
Including kendo UI, phone.js, chocolate chip, steroids.
Custom CSS for Mobile development using Phonegap/Cordova
Top coat and bootstrap also nice ones as already mentioned.
Maybe reconsider jQueryMobile.
Quite a few months ago we started a new project and considered all of the options listed above for a client side framework. We were looking for a large set of mobile-optimized UI widgets. A widget catalog was more important to us than whether the framework provided an MV* architecture, so tools like AngularJS, MeteorJS and EmberJS were secondary. We found jQueryMobile as the best option for us. Bootstrap, Ionic, Kendo, Sensa, etc. didn't seem to have as many and varied out-of-the-box widgets specifically for mobile. The space of mobile tools is in transition, but so far I think we made the best decision for our use case.