backbone.jsの使用例 その1
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

backbone.jsの使用例 その1

on

  • 1,339 views

 

Statistics

Views

Total Views
1,339
Views on SlideShare
1,338
Embed Views
1

Actions

Likes
6
Downloads
5
Comments
0

1 Embed 1

http://s.deeeki.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

backbone.jsの使用例 その1 Presentation Transcript

  • 1. backbone.jsの使用例 その➀ @Spring_MT
  • 2. 自己紹介 @Spring_MT Infra and App Engineer
  • 3. backbone.jsとは? 一言でいうと。。。
  • 4. backbone.jsとは? Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface. ・http://backbonejs.org/より最初の一行目を抜粋
  • 5. backbone.jsとは? ・サーバーとJSONでやりとりするRESTfulインタ ーフェース ・key-value型のデータ(属性の設定)とカスタムイベ ントを持つモデル ・複数のモデルを扱うためのAPIを持つコレクション ・イベントハンドリングを行うビュー
  • 6. MVCの話はどこ?
  • 7. webアプリケーション (Railsとか)
  • 8. Controller Model View Dispatcher App Server Web Browser HTTP Request HTTP Response データの取得と操作 データの受け渡し HTMLのレンダリング レンダリングが完了した HTMLを含むHTTP Response
  • 9. Webアプリケーション のMVC(Model 2) • 重い Model と軽い Controller • Viewは永続化しない • HTTPはステートレスなのでViewに状 態を保持する必要がない(Session Cookieで保持) • ControllerはModelをViewをつなぐ糊
  • 10. GoFのMVC (伝統的なMVC)
  • 11. Controller Model View User Interaction データの操作 操作の内容を渡す イベントを発火
  • 12. MVC • 永続的なView と交換可能な Controller
  • 13. MVC • 同じMVCという単語でも、コンテキス トによって、内容が変わってくる
  • 14. backboneのMVC
  • 15. Collection Model View Router DOM 更新イベント発火 Controller イベントを発火データの操作 User Interaction OnHashChange PushState
  • 16. backbone.js • Viewの中にビューメソッド(描画)とコン トローラーメソッド(ロジック)を分ける • Controllerは基本でてこない • ModelはCollection経由で操作する
  • 17. フレームワークとは • アプリケーションの構築、管理を簡単 にするための道具
  • 18. backbone.js ・サーバーとJSONでやりとりするRESTfulインタ ーフェース ・key-value型のデータ(属性の設定)とカスタムイベ ントを持つモデル ・豊富なリスト操作用のAPIを持つコレクション ・イベントハンドリングを行うビュー
  • 19. 実際に使ってみる
  • 20. ただ、サンプルアプ リは使わないYO
  • 21. だってわかりづr(ry
  • 22. その前に
  • 23. require.js • モジュールの依存管理 • minify
  • 24. では使ってみる コードを元に説明します
  • 25. クライアントサイド • i18n対応どうするのか? • render • validation • i18n用のモジュールもあるが使うのか?
  • 26. ご清聴有難うござい ました
  • 27. 参考文献 • サバクラ両方で動く JavaScript の大規模 開発を行うために(https://gist.github.com/ tily/1362110)