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.

TypeScriptで作る型安全FirefoxOSアプリ

3,797 views

Published on

関東Firefox OS勉強会 2nd

Published in: Technology
  • Be the first to comment

TypeScriptで作る型安全FirefoxOSアプリ

  1. 1. TypeScriptで作る 型安全FirefoxOSアプリ 2013/7/19 関東Firefox OS勉強会 2nd ぷろぐれ
  2. 2. アジェンダ • 自己紹介 • なぜTypeScriptなのか • 実際のコードとデモ CreateJSも使って ゲーム?を作ってみまし た
  3. 3. 自己紹介 • ぷろぐれ @progremaster • HP: http://www.prgrssv.net • 新卒3年目 • C#とかJavaとかが好き モバイルはほとんどやってない • PeerCastというストリーミング配信ソフトで ライブコーディング配信を5年くらいやっています。 http://dp.prgrssv.net ライブコーディングをやっていただける プロい方を探しています
  4. 4. なぜTypeScriptなのか
  5. 5. @dynamitter http://www.slideshare.net/dynamis/firefox-os-app- dev
  6. 6. FirefoxOSのアプリ JavaScriptです。 JavaScriptです。 JavaScriptです。 大事なこと3回
  7. 7. JavaScript 他のモバイルアプリの言語と違う 使いにくい • 型がない • クラスがない • 即時関数 • その他落とし穴多数 エンバグしやす い 柔軟すぎる Javaと か Objective-Cとか C#とか
  8. 8. JavaScript JavaScript 怖い ↓ Webアプリ怖い ↓ FirefoxOSアプリ怖い 何とかできないか?
  9. 9. • CoffeeScript • Haxe • JSX • Dart altJS altJS = コンパイルしてJavaScriptになる言語 型が無い… 型はあるけど 別言語… • TypeScript
  10. 10. なぜTypeScriptなのか • APIが完全互換・構文が上位互換(一部ES6互換) • JavaScriptのノウハウが活きる • 型付き • エラーチェックで品質を底上げできる • インテリセンス(入力補完) class Xxxx { ... } () => { ... } Visual Studio WebStorm 他
  11. 11. 互換性 型 付 き API 構文 CoffeeScript ○ × × Haxe × △ ○ JSX △ △ ○ Dart × × ○ TypeScript ○ ○ ○ なぜTypeScriptなのか
  12. 12. なぜTypeScriptなのか • その他 • アンダース・ヘルスバーグ氏率いるMicrosoftが開発 • 出力JavaScriptが美しい • 良いJavaScriptコードのお手本レベル • Node・RequireJSのモジュールを出力可能 • ゆるいinterface Delphi C#の父
  13. 13. 実際のコードとデモ TypeScript/CreateJS+RequireJS パッケージ型アプリ
  14. 14. プロジェクト ディレクトリ FirefoxOSアプリ TypeScript 型定義 (C言語の ヘッダーに相当) ビルド設定 テスト用Webサーバー (割愛) https://github.com /progre/hiyokorun
  15. 15. TypeScript JavaScript
  16. 16. デモ https://marketplace.firefox.com/app/chickens-race/
  17. 17. 所感 • 型があると安心 • VisualStudioのバグ • メモリリーク・型情報の引き当て • Webアプリそのまんま過ぎ • この勉強会何の勉強会だっけ? V1.0に期待!
  18. 18. まとめ TypeScript = 型があってクラスがあって怖くないJavaScript ↓ Webアプリ怖くない! ↓ FirefoxOSアプリ怖くない!
  19. 19. 参考資料 • altJS - Web coding without JavaScript. • http://altjs.org • Top Languages · GitHub • https://github.com/languages/ • ES Wiki • http://wiki.ecmascript.org/doku.php • TypeScript • http://www.typescriptlang.org/
  20. 20. 参考資料 • JavaScriptを書くならTypeScriptを使え! - 部屋とボー ドゲームと私と酒と泪と男と女 • https://sites.google.com/site/jun1sboardgames/programming/typescript • TypeScriptクイックガイド • http://phyzkit.net/typescript/index.html • AngularJS+TypeScript • http://www.slideshare.net/vvakame/angularjs-1year?from_search=11
  21. 21. ご清聴ありがとうございました

×