Get Started for FREE
Sign up with Facebook Sign up with X
I don't have a Facebook or a X account
 Your new post is loading...
Your new post is loading...
Scoop.it!
In this project I want to compare the usage and development of components in several frameworks. To test these frameworks I'll create multiple components from simple to complex to show the differences between these frameworks. I currently plan to look into the following frameworks: 
No comment yet.
Sign up to comment
Scoop.it!
So why would you want to put a Web Component in an app built with one of these frameworks? Web Components let you create elements that apps can interface with in the same way that they already interface with native elements. That means that a Web Component can be reused anywhere, in any framework. That’s the theory, at least. Let’s try it out. We’ll just be looking at Custom Elements, the heart of Web Components.
Scoop.it!
An important part of compontent-based development is that components can be composed out of other components. The rich text editor is a great example of this since it will be composed out of buttons, drop downs, some sort of rich view and so on. Another good example is the HTML5 video element which again contains buttons and also an element which renders content from a video data stream.
Scoop.it!
From
github
The angular-bind-polymer library is an Angular directive that enables Angular to bind scope variables to custom element attributes. So if my Angular code has an answered variable in the current scope, I can bind it to a Polymer custom element by injecting the angular-bind-polymer library and assigning the bind-polymer attribute to the custom element: <x-double bind-polymer in="2" out="{{answer}}"></x-double>
Scoop.it!
Brian Ford shows the use of ES6 Modules and Web Components used by templates in AngularJS. Also it is shown how object.Observe could replace $apply.
Scoop.it!
Web Components [1] are an upcoming standard for custom HTML5 user interface elements. Those UI elements will eventually become interchangeable between frameworks. Now the people behind AngularJS and Ember.js have described their plans for supporting Web Components. Below, you’ll see mentions of Google’s new framework, Polymer [1]. It is built directly on top of Web Components. One of Polymer’s goals is to help refine and fully figure out that standard.
|
Scoop.it!
Most modern front-end JavaScript frameworks provide some sort of support for component based development. This is an incredibly important step in the direction of development for the web. Components provide a way to write small parts with a consistent API that can easily be orchestrated as part of a larger screen, application or system. Component based development isn’t just the future of the web, though. It’s what you should be doing now, in any modern UI / application framework on the web.
Scoop.it!
Architecting your Angular application with reusable components can be complicated. Many times, UI components that need multiple entry points for user markup and the standard ng-transclude do not do enough of what is required. Using Web Component standards, like the Shadow DOM, we can now enable our applications to easily handle this.
Scoop.it!
A year after pulling back the curtains on the Polymer Project, Google’s taken part of I/O 2014 to demo what the code can do. Right on cue, the web is abuzz with discussion comparing Polymer to other popular web frameworks, and it’s no surprise since it bears some resemblance to Google’s very own AngularJS. Join me after the break as I introduce Polymer and explore just how it relates to Angular.
Scoop.it!
When I read Atomic Product Development a few weeks ago, it was a lightbulb moment for me. It managed to finally put words (and code!) to the handful of loose ideas that had been rattling around my head for the better part of a year. I've started contributing to the project, and you'll undoubtedly hear more about it from me in the future, but I thought it might be helpful to first show a basic application of the concepts to AngularJS. Therefore, the challenge I've spent the last couple of weeks solving is how to utilize that foundation in the context of AngularJS. As it turns out, it's actually pretty simple.
Scoop.it!
Yehuda Katz recently gave a talk entitled "The Future of the Client-Side Web" in which he detailed the current challenges that web standards bodies face when trying to design APIs for web developers to use. In this talk, Yehuda also highlighted Google's recently announced Polymer Project as a good example of the right way to push the web platform forward. Polymer provides a "low enough" level API that gives web developers the power to redefine the way they write markup using the power of newer features coming to JavaScript in ES6. The specifics of the implementation aren't relevant to what I want to say here, but Yehuda does a great job covering the details at a high level in the video; I suggest you watch it if they interest you.
|
