Soumettre la recherche
Mettre en ligne
5分でわかる?Backbone.js ことはじめ
•
34 j'aime
•
11,458 vues
Kohei Kadowaki
Suivre
2012/11/14に開催された「なんでもないただの先端技術勉強会(仮)」にて、Backbone.jsの概要説明に使ったスライドです。
Lire moins
Lire la suite
Technologie
Signaler
Partager
Signaler
Partager
1 sur 17
Télécharger maintenant
Télécharger pour lire hors ligne
Recommandé
backbone.jsの使用例 その1
backbone.jsの使用例 その1
Makoto Haruyama
Backbone.js入門
Backbone.js入門
AdvancedTechNight
Backbone.js
Backbone.js
daisuke shimizu
忙しい人のためのBackbone.jsとAngular.js入門
忙しい人のためのBackbone.jsとAngular.js入門
Toshiaki Maki
はじめよう Backbone.js
はじめよう Backbone.js
Hiroki Toyokawa
Angular js or_backbonejs
Angular js or_backbonejs
Omasa Yusaku
Backbonejs @BuildInsiderOffline #1
Backbonejs @BuildInsiderOffline #1
daisuke shimizu
Start React with Browserify
Start React with Browserify
Muyuu Fujita
Recommandé
backbone.jsの使用例 その1
backbone.jsの使用例 その1
Makoto Haruyama
Backbone.js入門
Backbone.js入門
AdvancedTechNight
Backbone.js
Backbone.js
daisuke shimizu
忙しい人のためのBackbone.jsとAngular.js入門
忙しい人のためのBackbone.jsとAngular.js入門
Toshiaki Maki
はじめよう Backbone.js
はじめよう Backbone.js
Hiroki Toyokawa
Angular js or_backbonejs
Angular js or_backbonejs
Omasa Yusaku
Backbonejs @BuildInsiderOffline #1
Backbonejs @BuildInsiderOffline #1
daisuke shimizu
Start React with Browserify
Start React with Browserify
Muyuu Fujita
Kawaz的jQuery入門
Kawaz的jQuery入門
Kohki Miki
JavaScriptことはじめ
JavaScriptことはじめ
Yuki Ishikawa
scala+liftで遊ぼう
scala+liftで遊ぼう
youku
Type Safe Assets Handling in Swift
Type Safe Assets Handling in Swift
Kazunobu Tasaka
⑯jQueryをおぼえよう!その2
⑯jQueryをおぼえよう!その2
Nishida Kansuke
WebデザイナのためのjQuery入門。
WebデザイナのためのjQuery入門。
Yossy Taka
モテる JavaScript
モテる JavaScript
Osamu Monoe
20110714 j queryベーシック
20110714 j queryベーシック
良太 増子
実践Backbone.Marionette 現場の悩みと解決まで
実践Backbone.Marionette 現場の悩みと解決まで
Ryuma Tsukano
⑲jQueryをおぼえよう!その5
⑲jQueryをおぼえよう!その5
Nishida Kansuke
JavaScript Basic 01
JavaScript Basic 01
Yossy Taka
Androidで使えるJSON-Javaライブラリ
Androidで使えるJSON-Javaライブラリ
Yukiya Nakagawa
WordBench Kobe jQueryどうでしょう
WordBench Kobe jQueryどうでしょう
Hishikawa Takuro
Swiftyを試す
Swiftyを試す
幸雄 村上
introduction to Marionette.js (jscafe14)
introduction to Marionette.js (jscafe14)
Ryuma Tsukano
jQuery勉強会#3
jQuery勉強会#3
Ryo Maruyama
No3
No3
Daisuke Yamazaki
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
Kohei Asai
Backbone.jsとSASSでモジュールをつくった話
Backbone.jsとSASSでモジュールをつくった話
Yosuke Doke
iOS WebView App
iOS WebView App
hagino 3000
MVVM入門
MVVM入門
Kazutoshi Urabe
設計/ドメイン設計(4) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第26回】
設計/ドメイン設計(4) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第26回】
Tomoharu ASAMI
Contenu connexe
Tendances
Kawaz的jQuery入門
Kawaz的jQuery入門
Kohki Miki
JavaScriptことはじめ
JavaScriptことはじめ
Yuki Ishikawa
scala+liftで遊ぼう
scala+liftで遊ぼう
youku
Type Safe Assets Handling in Swift
Type Safe Assets Handling in Swift
Kazunobu Tasaka
⑯jQueryをおぼえよう!その2
⑯jQueryをおぼえよう!その2
Nishida Kansuke
WebデザイナのためのjQuery入門。
WebデザイナのためのjQuery入門。
Yossy Taka
モテる JavaScript
モテる JavaScript
Osamu Monoe
20110714 j queryベーシック
20110714 j queryベーシック
良太 増子
実践Backbone.Marionette 現場の悩みと解決まで
実践Backbone.Marionette 現場の悩みと解決まで
Ryuma Tsukano
⑲jQueryをおぼえよう!その5
⑲jQueryをおぼえよう!その5
Nishida Kansuke
JavaScript Basic 01
JavaScript Basic 01
Yossy Taka
Androidで使えるJSON-Javaライブラリ
Androidで使えるJSON-Javaライブラリ
Yukiya Nakagawa
WordBench Kobe jQueryどうでしょう
WordBench Kobe jQueryどうでしょう
Hishikawa Takuro
Swiftyを試す
Swiftyを試す
幸雄 村上
introduction to Marionette.js (jscafe14)
introduction to Marionette.js (jscafe14)
Ryuma Tsukano
jQuery勉強会#3
jQuery勉強会#3
Ryo Maruyama
No3
No3
Daisuke Yamazaki
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
Kohei Asai
Backbone.jsとSASSでモジュールをつくった話
Backbone.jsとSASSでモジュールをつくった話
Yosuke Doke
iOS WebView App
iOS WebView App
hagino 3000
Tendances
(20)
Kawaz的jQuery入門
Kawaz的jQuery入門
JavaScriptことはじめ
JavaScriptことはじめ
scala+liftで遊ぼう
scala+liftで遊ぼう
Type Safe Assets Handling in Swift
Type Safe Assets Handling in Swift
⑯jQueryをおぼえよう!その2
⑯jQueryをおぼえよう!その2
WebデザイナのためのjQuery入門。
WebデザイナのためのjQuery入門。
モテる JavaScript
モテる JavaScript
20110714 j queryベーシック
20110714 j queryベーシック
実践Backbone.Marionette 現場の悩みと解決まで
実践Backbone.Marionette 現場の悩みと解決まで
⑲jQueryをおぼえよう!その5
⑲jQueryをおぼえよう!その5
JavaScript Basic 01
JavaScript Basic 01
Androidで使えるJSON-Javaライブラリ
Androidで使えるJSON-Javaライブラリ
WordBench Kobe jQueryどうでしょう
WordBench Kobe jQueryどうでしょう
Swiftyを試す
Swiftyを試す
introduction to Marionette.js (jscafe14)
introduction to Marionette.js (jscafe14)
jQuery勉強会#3
jQuery勉強会#3
No3
No3
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
Backbone.jsとSASSでモジュールをつくった話
Backbone.jsとSASSでモジュールをつくった話
iOS WebView App
iOS WebView App
Similaire à 5分でわかる?Backbone.js ことはじめ
MVVM入門
MVVM入門
Kazutoshi Urabe
設計/ドメイン設計(4) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第26回】
設計/ドメイン設計(4) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第26回】
Tomoharu ASAMI
成長できるエンタープライズシステムを目指して-OSGiによるモジュール型アーキテクチャの実現-
成長できるエンタープライズシステムを目指して-OSGiによるモジュール型アーキテクチャの実現-
Hiroki Kondo
JavaScript 研修
JavaScript 研修
Yuki Ishikawa
物理モデル 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第9回】
物理モデル 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第9回】
Tomoharu ASAMI
テスト駆動開発の進化
テスト駆動開発の進化
Yukei Wachi
Rubyで作るtwitter風webアプリケーション
Rubyで作るtwitter風webアプリケーション
Naoto Hori
設計/ドメイン設計(3) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第25回】
設計/ドメイン設計(3) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第25回】
Tomoharu ASAMI
2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料
OCHI Shuji
Webアプリ開発のトレンドとUIライブラリ開発事情(仙台Geek★Night #1)
Webアプリ開発のトレンドとUIライブラリ開発事情(仙台Geek★Night #1)
masakazusegawa
UICollectionViewLayoutでカバーフローを作りたい!
UICollectionViewLayoutでカバーフローを作りたい!
sawat1203
分析/コンポーネント分析 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第16回】
分析/コンポーネント分析 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第16回】
Tomoharu ASAMI
【12-A-2】 ケーススタディ:不景気と戦うシステムインテグレート
【12-A-2】 ケーススタディ:不景気と戦うシステムインテグレート
devsumi2009
Java fx勉強会lt 第8回
Java fx勉強会lt 第8回
Taiji Miyabe
Djangoとは
Djangoとは
Gomamatsu
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
Tomoharu ASAMI
静的モデル(2) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第5回】
静的モデル(2) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第5回】
Tomoharu ASAMI
オープンキャンパス体験授業20150802
オープンキャンパス体験授業20150802
義広 河野
『これからの.NETアプリケーション開発』セミナー .NET用アプリケーション フレームワーク Open 棟梁 概説
『これからの.NETアプリケーション開発』セミナー .NET用アプリケーション フレームワーク Open 棟梁 概説
Daisuke Nishino
Vsug ef
Vsug ef
Microsoft
Similaire à 5分でわかる?Backbone.js ことはじめ
(20)
MVVM入門
MVVM入門
設計/ドメイン設計(4) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第26回】
設計/ドメイン設計(4) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第26回】
成長できるエンタープライズシステムを目指して-OSGiによるモジュール型アーキテクチャの実現-
成長できるエンタープライズシステムを目指して-OSGiによるモジュール型アーキテクチャの実現-
JavaScript 研修
JavaScript 研修
物理モデル 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第9回】
物理モデル 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第9回】
テスト駆動開発の進化
テスト駆動開発の進化
Rubyで作るtwitter風webアプリケーション
Rubyで作るtwitter風webアプリケーション
設計/ドメイン設計(3) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第25回】
設計/ドメイン設計(3) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第25回】
2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料
Webアプリ開発のトレンドとUIライブラリ開発事情(仙台Geek★Night #1)
Webアプリ開発のトレンドとUIライブラリ開発事情(仙台Geek★Night #1)
UICollectionViewLayoutでカバーフローを作りたい!
UICollectionViewLayoutでカバーフローを作りたい!
分析/コンポーネント分析 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第16回】
分析/コンポーネント分析 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第16回】
【12-A-2】 ケーススタディ:不景気と戦うシステムインテグレート
【12-A-2】 ケーススタディ:不景気と戦うシステムインテグレート
Java fx勉強会lt 第8回
Java fx勉強会lt 第8回
Djangoとは
Djangoとは
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
要求 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第12回】
静的モデル(2) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第5回】
静的モデル(2) 【クラウドアプリケーションのためのオブジェクト指向分析設計講座 第5回】
オープンキャンパス体験授業20150802
オープンキャンパス体験授業20150802
『これからの.NETアプリケーション開発』セミナー .NET用アプリケーション フレームワーク Open 棟梁 概説
『これからの.NETアプリケーション開発』セミナー .NET用アプリケーション フレームワーク Open 棟梁 概説
Vsug ef
Vsug ef
Plus de Kohei Kadowaki
Pebble + JavaScriptでつくるスマートウォッチアプリ
Pebble + JavaScriptでつくるスマートウォッチアプリ
Kohei Kadowaki
Firefox OSでSVGをつかってみた
Firefox OSでSVGをつかってみた
Kohei Kadowaki
Inline SVG - トラブルとその対策
Inline SVG - トラブルとその対策
Kohei Kadowaki
Webでもできるデータビジュアライゼーション
Webでもできるデータビジュアライゼーション
Kohei Kadowaki
いまさら聞けない!?Backbone.js 超入門
いまさら聞けない!?Backbone.js 超入門
Kohei Kadowaki
D3.js と SVG によるデータビジュアライゼーション
D3.js と SVG によるデータビジュアライゼーション
Kohei Kadowaki
プログラマーのお仕事
プログラマーのお仕事
Kohei Kadowaki
SVGでつくるインタラクティブWebアプリケーション
SVGでつくるインタラクティブWebアプリケーション
Kohei Kadowaki
UnityでつくるはじめてのPONG
UnityでつくるはじめてのPONG
Kohei Kadowaki
インラインSVGをつかって地図っぽいものをつくってみる
インラインSVGをつかって地図っぽいものをつくってみる
Kohei Kadowaki
ShareWisをFirefoxで動かすためのSVG的とりくみ
ShareWisをFirefoxで動かすためのSVG的とりくみ
Kohei Kadowaki
d3jsではじめるデータビジュアライゼーション入門
d3jsではじめるデータビジュアライゼーション入門
Kohei Kadowaki
ゲーム開発初心者の僕がUnity + WebSocketで何か作ってみた
ゲーム開発初心者の僕がUnity + WebSocketで何か作ってみた
Kohei Kadowaki
SocketStream入門
SocketStream入門
Kohei Kadowaki
WebSocket + Node.jsでつくるチャットアプリ
WebSocket + Node.jsでつくるチャットアプリ
Kohei Kadowaki
AndroidでWebSocket
AndroidでWebSocket
Kohei Kadowaki
WebSocketことはじめ
WebSocketことはじめ
Kohei Kadowaki
Plus de Kohei Kadowaki
(17)
Pebble + JavaScriptでつくるスマートウォッチアプリ
Pebble + JavaScriptでつくるスマートウォッチアプリ
Firefox OSでSVGをつかってみた
Firefox OSでSVGをつかってみた
Inline SVG - トラブルとその対策
Inline SVG - トラブルとその対策
Webでもできるデータビジュアライゼーション
Webでもできるデータビジュアライゼーション
いまさら聞けない!?Backbone.js 超入門
いまさら聞けない!?Backbone.js 超入門
D3.js と SVG によるデータビジュアライゼーション
D3.js と SVG によるデータビジュアライゼーション
プログラマーのお仕事
プログラマーのお仕事
SVGでつくるインタラクティブWebアプリケーション
SVGでつくるインタラクティブWebアプリケーション
UnityでつくるはじめてのPONG
UnityでつくるはじめてのPONG
インラインSVGをつかって地図っぽいものをつくってみる
インラインSVGをつかって地図っぽいものをつくってみる
ShareWisをFirefoxで動かすためのSVG的とりくみ
ShareWisをFirefoxで動かすためのSVG的とりくみ
d3jsではじめるデータビジュアライゼーション入門
d3jsではじめるデータビジュアライゼーション入門
ゲーム開発初心者の僕がUnity + WebSocketで何か作ってみた
ゲーム開発初心者の僕がUnity + WebSocketで何か作ってみた
SocketStream入門
SocketStream入門
WebSocket + Node.jsでつくるチャットアプリ
WebSocket + Node.jsでつくるチャットアプリ
AndroidでWebSocket
AndroidでWebSocket
WebSocketことはじめ
WebSocketことはじめ
Dernier
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
taisei2219
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Yuma Ohgami
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
Toru Tamaki
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
Toru Tamaki
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
Hiroki Ichikura
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
iPride Co., Ltd.
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
sugiuralab
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
Ryo Sasaki
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
Toru Tamaki
Dernier
(9)
TSAL operation mechanism and circuit diagram.pdf
TSAL operation mechanism and circuit diagram.pdf
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
Open Source UN-Conference 2024 Kawagoe - 独自OS「DaisyOS GB」の紹介
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Semantic segmentation using Vision Transformers: A survey
論文紹介:Automated Classification of Model Errors on ImageNet
論文紹介:Automated Classification of Model Errors on ImageNet
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
【早稲田AI研究会 講義資料】3DスキャンとTextTo3Dのツールを知ろう!(Vol.1)
SOPを理解する 2024/04/19 の勉強会で発表されたものです
SOPを理解する 2024/04/19 の勉強会で発表されたものです
スマートフォンを用いた新生児あやし動作の教示システム
スマートフォンを用いた新生児あやし動作の教示システム
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
[DevOpsDays Tokyo 2024] 〜デジタルとアナログのはざまに〜 スマートビルディング爆速開発を支える 自動化テスト戦略
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
論文紹介:Content-Aware Token Sharing for Efficient Semantic Segmentation With Vis...
5分でわかる?Backbone.js ことはじめ
1.
5分でわかる? Backbone.js ことはじめ 2012/11/14 なんでもないただの先端技術勉強会(仮) ShareWis
Inc. 門脇 恒平 1
2.
自己紹介 • 名前:門脇
恒平 @kadoppe • 職業:ソフトウェアエンジニア Webアプリケーション / iOSアプリケーション / Backbone.js • 所属: ShareWis Inc. CTO / HTML5-West.jpコアメンバ 2
3.
Backbone.js とは • クライアントサイドJavaScript
MVC フレームワーク と言われている • 実際のところ • WebアプリケーションにModel, View, Collection, Eventの構造・仕組みを提供するフレームワーク • 従来のMVCフレームワークとは別物 3
4.
Backbone.js のメリット •
役割ごとにソースコードを分割・整理できる • Model, View, Collectionそれぞれのコードを独立して 開発しやすくなる • 特に大規模JavaScriptプロジェクトで有用 Model View Collection 4
5.
Model の役割
(1)データ管理 • データ管理 • アプリケーションに必要なあらゆるデータを管理 • 例)Person Modelの firstName プロパティ に Taro を値として設定 • イベント管理 • プロパティの変化などのイベントを他のオブジェクトに 伝える 5
6.
Model の役割
(2)ビジネスロジックの実装 • ビジネスロジック • データの変換、結合、バリデーションなどを実現す るメソッド • 例)firstName と lastNameをくっつけて返す fullName というメソッドを実装 6
7.
Modelの集合を扱う Collection の役割 •
Modelの集合に対する様々な操作 • ソート、フィルタリング、検索など • イベント管理 • Modelの追加、削除などのイベントを他のオブジェ クトに伝える 7
8.
View の役割
(1)DOMツリーの管理 body div ul li li li div form input View: input 8
9.
View の役割
(1)DOMツリーの管理 body div ul li li li div form input View: input 8
10.
View の役割
(1)DOMツリーの管理 body div ul li li li div form input View: input 8
11.
View の役割
(1)DOMツリーの管理 body div ul li li li div form input View: input 8
12.
View の役割
(1)DOMツリーの管理 body div ul li li jQueryなどを使って DOM操作・イベント監視 li div form input View: input 8
13.
View の役割
(2)Model・Collectionの管理 • Model・Collectionの操作 • Modelのプロパティ値変更 • CollectionへのModel追加・削除 • イベント監視 • ModelやCollectionが発生させるイベントの監視 9
14.
View の役割
(3)中継 • DOMツリーとModel・Collectionの橋渡し :イベント :操作 Model View Collecti on 10
15.
まとめ • Backbone.js •
Model, View, Collectionを提供してくれるフレー ムワーク • 大規模JavaScriptプロジェクトでも各部分を独立し て開発しやくすなる • 紹介していない他の機能はまた別の機会に • Router, RESTful JSONインタフェースなど 11
16.
学習に役立つページ •
Backbone.js 公式ドキュメント • http://backbonejs.org/ • Backbone.js Advent Calendar 2011 • 特に「Backbone.js入門」シリーズ • http://qiita.com/advent-calendar/2011/backbone • これまでの「MVC」とBackbone.jsの関係について少し理解した。 • http://kadoppe.com/archives/2012/04/relation-between- traditional-mvc-and-backbonejs.html 12
17.
おしまい! ご清聴ありがとうございました!
13
Télécharger maintenant