Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Start dart

7,320 views

Published on

  • Dating for everyone is here: ❤❤❤ http://bit.ly/39pMlLF ❤❤❤
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

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

×