Overview: Web Libraries

Send feedback

What kind of support is available for web programming in Dart? Where can you learn more?

Angular

Learn from the Angular docs. You can also follow two code labs:

JS interop

To leverage one of the many existing libraries written in JavaScript, use package:js to implement Dart-JavaScript interoperability. If a a TypeScript types definition file exists for a JavaScript library (see DefinitelyTyped for more info), you can use the js_facade_gen tool to generate Dart code for that library.

For examples of using package:js, see the following source code:

firebase3
Dart wrapper library for Firebase
captains_log_final
Example includes lib/quill.dart generated from Quill.js
chartjs
Dart API for Chart.js

Low-level HTML

The GUI for a web app is programmed in HTML and is represented in the browser by a tree structure called the Document Object Model (DOM). Understanding how the DOM works is important for developing a deeper understanding of HTML concepts. Use the dart:html library to modify the DOM programmatically.

Once you’re ready to develop complex applications that support event handling and dependency injection, for example, you’ll want a more powerful solution, such as Angular 2 for Dart.

For an introduction to low-level DOM programming, check out the original Pirate code lab. The low-level HTML tutorials have further information on how to include a Dart script in an HTML page, and how to add and remove elements from a web page. The Improving the DOM article gives an overview of Dart’s DOM API, and how it differs from the JavaScript DOM API.

Other libraries

You’re free to use whatever open-source libraries you like when creating web apps. For example, you can use Polymer elements.


Also see the FAQ.