The document discusses the Dart programming language. It provides an overview of Dart, including that it is easy to learn, has great tools like Dartium and the Dart SDK, and can be used to write both client and server code. It also gives examples of Dart syntax like classes, constructors, getters/setters, and using the dart:js library to interact with JavaScript.

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

2. Website?.
This cannot be difficult....

3. How to do it?.

4. Web Developer
Language
Dev Editor
Great Tools

5. JavaScript
jQuery
Node.js
CofeeScript
ReactJS
...

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

7. bower
npm
jam
volo
...

8. Which.
should I use?.

10. Language
Dev Editor
Great Tools

11. Language
Dev Editor
Great Tools

12. Language
Dev Editor
Great Tools

13. Language
Dev Editor
Great Tools

14. Language
Dev Editor
Great Tools
Performance

15. Language
Dev Editor
Great Tools
Performance
And more...

16. Language

17. Language
is easy to learn

18. Open-source
For better performance
Object oriented
Modular

19. Client and Server!.

20. Client and Server!.
Command Line Chrome Packaged App.

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

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

23. 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

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

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

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

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

28. 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

29. 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

30. Tools

31. Tools
we have them

32. Dart SDK Dart Editor Dartium

33. Dart SDK
Dart VM
Libraries
Command
Line Tools

34. Dartium
Chromium with Dart VM

35. Modern Browsers
Compiled into JavaScript

36. 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

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

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

39. pub.

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

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

42. Dart is on the cloud!.

43. Demo
+

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

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

46. Dart
Is easy to learn

47. Darrt
Has great tools

48. Darrrt
You can write awesome apps

49. 12:30
Dart Code Lab

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

51. 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