Start dart

7,101 views

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
7,101
On SlideShare
0
From Embeds
0
Number of Embeds
5,766
Actions
Shares
0
Downloads
11
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Start dart

  1. 1. Let’s start DartDartをはじめよう。@mogetta
  2. 2. How about DartClassesOptional typesLexical scopinghttp://www.dartlang.org/docs/technical-overview/
  3. 3. Installbrew install dartorcommand linehttp://www.dartlang.org/導入
  4. 4. Installhttp://www.dartlang.org/tools/http://plugins.jetbrains.com/plugin/?idea&id=6351 https://github.com/dart-lang/dart-sublime-bundle#readme https://github.com/dart-lang/dart-vim-plugin導入
  5. 5. be useful使い道on Dartium Server side[dart2js]convert to jsfast! like node.js?wide useful
  6. 6. Syntaxtry!!!http://try.dartlang.org/compare other languagehttp://synonym.dartlang.org/文法class Dot {num x, y;Dot(this.x, this.y);String toString() => "($x,$y)";}void main() {var p = new Dot(3, 4);var q = new Dot(5, 6);print(p);}entry pointoptional typeshort hand
  7. 7. <!DOCTYPE html><html>  <head>    <title>Hi Dart</title>  </head>  <body>    <h2 id="status">Waiting for Dart to start</h2>    <script type="application/dart" src="hi.dart"></script>    <script src="dart.js"></script>  </body></html>library hi;import dart:html;main() {  query(#status).text = Hi, Dart;}<!-- Copyright (c) 2012, the Dart project authors.  Please see the AUTHORS file     for details. All rights reserved. Use of this source code is governed by a     BSD-style license that can be found in the LICENSE file. -->Exampleサンプル
  8. 8. dart2jsDartコードをjavascriptに変換する。変換後のデバッグもソースコードの書き換え等は必要なし。jsのcontextをDartで扱うライブラリもある。javascriptへの変換http://www.dartlang.org/docs/dart-up-and-running/contents/ch04-tools-dart2js.htmlchrome
  9. 9. Package manager for Dartname: channelDartdependencies:appengine_channel: anyjs: anycolor_picker: anyライブラリpub install
  10. 10. Server sideimport dart:io;main() {HttpServer.bind(127.0.0.1, 8080).then((server) {server.listen((HttpRequest request) {//request.uri.pathrequest.response.write(Hello, world);request.response.close();});});}サーバーサイド
  11. 11. Server sidehttp://dartvoid.com/http://www.dartlang.org/articles/io/#writing-web-servershttp://pub.dartlang.org/packages/routeサーバーサイド
  12. 12. Testunit testhttp://www.dartlang.org/articles/dart-unit-tests/drone.io[本家]https://drone.io/[導入]http://muzigram.muzigen.net/テスティング
  13. 13. web_ui<html>のパーツ化データの変化によるViewの変化駆動http://www.dartlang.org/articles/web-ui/MDV and Web Component
  14. 14. web_ui Model Driven View// Dart code:import package:web_ui/web_ui.dart;@observable String myString = ;String get shouted => myString.toUpperCase();String get palindrome =>myString + myString.split().reversed.join();<!-- HTML code: --><input type="text" bind-value="myString"placeholder="Type here"><div> Shouted: {{shouted}} </div><div> Palindromic: {{palindrome}} </div><script type="application/dart"src="little.dart"></script><script src="packages/browser/dart.js"></script>MDV and Web Component
  15. 15. Web_ui Example<b-secret placeholder="Enter your Password"></b-secret>https://www.blossom.io/beeMDV and Web Component
  16. 16. Web_uicreate project resultMDV and Web Component
  17. 17. Reccomend PackagesJShttp://pub.dartlang.org/packages/jsWeb component partshttps://www.blossom.io/beeflash like APIhttp://pub.dartlang.org/packages/stagexlsupport game createhttp://pub.dartlang.org/packages/game_loopおすすめのパッケージ
  18. 18. Thankshttp://muzigram.muzigen.net/search/label/darthttp://www.iconfinder.com/@mogetta

×