Dart, Darrt, Darrrt

Dart, Darrt, Darrrt
Jana Moudrá @Janamou +JanaMoudrá

Website?.
This cannot be difficult....

Web Developer
Language
Dev Editor
Great Tools

JavaScript
jQuery
Node.js
CofeeScript
ReactJS
...

Sublime Text
WebStorm
...
Eclipse
Netbeans
...
Notepad

Language
Dev Editor
Great Tools

Language
Dev Editor
Great Tools
Performance

Language
Dev Editor
Great Tools
Performance
And more...

Open-source
For better performance
Object oriented
Modular

Client and Server!.
Command Line Chrome Packaged App.

Optional Types
var x = 10;
var y = 20;
num x = 10;
num y = 20;
or

void main() {
print("Hello World Dart!");
}
main() function

void main() {
var myButton = querySelector("#my-button");
myButton.text = "Open Window";
myButton.style.background = "pink";
myButton.style.fontFamily = "Comic Sans MS";
myButton.onClick.listen(openWindow);
}
Cascade operator

void main() {
querySelector("#my-button")
..text = "Open Window"
..style.background = "pink"
..style.fontFamily = "Comic Sans MS"
..onClick.listen(openWindow);
}
Cascade operator

class Animal {
int numberOfLegs;
int numberOfHeads;
Animal(int numberOfLegs, int numberOfHeads) {
this.numberOfLegs = numberOfLegs;
this.numberOfHeads = numberOfHeads;
}
}
Syntactic sugar

class Animal {
int numberOfLegs;
int numberOfHeads;
Animal(this.numberOfLegs, this.numberOfHeads);
}
Syntactic sugar

class Animal {
int numberOfLegs;
int numberOfHeads;
}
void main() {
Animal dragon = new Animal(4, 1);
}
Syntactic sugar

class Animal {
int numberOfLegs;
int numberOfHeads;
String name;
Animal.withName(this.name);
}
void main() {
Animal dragon = new Animal.withName("Pepa");
}
Named constructors

class Animal {
int numberOfLegs;
int numberOfHeads;
String _name;
Animal.withName(this._name);
String get name => "$_name is the best";
set name(String name) => _name = name;
}
Getter and Setter

Dart SDK
Dart VM
Libraries
Command
Line Tools

Dartium
Chromium with Dart VM

Modern Browsers
Compiled into JavaScript

Dart Libraries
dart:async, dart:collection, dart:convert,
dart:core, dart:html,
dart:indexed_db, dart:io, dart:isolate, dart:js,
dart:math, dart:mirrors, dart:profiler,
dart:svg, dart:typed_data,
dart:web_audio, dart:web_gl,
dart:web_sql

dart:js
<script type="text/javascript">
var Person = function(name, surname) {
this.name = name;
this.surname = surname;
this.sayHello = function(){
alert("Hello!");
}
};
</script>

dart:js
import 'dart:js';
void main() {
var person = new JsObject(context['Person'],
["Jana", "Moudra"]);
print(person["name"]);
print(person["surname"]);
person.callMethod("sayHello");
}

pubspec.yaml
name: todolist
description: "My TODO list!"
dependencies:
browser: any
polymer: any
vector_math: any

Libraries on Pub
polymer, angular, route,
route_hierarchical,
googleapis, chrome,
json_object, vector_math,
appengine, ...
and more on pub.dartlang.org!

void main() {
...
Client Server
}
void main() {
runAppEngine(reqHandler);
}

class Note extends Model {
...
Client Server
}
class Note extends Model {
...
}

Darrrt
You can write awesome apps

Thank You!
Questions?
Jana Moudrá @Janamou +JanaMoudrá

Image credits
● Tim Regan, cc, https://www.flickr.
com/photos/27141279@N00/10481690626
● reynermedia, cc, https://www.flickr.
com/photos/89228431@N06/11285592553/
● jenny downing, cc, https://www.flickr.
com/photos/7941044@N06/3990391143/
● kevin dooley, cc, https://www.flickr.
com/photos/12836528@N00/7922047866/
● monkeywing, cc, https://www.flickr.
com/photos/9887585@N08/7584708186/
● Gregor Cresnar, https://www.iconfinder.
com/icons/304602/apple_browser_computer_laptop_macbook_monitor_
notebook_screen_web_icon
● Jerry Low, https://www.iconfinder.
com/icons/286686/computers_servers_web_host_icon

Dart, Darrt, Darrrt

More Related Content

Dart, Darrt, Darrrt