AngularJS and Vaadin in the same application - angularjs

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

Related

Angular material template website

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.

How to structure and architect an angularjs application

I am trying to develop an angularjs based web app but I am a little bit confused on how should I structure my app. For example I am used on using JSP pages when it come to the front end so for example every different component is a different jsp page let's say a home page, contact page etc. My question is what is the suggested way to do so in angularjs since the angularjs should be a single page web app should I create my content in directives and depending on the flow hide or show other directives or what ?
Any direction or suggestions for reading will be more than appreciated !
I highly recommend to you reading about Angular Style Guide made by John Papa.
View Angular Style Guide here
It's a very helpful guide which provides Angular best practices to deliver a testable, scalable and extensible app.

Is github coded using angularJS in the front-end

Just really curious about this,is github coded using angularJS in the front-end? I've noticed that the pages almost never reload, just a bunch of behind the scene requests. It acts more of a web app than a web page.
I don't have anything to do with this site, but I believe it serves your purpose:
http://builtwith.com/github.com
It allows you to enter any site, and it attempts to scrape production details for you.
No, you can see by yourself:
Angular.js is just a very good framework around javascript, whatever you can do with angular you can do with vanilla javascript or with other framework (but with more pain).
They use "PJAX" for the seamless transitions:
pjax is a jQuery plugin that uses ajax and pushState to deliver a fast browsing experience with real permalinks, page titles, and a working back button.
https://github.com/defunkt/jquery-pjax
(seems its now pjax2: https://github.com/github/pjax)
Github uses github so you can check out a lot of their libraries at https://github.com/github

Choosing library for UI widgets for mobile 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.

Angular 2 and google closure

I know this question is off topic. But I think it would be hot topic.
Google has two Web UI project, both Angular 2 and Google closure. Could someone give hints if we want to develope data centric application which tool we shall use, Angular 2 or Google closure?
Your answer are highly appreciated.
[2016/April/11] added:
I mean Closure Library. Mostly many of our UI components are Grid. Our developers are Java developers,they are not that good at Javascript. Could we make Grid UI or other UI, (http://dekajp.github.io/demos/index.html) into some template, then render template into Java?

Resources