React, Flux, GraphQL, Hack, HHVM...? All of this and more!
With Angular 2, React, Vue as well as native Web Components being a common sight on the web, there is a real danger of being essentially rounded in a single framework or pay a significant overhead for downloading multiple frameworks. Perhaps mixing React and Angular2 on the same site is not feasible, but with YouTube adopting Web Components you're bound to be mixing React or Angular with those.
To enable interoperability the the angular2-polymer package is a directive factory that aims to bridge the gap between using Angular 2 and Web Components using the Polymer Library. The implementation essentially scrapes the Polymer 2 element API to define the outputs and inputs (data inlets and outlets in Angular2 slang) as well as observes the DOM structure.
As usual the package is available for download on NPM and a comprehensive tutorial based on the Tour of Heroes tutorial:
For this purpose, we show how to create a staff management application similar to the Tour of Heroes example. But unlike in the Angular 2 Tour of Heroes, instead of implementing the UI elements in place, we will use the ready-made UI elements that are built on top of the Web Components technology stack. The resulting application will have a nice-looking mobile-first Material designed UI.Tweet
- Angular 2 with Polymer Elements Tutorial