Upload
jana-moudra
View
2.071
Download
1
Embed Size (px)
Citation preview
Dart, Darrt, Darrrt
Jana Moudrá @Janamou +JanaMoudrá
Website?. This cannot be difficult....
How to do it?.
Web Developer
LanguageDev Editor
Great Tools
JavaScriptjQuery
Node.jsCofeeScript
ReactJS...
Sublime TextWebStorm
EclipseNetbeans
Notepad
...
...
bowernpm
jamvolo
...
Which. should I use?.
LanguageDev EditorGreat Tools
LanguageDev EditorGreat Tools
LanguageDev EditorGreat Tools
LanguageDev EditorGreat Tools
LanguageDev EditorGreat ToolsPerformance
LanguageDev EditorGreat ToolsPerformance
And more...
Language
Languageis easy to learn
Open-sourceFor better performance
Object orientedModular
Client and Server!.
Client and Server!. Command Line Chrome Packaged App.
var x = 10;
var y = 20;
Optional Types
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;
Animal(this.numberOfLegs, this.numberOfHeads);
}
void main() {
Animal dragon = new Animal(4, 1);
}
Syntactic sugar
class Animal {
int numberOfLegs;
int numberOfHeads;
String name;
Animal(this.numberOfLegs, this.numberOfHeads);
Animal.withName(this.name);
}
void main() {
Animal dragon = new Animal.withName("Pepa");
}
Named constructors
class Animal {
int numberOfLegs;
int numberOfHeads;
String _name;
Animal(this.numberOfLegs, this.numberOfHeads);
Animal.withName(this._name);
String get name => "$_name is the best";
set name(String name) => _name = name;
}
Getter and Setter
Tools
Toolswe have them
Dart Editor DartiumDart SDK
Dart SDKDart VMLibraries
Command Line Tools
DartiumChromium with Dart VM
Modern BrowsersCompiled 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");
}
pub.
name: todolist
description: "My TODO list!"
dependencies:
browser: any
polymer: any
vector_math: any
pubspec.yaml
Libraries on Pub
polymer, angular, route, route_hierarchical, googleapis, chrome,
json_object, vector_math, appengine, ...
and more on pub.dartlang.org!
Dart is on the cloud!.
Demo
+
Client Server
void main() { ...}
void main() { runAppEngine(reqHandler);}
Client Server
class Note extends Model { ...}
class Note extends Model { ...}
DartIs easy to learn
DarrtHas great tools
DarrrtYou can write awesome apps
12:30Dart Code Lab
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