Is there any website that is similar to bootsnipp.com (for Bootstrap) But of course dedicated for angular-material?
You have CodePen and Their orginal site (which you may already know of).
If you search for ideas to new design possibilities I would also recommend Google MDL (Material Design Lite). They relay more on more CSS, but got almost the same rules for design.
Related
I am going to create an admin portal website with react.js and I searched about the best/the easiest ways to create it. So far I think react-bootstrap and ant design are good choices to build the site.React-bootstrap does not support bootstrap 4 and seems ant provides more powerful components so I prefer to ant.
Anyone has some other options? or how are your thoughts about ant design?
Thanks
You can use react-admin framework, a frontend framework for building admin SPAs on top of REST services, using React and Material Design. You can find the documentation here - https://github.com/marmelab/react-admin
Take a look at the repository which contains the main layout design and reusable components as tables, forms, and charts by using Ant Design and Bizcharts.
You can also find the step by step implementation guide in the blog post.
I have old multi-page Rails website (more than 30 pages) and I'm going to implement Material design with some JavaScript effects for it. After investigations I found that Angular Material provides the most appropriate solution for me. But I'm not sure if it's good to use it, because I have multi-page site. As I understand basically Angular is used for single-page applications.
In fact I'll use only Angular Messages, Material, Animation and View features. Please advise if using such massive JS framework worth it in this case.
Angular does not need to be used only for SPAs. Here's a more in depth discussion of the topic Is AngularJS just for single-page applications (SPAs)?. That said, if all your using is messages, material and animation, those should be the only components you need to add to the project and so you shouldn't be bringing in anything more than is required, such as angular routing. Hope this helps!
Has anyone used both AngularJS and Vaadin within the same application? For instance, AngularJS pages that have no Vaadin code whatsoever. This is an unusual situation, I know, but just curious. I'm wondering about the security implications in particular.
Thanks.
You can maybe try to embed Vaadin into Angular through a div or iframe (both approaches are available and described in the book of vaadin):
Embedding Vaadin
or (and haven't tried this) you can probably use a custom layout in vaadin (HTML view) with an angularjs app in it:
Custom Layouts
If the pages (URL's) are different, then you can just use the correct mappings in your servlet engine.
If you need a interation on page level, then you will have to either embed vaadin in angular or vice versa.
How you can embed vaadin in other html pages is described in the book of vaadin.
I don't know of a way to integrate angular in Vaadin, but this does not mean that none exists.
There is a Vaadin add-on available (that I did help writing) that allows embedding AngularJS into Vaadin - i.e. have a Vaadin control whose contents are implemented as AngularJS. All communication follows Vaadin's principles - so there should not be significant differences in terms of security, behavior, etc.
Hope it's helpful 4u - here's the link: https://vaadin.com/addon/vaangular
Please help me understand the following quotes from the Angular Material github and home page:
This project is in early pre-release. Angular Material is both a reference implementation of Material Design and a complementary effort to the Polymer project's Paper Elements collection.
The Angular Material Design project is a reference implementation effort similar to that provided in the Polymer project's Paper elements collection. This project provides a set of AngularJS UI elements that implement the material design system.
I understand that Polymer is a framework for web components, and that one piece of the project is the collection of paper elements. I do not understand how the two are related, or why Google is developing two strikingly similar, yet different projects.
Is angular material simply a port of Paper Elements to angular?
Are web developers to use Angular Material right alongside Paper Elements in their web apps?
Are the two eventually going to effectively become equivalent? (Angular Material being used by AngularJS developers & Paper Elements used by others?)
I think you should consider the fact that web components, polymer, material design, paper elements and angular are 5 distinct 'things'.
Web components is a group of 4 standards.
Polymer is a sugar syntax api on top of web components + some nice additional features.
Material Design is the latest style and interaction guide Google has announced and they are
replicating more consistently across all their interfaces..web/mobile/etc.
Paper Elements are just an implementation of material design using Polymer. At the ChromeDev Summit Polymer team commented they plan to move paper elements into its own domain to avoid the confusion. Same things about the polyfills, these have been moved to webcomponents.org.
Angular is a library with a much wider scope than polymer.
Angular Material is just another implementation of material design using Angular.
My point being...material design will be reimplemented in as many flavors Google has to generate interfaces.
Google has a history of competing projects. But Angular's team has announced they will be using web components as well in their 2.0 version which is on the works right now. Will they use polymer to create directives? who knows? maybe..
From the recent ng-conf 2015 announcements it's clear that Angular 2.0 will have a new syntax and implementation to write Web Components spec based Custom Components (Directives).
Also, Angular-Material team has announced that post 1.0, they'll be porting it to Angular 2.0.
Hence, integration of Angular-Material and Polymer isn't in sight...Though, the good thing is that coz they're both based on Web Component Spec, they play well together, meaning that either can be used in an Angular App...
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.