Recommended
More Related Content
What's hot
What's hot (20)
Similar to Frontend Fantasy 〜ミスリルの戦士たち〜
Similar to Frontend Fantasy 〜ミスリルの戦士たち〜 (20)
Frontend Fantasy 〜ミスリルの戦士たち〜
- 1. NDS IN NIIGATA MEETUP #8 ミスリルの戦士たち FRONTEND FANTASY
- 3. // me.json { “name”: “松井 正志”, “kana”: “まつい まさし”, “company”: “water-cell inc.”, “role”: [ “フロントエンドエンジニア”, “サーバーサイドエンジニア” ], “twitter”: [“@circled9”, “@ma_2_i”] } 33
- 4. Agenda • Introduction • Feature • Architecture • Tutorial • Etcetera • Conclusion 4
- 8. AngularJS 8
- 11. どれを使うべき？ 11
- 12. RailsとSinatra 12
- 15. 15 Mithril
- 16. Feature 16
- 20. けんじつ Robust 20
- 21. デフォルトで安全 21
- 22. コンポーネントによる分割 • Reactみたいに部品を組み合わせてViewを作る • 部品の再利用がしやすい • Fluxみたいな仕組みはなので、極力子コンポーネ ントはステートレスにするとよい 22
- 23. 割と堅実な方針 • しっかりとしたドキュメント • 今のところ互換性無視の破壊的なアップデートもな い模様 • 実装面でも、例えばRouterはIE8でも動くような モードが用意されている 23
- 24. はやい Fast 24
- 25. Virtual DOM • Reactなどと同じ仮想DOMによる差分更新 • 実装の仕方も仮想DOMありきの実装になる 25
- 26. 頭のいい再描画 • いろいろなイベントをトリガーにして更新をする • クリックとか通信終了とか • データに変更がおきるタイミングは大体その辺と いう考え方 26
- 27. 速度の比較 27
- 28. Architecture 28
- 29. Architecture • Model • View Model • View • Controller 29
- 30. Architecture 30 Component Controller View View Model Model Component Controller View View Model 30
- 32. Model • 普通のJavaScriptオブジェクト • 責務はビジネスモデルのカプセル化 • m.prop()でgetter-setterを作る 32
- 33. Model View • 普通のJavaScriptオブジェクト • 責務はビューに関するロジックなどのカプセル化 • ビューのステートを保持したり、変更内容をモデル に反映したりする 33
- 34. View • ビューは関数として実装する • 責務は表示とモデルのバインディング • function() { return m(“div”) } みたいな感じで 定義していく。 34
- 35. Controller • コントローラーは関数として実装する • 責務は各レイヤーの初期化など • 一般的なMVCのコントローラーのように、ユー ザーの入力の取り扱いなどはしない 35
- 36. Architecture (再掲) 36 Component Controller View View Model Model Component Controller View View Model 36
- 37. Tutorial 37
- 39. (CDNでもいいです) 39
- 40. HTMLを作る 40
- 41. 41
- 42. コンポーネントを作る 42
- 43. 43
- 44. 44
- 45. ビューのモックを作る 45
- 46. 46
- 47. ビューモデルを作る 47
- 48. 48
- 49. 49
- 50. ビューの動作を作る 50
- 51. 51
- 52. 52
- 54. 54
- 55. 55
- 56. 56
- 57. Etcetera 57
- 58. Routing • Routerも用意されている • URL表記が違う3つのモードがある • search / hash / pathname 58
- 62. Conclusion 62
- 63. ミスリルはミニマム 63
- 65. JSあるある 65
- 67. どうしてこうなった 67
- 68. 68
- 71. もうビルドやめよう？ 71
- 72. もうES５で書こうよ 72
- 74. （異論は認める） 74
- 76. 76 Mithril
- 78. References 78
- 79. 公式サイト 79
- 80. オライリーのミスリル本 80
- 81. 81 おしまい