Your SlideShare is downloading. ×
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
No JS and DartCon
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

No JS and DartCon

1,631

Published on

No JS + Dart presented in Barcamp Bangalore 13

No JS + Dart presented in Barcamp Bangalore 13

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,631
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • What is Dart?, Oreilly Publications
  • What is Dart?, Oreilly Publications
  • Transcript

    • 1. No JS + Intro to DartCon Dart @Author Anand Shankar @Presented
    • 2. What is DartDart is a new open source web programminglanguage developed by Google. It was unveiled atthe GOTO conference, October-2011.Dart helps developers to build structuredmodern web apps.
    • 3. Goal of DartThe goal of Dart is ultimately to replaceJavaScript as the lingua franca of web developmenton the open web platform.Dart is a class-based, object-oriented languagewith lexical scoping, closures, and optional statictyping.
    • 4. Why Did Google Create Dart?Engineers at Google have been thinking about webapps for a long time. We’ve writtena bunch of complex and widely used large-scaleweb apps (think Gmail, Google+, and Google Docs),so we’re quite familiar with the challenges ofarchitecting web apps.
    • 5. Why Did Google Create Dart?We’ve also written a browser (Chrome) and aJavaScript engine (V8), so we’ve thoughta lot about how to make web apps run faster.Basically, we created Dart because we think it’llhelp bring more great apps to the web,and we think it should be easier to create morecomplex web applications.
    • 6. Advantages of Dart over JavaScriptGood point is that it has native support.A very critical issue with JavaScript is handlingconcurrency. Dart has "isolates": these are used forhandling concurrency.
    • 7. Coding difference between JavaScript and Dart
    • 8. Code embedding JavaScript Dart<script • <script src=‘myscript.js></script> type=application/dart src=myscript.dart></script > • To load JS for non-dartium <script src=“packages/browser/dar t.js” ></script>
    • 9. Entry point JavaScript Dart• Not required • REQUIRED – main() { }
    • 10. Code modularity JavaScript Dart• No native implementation • Defining library – library bcb; class BCB13 { hello() => ‘Hello BCB 113’; } • Using library – import(‘bcb.BCB13); var msg = new BCB13();
    • 11. Function JavaScript Dart• function fun(a, b, c) { return • fun(a, b, c) => c; c; }; – fn(1); – fun(1) Result=ERROR:NoSuchMethodE Result= undefined xception – fn(1, 2, 3); – fun(1, 2, 3) Result= 3 Result= 3 • Optional parameters – fn(a, [b, c]) => c; – fn(a); Result= null
    • 12. For Each Loop JavaScript Dart• Not available • data.forEach((key, value) { print(${key}, ${value}); });
    • 13. Classes JavaScript Dart• function BCB(){ • class BCB {this.name=null; var name;}; greet() => Hello, $name; }BCB.prototype.greet=function( ){return ‘Hello, ‘ + this.name;}
    • 14. Constructors JavaScript Dart• function BCB(x) { • class BCB {this.x = x; var x;}; BCB(x) { this.x = x; }} • In short class BCB { var x; BCB(this.x); }
    • 15. Inheritance• JavaScript• function Person(name) {this.name = name;}• Person.prototype.greet = function() { return Hello, + this.name;}function Employee(name, salary) { Person.call(this, name);this.salary = salary; }
    • 16. • Employee.prototype = new Person(); Employee.prototype.constructor = Employee; Employee.prototype.grantRaise = function(percent) {this.salary = (this.salary * percent).toInt(); }
    • 17. • Dart• class Person {var name;Person(this.name);greet() => Hello, $name; }
    • 18. class Employee extends Person { var salary;Employee(name, this.salary) : super(name);grantRaise(percent){ salary = (salary * percent).toInt();} }
    • 19. Advance for loop JavaScript Dart• Not available • For( var x in list) { print(x); }
    • 20. Manipulating DOM JavaScript Dart• var element = • var element = new document.createElement(p Element.html(<p>Hello BCB ); <em>12</em>.</p>);• element.innerHTML = ‘Hello BCB <em>12</em>.;
    • 21. Exceptions Handling JavaScript Dart• try { undefinedFunction(); • try } catch(e) { { Math.parseInt("three"); }if (e instanceof catch(BadNumberFormatEx ReferenceError) ception bnfe) { { console.log(You called a print("Ouch! Detected: function that does not $bnfe"); exist); } } }catch(var e) {finally { console.log(This runs print("If some other type of even if an exception is exception"); } thrown); } finally { print("This runs even if an exception is thrown"); }
    • 22. Ajax• JavaScriptvar client = new XMLHttpRequest; client.onreadystatechange = function() {if (this.readyState == 4) {processData(this);}}
    • 23. client.open(GET, data.json); client.send();function processData(request) {console.log(The contents of your data: + request.responseText);}
    • 24. • DartHttpRequest.request("/data.json“).then(req) { print("The contents of your data: $ {req.responseText}"); });
    • 25. DartConDartCon is a Dart to JavaScript and JavaScript toDart converter. Find the DartCon and it’s Source Code https://github.com/ashankar/dartcon
    • 26. Demohttp://www.altermediguide.comhttp://www.openestartup.comhttp://www.ekisaan.comhttp://kevmoo.github.com/qr.dart/
    • 27. Demohttp://threedart.github.com/three.dart/example/canvas_geometry_hierarchy/Canvas_Geometry_Hierarchy.htmlhttp://threedart.github.com/three.dart/example/webgl_geometries/WebGL_Geometries.htmlhttp://jimmypettersson.eu/dev/dart/spaceinvaders/SpaceInvaders.htmlhttp://dart-lang.github.com/pop-pop-win/http://www.dartflash.com/games/escape/escape.html
    • 28. Referenceshttp://www.dartlang.orgWhat is Dart?, Oreilly Publications
    • 29. Questions ?
    • 30. Thanks Anand ShankarE-mail: com@ashankar.com Twitter: anandvns Facebook: anandvns

    ×