Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
AngularJS #TechLunch
Search
Livesense Inc.
PRO
April 21, 2014
Technology
0
40
AngularJS #TechLunch
AngularJS
2012/08/01 (水) @ Livesense TechLunch
発表者:塩足 拓也
Livesense Inc.
PRO
April 21, 2014
Tweet
Share
More Decks by Livesense Inc.
See All by Livesense Inc.
コロナで失われたノベルティ作成ノウハウを復活させた話
livesense
PRO
0
67
株式会社リブセンス 会社説明資料(報道関係者様向け)
livesense
PRO
0
330
転職会議でGPT-3を活用した企業口コミ要約機能をリリースした話
livesense
PRO
0
1k
株式会社リブセンス マッハバイト_プレイブック
livesense
PRO
0
380
Tech Award 2021 選出方法
livesense
PRO
0
980
株式会社リブセンス エンジニアリング組織を支える風土と制度
livesense
PRO
0
510
株式会社リブセンス・マッハバイト 採用候補者様向け資料
livesense
PRO
0
210
株式会社リブセンス・転職会議 採用候補者様向け資料
livesense
PRO
0
2k
brain.optimizerのレコメンド取得API
livesense
PRO
0
2.1k
Other Decks in Technology
See All in Technology
中央集権体制からDataOpsへの転換 / centralized-to-dataops-transformation
pei0804
7
1.3k
オーティファイ会社紹介資料 / Autify Company Deck
autifyhq
7
100k
AMLD 2024 - Build Your Own GPT
donlelef
1
260
CI/CDがあたりまえの今の時代にAPIテスティングツールに求められていること / CI/CD Test Night #7
k1low
11
2.7k
単回帰分析について数式を追いながら実装してみた
kentaitakura
0
490
TCA入門したてなので、自分が馴染みのある実装と比較しながらキャッチアップしてみる
fumiyasac0921
1
370
Azureコストは水道代/The_47th_Tokyo_Jazug
aeonpeople
3
350
Cloud Friendly(?) Jenkins. How we failed to make Jenkins cloud native and what we learned?
onenashev
PRO
0
110
HoneycombとOpenTelemetryでオブザーバビリティに入門してみる
sumiren
2
140
8週連続ウェビナー_イチから学ぶFivetran
cmsuzu
0
160
Cloud Deploy と仲良くなりたい
phaya72
1
100
どう買う?Azure
kuniteru
1
190
Featured
See All Featured
The Language of Interfaces
destraynor
150
22k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
5
1.4k
A designer walks into a library…
pauljervisheath
199
23k
Infographics Made Easy
chrislema
237
18k
Unsuck your backbone
ammeep
660
56k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
19
1.6k
No one is an island. Learnings from fostering a developers community.
thoeni
14
2k
Imperfection Machines: The Place of Print at Facebook
scottboms
257
12k
Rails Girls Zürich Keynote
gr2m
91
13k
Rebuilding a faster, lazier Slack
samanthasiow
72
8.2k
Bash Introduction
62gerente
604
210k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
57
14k
Transcript
Takuya Shiotari
JavaScriptMVCフレームワーク Framework UI Bindings Composed Views Web Presentation Layer Plays
Nicely With Others Backbone.js ✗ ✗ ✓ ✓ SproutCore 1.x ✓ ✓ ✗ ✗ Sammy.js ✗ ✗ ✓ ✓ Spine.js ✗ ✗ ✓ ✓ Cappuccino ✓ ✓ ✗ ✗ Knockout.js ✓ ✗ ✓ ✓ Javascript MVC ✗ ✓ ✓ ✓ Google Web Toolkit ✗ ✓ ✗ ✗ Google Closure ✗ ✓ ✓ ✗ Ember.js ✓ ✓ ✓ ✓ Angular.js ✓ ✗ ✓ ✓ Batman.js ✓ ✗ ✓ ✓
AngularJSとは • Googleとコミュニティによって開発されている • オープンソースのJavaScriptMVCフレームワー ク • 最新バージョンは1.0.2
特徴 • HTMLのシンタックスを拡張し、HTML自体をテ ンプレート言語として使うことができる • 双方向データバインディングでUI(View)からの データとJavaScriptオブジェクト(Model)を自動 的に同期する • 直感的なコントローラ
テンプレートとしてのHTML HTML仕様と互換性をもつアプリ固有の要素、属 性、クラスタイプなどで既存のHTMLを拡張
双方向データバインディング UIでの変更をモデルに、モデルでの変更をUIに自 動的に反映する
コントローラ DOM構造と一致した変数スコープ
HTMLで再利用できるコンポー ネント カスタム要素や属性によって、動作を追加したり DOM を変更するなど、HTML のシンタックスを拡 張する手段を提供
フィルタリング |演算子でパイプラインのようにフィルタを追加でき る
考察 • フレームワーク独自の定型的なコードがほとんど無 いので、やりたいことに注力できる • HTMLがそのままテンプレートになっているので、 JavaScriptを読み込めない環境(robotとか)には不 向き • 属性部分にコードを埋めることが出来るのは良い
がやり過ぎは禁物 • minifyで77KBはでかい • 使い道がまだよくわからない