Dart News & Updates

Dart engineer John Messerly announces the launch of polymer.dart, a port of the  Polymer stack . The Web UI package will be maintained for some time, but will eventually be replaced by polymer.dart. Here is John's  original post introducing polymer.dart : Hello Dartisans, Since we started Web UI, we've had a goal to bring the latest web standards like Web Components and Model-Driven Views to Dart developers. There have been some great developments since we started: Web Components has progressed into a set of detailed specs ( Custom Elements , Shadow DOM , HTML Templates , HTML Imports ) with interest and implementation by multiple browser vendors. Model-Driven Views has new APIs ( Node.bind , TemplateElement.model ) that allow custom elements to participate in the binding system, as well as the ability to plug in custom syntax, such as the fancy_syntax package. dart:mirrors is now implemented in dart2js! Last but not least: the development of the Pol...

The Angular team recently announced a Dart port of the popular Angular.js framework. Large parts of Angular functionality — components like $compiler and $scope, basic directives like ngBind and ngRepeat — have already been ported over to Dart and can be used today.  Other c ritical Angular parts like Dependency Injection and Routes are being ported now.  Karma, the Angular test runner, already works with Dart. Angular team members Brad Green  and  Igor Minar  provide details in the video from the AngularJS meetup this week . The Dart-specific discussion begins at the 40 minute mark.

The wildly successful Bootstrap project, which helps web developers build responsive designs for web apps, has been ported to Dart's Web UI library . This means the dynamic widgets like accordion, carousel, tabs, and more, are reborn as actual web components. The Dart Widgets library has all the code, and you can easily install it from pub . With real encapsulation, you can now use custom components that contain the structure, style, and behavior of the widget. For example, instead of using div elements with special classes and requiring another script to make it all work, you can simply use <x-accordion> which contains everything you need. Here is an example: <x-accordion>   <x-collapse>     <div class="accordion-heading">       <a class="accordion-toggle" data-toggle="collapse">Item 1</a>     </div>     <p>Item 1 content - Lorem ipsum</p>   </x-collapse...

The  Game of Dart tutorials  provide a gentle introduction to building web applications using the Dart language, tools, and APIs.   In the latest tutorial , l earn how to make custom DOM elements using the <element> tag, use data binding to connect Dart variables to content, and attach event handlers in HTML using the Web UI package.  As always, we invite you to join our  Dart mailing list , ask questions on  Stack Overflow , or file feature requests on  dartbug.com .

If you've been waiting for the right time to learn how to use Web Components in Dart, now's your chance! Continuing where we left off with the Google IO 2012 Dart Codelab , I've created a Dart Web UI Codelab which focuses on Web Components and the new Web UI library. In this codelab, I cover: How to set up pub How to use Web Components How to use dynamic templates and two-way data binding (inspired by Model-driven Views) How to build an application with multiple Web Components Where to get more information about Web Components and the Dart Web UI package What to do if you get stuck while trying to build an app using the Dart Web UI package We've already created videos , blog posts , and articles about how to use Web Components in Dart, but this codelab is pretty exciting in that it walks you through building a complete, albeit small, application using Web Components and the Dart Web UI library. So give it a try and tell us what you think! We invite...