TypeScript 勉強会
- 1. TypeScript 勉強会 @v vakame Saturday, January 26, 13
- 2. 俺の名前を言ってみろ わかめ まさひろ @v vakame GoogleAppEngine Android alterJS Saturday, January 26, 13
- 3. アンケート • JavaScriptバリバリです • Java+Servletバリバリです • Java+Androidバリバリです • C言語ならまかせろー！ • ハードウェアなら任せろー！ Saturday, January 26, 13
- 4. 今日の約束 • 話の途中でも質問して良い • 挙手はする • JavaScriptの質問でもまぁよし • Twitterをちょっと盛る • #tsjpstudy Saturday, January 26, 13
- 5. Webアプリの時代 • Webアプリがどんどんリッチに • Google Maps • GoogleApps • Facebook • 大規模開発の必要性 • コードたくさん • 関係者多数 • サーバの土管化 (JSON吐く機械) Saturday, January 26, 13
- 6. JavaScript sucks! • JavaScriptは確かに良い言語だよ • しかし腐ってる部分もクソ多い • packageとかnamespaceとかない • 綺麗なコード書ける＝上級者 • prototypeのOOP？？ナニソレ • 型( ﾟ!ﾟ)ｸﾚ 動的型付とかないわ • なのにブラウザ上で動くのはJSだけ Saturday, January 26, 13
- 7. TypeScriptって？ • Anders Hejlsberg開発 • MSのC#の作者 • JavaScriptに変換して実行する • ECMAScript6を意識 • 未来が来ないなら俺が行く！ • 現行ブラウザは 3.1 がほとんど • JavaScriptはイケてない！ Saturday, January 26, 13
- 8. TypeScript the Great • JSのSuperSet(上位互換)だよ！ • 全てのJSはTypeScriptである • 可読性の高い変換後JSコード • moduleあるよ！ • classもあるよ！継承もあるよ！ • 型もあるよ！ • 既存の資産も捨てなくて済むよ！ • TypeScriptはロックインもされない！ Saturday, January 26, 13
- 9. 型がある • リファクタリングした時安心 • IDEが賢くなる余地が大きい • シンボルのリネーム • メソッドシグニチャの変更 • 100%アクセス可能な要素のみ補完 • 作り始めた時 != 設計の決定 Saturday, January 26, 13
- 10. TypeScript以外は？ • まとめて alterJS と呼ばれるらしい • CoffeeScript • Dart • JSX • Haxe Saturday, January 26, 13
- 11. CoffeeScriptは？ • Better JavaScript • インデントベース • 可読性の高い変換後JSコード • Railsで標準採用 • classベースのOOP • 既存の資産も活かせる • TG社でもみんなが使ってる • 惜しむらくは型がない！ Saturday, January 26, 13
- 12. Dartは？ • Google先生が作ってる • 将来的にJavaScriptを完全に置き換え • 全く別言語からの変換 • 変換後JSはかなり読めない • Dartにロックインされる • IDEが並行で開発されている！！ • 言語仕様が後発のくせに芋っぽい Saturday, January 26, 13
- 13. JSXは？ • DeNAが作ってる • 動作速度最優先！強力な最適化！ • それなりにES6っぽい見た目 • 変換後JSはかなり読めない • 開発のリソースがちょっと足りなさげ Saturday, January 26, 13
- 14. Haxeは？ • OCamlで書かれている • 言語仕様的にはかなり美しい • 変換後JSはかなり読めない • 色々な言語に変換できる • 優秀なIDEがWindowsにしかない Saturday, January 26, 13
- 15. まとめ CoffeeScript 僕Python派閥なんで… Dart そもそもJavaScript捨てる予定だしー JSX お前に足りないものは情熱思想理念頭脳気品優 Haxe 僕JS以外にも狙い定めてるし僕の言語仕様 超美しいよ！なんてったってOCamlだしね！ TypeScript JavaScript後進の優等生ざます Saturday, January 26, 13
- 16. 残念ながら… JavaScriptわからずに開発できるほど甘くはないぜ JavaScriptも基本教養として学習しましょう。 TypeScriptを踏み台にするのは大アリ Saturday, January 26, 13
- 18. 既存資産の活用 • 型指定ファイルを作成 • xxx.d.ts という拡張子 • お手本はたくさんある • 普通のtsコンパイルで.d.tsの出力も • Roadmapでは0.9.xで集積サイトが Saturday, January 26, 13
- 19. TypeScript実装 • この後松崎さんから詳しく • TypeScriptはTypeScriptで書かれてる • コンパイラ = JavaScript • ブラウザ上でコンパイラが動く！ • Playground • あとまぁNode.jsでも動く Saturday, January 26, 13
- 20. 構造的部分型 • シグニチャあってればまぁいいか • interface Hoge { name: string } • function foo(hoge: Hoge) { ... } • foo({ name: “羊”}); // OK！ • このお陰で既存資産の活用が現実的 Saturday, January 26, 13
- 21. ライブコーディング！ • 時間ある？ • GAE/J&Slim3 + TypeScript&AngularJS • 作りかけのアプリに1機能追加してみる Saturday, January 26, 13
- 22. 参考 • G+ TypeScript • http://vvaka.me/U0LuCB • わかめはてブ • http://vvaka.me/WOYMmL • TypeScript クイックガイド • http://phyzkit.net/typescript/ Saturday, January 26, 13
- 23. 参考 • Playground • http://www.typescriptlang.org/ Playground/ • Spec • http://vvaka.me/UL7KUz • DefinitelyTyped • http://vvaka.me/WYHzGT • 今日の元ネタ • http://vvaka.me/VokmDn Saturday, January 26, 13