Enviar búsqueda
Cargar
あの時AngularJSと出会った僕らは
•
6 recomendaciones
•
2,801 vistas
Muyuu Fujita
Seguir
Tecnología
Denunciar
Compartir
Denunciar
Compartir
1 de 39
Descargar ahora
Descargar para leer sin conexión
Recomendados
J query place
J query place
sayoko miura
Try Webworkers
Try Webworkers
Hideaki Miyake
Knockout
Knockout
Kazuhiro Eguchi
20110714 j queryベーシック
20110714 j queryベーシック
良太 増子
Ruby on JavaScript
Ruby on JavaScript
Masaya Kogawa
まだDOM操作で消耗してるの?
まだDOM操作で消耗してるの?
IRI MO
20130924 Picomon CRH勉強会
20130924 Picomon CRH勉強会
Yukihiro Kitazawa
Web Workers
Web Workers
kaboccha
Recomendados
J query place
J query place
sayoko miura
Try Webworkers
Try Webworkers
Hideaki Miyake
Knockout
Knockout
Kazuhiro Eguchi
20110714 j queryベーシック
20110714 j queryベーシック
良太 増子
Ruby on JavaScript
Ruby on JavaScript
Masaya Kogawa
まだDOM操作で消耗してるの?
まだDOM操作で消耗してるの?
IRI MO
20130924 Picomon CRH勉強会
20130924 Picomon CRH勉強会
Yukihiro Kitazawa
Web Workers
Web Workers
kaboccha
Backbone.js
Backbone.js
daisuke shimizu
はじめてのVue.js
はじめてのVue.js
kamiyam .
本当にあった怖いJS
本当にあった怖いJS
Ten Tokoro
introduction to Marionette.js (jscafe14)
introduction to Marionette.js (jscafe14)
Ryuma Tsukano
Web area 2013-07-16
Web area 2013-07-16
kmiyako
deviseを利用した認証について@Minamirb
deviseを利用した認証について@Minamirb
Jun Fukaya
上へ戻る
上へ戻る
sayoko miura
JAWS-UG CLI #14 LT 【”Waiters”機能の使いドコロ】
JAWS-UG CLI #14 LT 【”Waiters”機能の使いドコロ】
Ayumi Kobukata
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
Yasuhito Yabe
JavaScriptもBACKBONE.JSならスッキリ ~MVCぽいのを初体験!~
JavaScriptもBACKBONE.JSならスッキリ ~MVCぽいのを初体験!~
Toshio Ehara
イベント
イベント
sayoko miura
html5j.orgがHTML5+JavaScriptで Metro Style アプリを作ってみた
html5j.orgがHTML5+JavaScriptで Metro Style アプリを作ってみた
Shumpei Shiraishi
Web勉強会 20120927
Web勉強会 20120927
Yoshihiro Furukawa
Creators'night#13 tech#2今井
Creators'night#13 tech#2今井
Daisuke Imai
jQuery超入門編
jQuery超入門編
Yasuhito Yabe
初めての Data api cms どうでしょう - 大阪夏の陣
初めての Data api cms どうでしょう - 大阪夏の陣
Yuji Takayama
Data apiで実現 進化するwebの世界
Data apiで実現 進化するwebの世界
Yuji Takayama
初めての Data api
初めての Data api
Yuji Takayama
速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-
Kazunari Hara
初めての Data API CMS どうでしょう - 仙台編 -
初めての Data API CMS どうでしょう - 仙台編 -
Yuji Takayama
SocialWeb Conference vol.5 OpenSocial Night #2
SocialWeb Conference vol.5 OpenSocial Night #2
Nobuhiro Nakajima
Visualforce + jQuery
Visualforce + jQuery
Salesforce Developers Japan
Más contenido relacionado
La actualidad más candente
Backbone.js
Backbone.js
daisuke shimizu
はじめてのVue.js
はじめてのVue.js
kamiyam .
本当にあった怖いJS
本当にあった怖いJS
Ten Tokoro
introduction to Marionette.js (jscafe14)
introduction to Marionette.js (jscafe14)
Ryuma Tsukano
Web area 2013-07-16
Web area 2013-07-16
kmiyako
deviseを利用した認証について@Minamirb
deviseを利用した認証について@Minamirb
Jun Fukaya
上へ戻る
上へ戻る
sayoko miura
JAWS-UG CLI #14 LT 【”Waiters”機能の使いドコロ】
JAWS-UG CLI #14 LT 【”Waiters”機能の使いドコロ】
Ayumi Kobukata
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
Yasuhito Yabe
JavaScriptもBACKBONE.JSならスッキリ ~MVCぽいのを初体験!~
JavaScriptもBACKBONE.JSならスッキリ ~MVCぽいのを初体験!~
Toshio Ehara
イベント
イベント
sayoko miura
html5j.orgがHTML5+JavaScriptで Metro Style アプリを作ってみた
html5j.orgがHTML5+JavaScriptで Metro Style アプリを作ってみた
Shumpei Shiraishi
Web勉強会 20120927
Web勉強会 20120927
Yoshihiro Furukawa
Creators'night#13 tech#2今井
Creators'night#13 tech#2今井
Daisuke Imai
La actualidad más candente
(14)
Backbone.js
Backbone.js
はじめてのVue.js
はじめてのVue.js
本当にあった怖いJS
本当にあった怖いJS
introduction to Marionette.js (jscafe14)
introduction to Marionette.js (jscafe14)
Web area 2013-07-16
Web area 2013-07-16
deviseを利用した認証について@Minamirb
deviseを利用した認証について@Minamirb
上へ戻る
上へ戻る
JAWS-UG CLI #14 LT 【”Waiters”機能の使いドコロ】
JAWS-UG CLI #14 LT 【”Waiters”機能の使いドコロ】
レスポンシブWebデザイン【発展編】
レスポンシブWebデザイン【発展編】
JavaScriptもBACKBONE.JSならスッキリ ~MVCぽいのを初体験!~
JavaScriptもBACKBONE.JSならスッキリ ~MVCぽいのを初体験!~
イベント
イベント
html5j.orgがHTML5+JavaScriptで Metro Style アプリを作ってみた
html5j.orgがHTML5+JavaScriptで Metro Style アプリを作ってみた
Web勉強会 20120927
Web勉強会 20120927
Creators'night#13 tech#2今井
Creators'night#13 tech#2今井
Similar a あの時AngularJSと出会った僕らは
jQuery超入門編
jQuery超入門編
Yasuhito Yabe
初めての Data api cms どうでしょう - 大阪夏の陣
初めての Data api cms どうでしょう - 大阪夏の陣
Yuji Takayama
Data apiで実現 進化するwebの世界
Data apiで実現 進化するwebの世界
Yuji Takayama
初めての Data api
初めての Data api
Yuji Takayama
速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-
Kazunari Hara
初めての Data API CMS どうでしょう - 仙台編 -
初めての Data API CMS どうでしょう - 仙台編 -
Yuji Takayama
SocialWeb Conference vol.5 OpenSocial Night #2
SocialWeb Conference vol.5 OpenSocial Night #2
Nobuhiro Nakajima
Visualforce + jQuery
Visualforce + jQuery
Salesforce Developers Japan
ソーシャルアプリ勉強会(第一回資料)配布用
ソーシャルアプリ勉強会(第一回資料)配布用
Yatabe Terumasa
サーバサイドで動的にhtml生成していたりjQueryをガッツし使っている既存プロジェクトにAngularJSを部分的につっこんでみた @jscafe21
サーバサイドで動的にhtml生成していたりjQueryをガッツし使っている既存プロジェクトにAngularJSを部分的につっこんでみた @jscafe21
佐藤 俊太郎
Try Jetpack
Try Jetpack
Hideaki Miyake
WordPressと外部APIとの連携
WordPressと外部APIとの連携
Hidekazu Ishikawa
【ネイティブアドを支えるPhantomJS】
【ネイティブアドを支えるPhantomJS】
Kengo Shimada
Knocked out in knockout js
Knocked out in knockout js
Hiroyuki Tashima
Async Enhancement
Async Enhancement
kamiyam .
SpringOne 2GX 2014 参加報告 & Spring 4.1について #jsug
SpringOne 2GX 2014 参加報告 & Spring 4.1について #jsug
Toshiaki Maki
WordBench京都12月、WordCampUSからのWP REST APIな話
WordBench京都12月、WordCampUSからのWP REST APIな話
Hidetaka Okamoto
「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)
「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)
Fujio Kojima
traceur-compilerで ECMAScript6を体験
traceur-compilerで ECMAScript6を体験
Toshio Ehara
iOS WebView App
iOS WebView App
hagino 3000
Similar a あの時AngularJSと出会った僕らは
(20)
jQuery超入門編
jQuery超入門編
初めての Data api cms どうでしょう - 大阪夏の陣
初めての Data api cms どうでしょう - 大阪夏の陣
Data apiで実現 進化するwebの世界
Data apiで実現 進化するwebの世界
初めての Data api
初めての Data api
速くなければスマフォじゃない - インターンバージョン-
速くなければスマフォじゃない - インターンバージョン-
初めての Data API CMS どうでしょう - 仙台編 -
初めての Data API CMS どうでしょう - 仙台編 -
SocialWeb Conference vol.5 OpenSocial Night #2
SocialWeb Conference vol.5 OpenSocial Night #2
Visualforce + jQuery
Visualforce + jQuery
ソーシャルアプリ勉強会(第一回資料)配布用
ソーシャルアプリ勉強会(第一回資料)配布用
サーバサイドで動的にhtml生成していたりjQueryをガッツし使っている既存プロジェクトにAngularJSを部分的につっこんでみた @jscafe21
サーバサイドで動的にhtml生成していたりjQueryをガッツし使っている既存プロジェクトにAngularJSを部分的につっこんでみた @jscafe21
Try Jetpack
Try Jetpack
WordPressと外部APIとの連携
WordPressと外部APIとの連携
【ネイティブアドを支えるPhantomJS】
【ネイティブアドを支えるPhantomJS】
Knocked out in knockout js
Knocked out in knockout js
Async Enhancement
Async Enhancement
SpringOne 2GX 2014 参加報告 & Spring 4.1について #jsug
SpringOne 2GX 2014 参加報告 & Spring 4.1について #jsug
WordBench京都12月、WordCampUSからのWP REST APIな話
WordBench京都12月、WordCampUSからのWP REST APIな話
「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)
「Windows 8 ストア アプリ開発 tips」 hokuriku.net vol.11 (2013年1月26日)
traceur-compilerで ECMAScript6を体験
traceur-compilerで ECMAScript6を体験
iOS WebView App
iOS WebView App
Más de Muyuu Fujita
Hello npm
Hello npm
Muyuu Fujita
Learn ES2015
Learn ES2015
Muyuu Fujita
Start React with Browserify
Start React with Browserify
Muyuu Fujita
Objective Front-End JavaScript
Objective Front-End JavaScript
Muyuu Fujita
小規模案件で作られた秘伝のタレ
小規模案件で作られた秘伝のタレ
Muyuu Fujita
閉じタグを超えた先に僕が見た景色とは
閉じタグを超えた先に僕が見た景色とは
Muyuu Fujita
JavaScriptと共に歩いて行く決意をした君へ
JavaScriptと共に歩いて行く決意をした君へ
Muyuu Fujita
非ガチ勢「よし、Coffee script使おう!」
非ガチ勢「よし、Coffee script使おう!」
Muyuu Fujita
デザイナー向け 初めてのPhp ~サイト制作に役立つtips~
デザイナー向け 初めてのPhp ~サイト制作に役立つtips~
Muyuu Fujita
Cssアニメーションとその制御
Cssアニメーションとその制御
Muyuu Fujita
WordPressで企業サイトのテーマを作る
WordPressで企業サイトのテーマを作る
Muyuu Fujita
WPerのWPerによるWPerのためのPHP入門
WPerのWPerによるWPerのためのPHP入門
Muyuu Fujita
ノンプログラマのGit入門
ノンプログラマのGit入門
Muyuu Fujita
Html5でword pressテーマを作るよ!
Html5でword pressテーマを作るよ!
Muyuu Fujita
Más de Muyuu Fujita
(14)
Hello npm
Hello npm
Learn ES2015
Learn ES2015
Start React with Browserify
Start React with Browserify
Objective Front-End JavaScript
Objective Front-End JavaScript
小規模案件で作られた秘伝のタレ
小規模案件で作られた秘伝のタレ
閉じタグを超えた先に僕が見た景色とは
閉じタグを超えた先に僕が見た景色とは
JavaScriptと共に歩いて行く決意をした君へ
JavaScriptと共に歩いて行く決意をした君へ
非ガチ勢「よし、Coffee script使おう!」
非ガチ勢「よし、Coffee script使おう!」
デザイナー向け 初めてのPhp ~サイト制作に役立つtips~
デザイナー向け 初めてのPhp ~サイト制作に役立つtips~
Cssアニメーションとその制御
Cssアニメーションとその制御
WordPressで企業サイトのテーマを作る
WordPressで企業サイトのテーマを作る
WPerのWPerによるWPerのためのPHP入門
WPerのWPerによるWPerのためのPHP入門
ノンプログラマのGit入門
ノンプログラマのGit入門
Html5でword pressテーマを作るよ!
Html5でword pressテーマを作るよ!
Último
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
博三 太田
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
FumieNakayama
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
Yuki Kikuchi
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
FumieNakayama
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
akihisamiyanaga1
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
Hiroshi Tomioka
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
UEHARA, Tetsutaro
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
sugiuralab
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
Último
(9)
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
TataPixel: 畳の異方性を利用した切り替え可能なディスプレイの提案
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
あの時AngularJSと出会った僕らは
1.
あの時AngularJSと出会った僕らは 春のJavaScript祭り
2.
{{about-me}} 名前 所属 職種 Facebook Twitter Blog Mail むゆう フリーランス IT僧侶, Webエンジニア http://facebook.com/muyuu/ http://twitter.com/anticyborg/ http://stackstock.net/ anticyborg@gmail.com
3.
jQueryつらい(´・_・`)
4.
{{DOM-select}} $(function(){ $(‘.news .btn’).on(‘click’, function(){ $(this).parent() .next() .find(‘.item’) .addClass(‘splash’); } });
5.
密結合になりがち
6.
{{view-update}} $(function(){ $(‘.btn’).on(‘click’, function(){ // 何か色々処理 view_update(obj); } $(‘.prefList’).on(‘change’,
function(){ // 何か色々処理 view_update(obj); } });
7.
いろんなとこでDOMの更新関数
8.
9.
なんだかなー(´・_・`)
10.
11.
HTMLがテンプレート
12.
{{html-template}} <body ng-app> <h1>Hello! I’m
{{‘muyuu’ + ‘!!’}}</h1> </body>
13.
<body ng-app> <p>1 +
2 = {{1 + 2}}</p> </body> {{html-template}}
14.
双方向データバインディング
15.
{{2way-data-binding}} <body ng-app> <div> <label>name:</label> <input type=‘text’
ng-model=‘myName’> </div> <p>Hello! I’m {{myName}}!!</p> </body>
16.
<body ng-app> <div> <label>name:</label> <input type=‘text’
ng-model=‘myName’> </div> <p>Hello! I’m {{myName}}!!</p> </body> {{2way-data-binding}}
17.
<body ng-app> <div> <label>name:</label> <input type=‘text’
ng-model=‘myName’> </div> <p>Hello! I’m {{myName}}!!</p> </body> {{2way-data-binding}}
18.
repeat
19.
{{repeat}} <body ng-app=‘itemApp’> <ul ng-controller=‘itemCtrl’> <li
ng-repeat=‘item in items’> <p>name: {{item.name}}</p> <p>price: {{item.price}}</p> </li> </ul> </body>
20.
filter
21.
{{filter}} <body ng-app="itemApp"> <input type="text"
ng-model="query"> <ul ng-controller="itemCtrl"> <li ng-repeat="item in items | filter:query"> <p>name: {{item.name}}</p> <p>price: {{item.price}}</p> </li> </ul> </body>
22.
<body ng-app="itemApp"> <input type="text"
ng-model="query"> <ul ng-controller="itemCtrl"> <li ng-repeat="item in items | filter:query"> <p>name: {{item.name}}</p> <p>price: {{item.price}}</p> </li> </ul> </body> {{filter}}
23.
<body ng-app="itemApp"> <input type="text"
ng-model="query"> <ul ng-controller="itemCtrl"> <li ng-repeat="item in items | filter:query"> <p>name: {{item.name}}</p> <p>price: {{item.price}}</p> </li> </ul> </body> {{filter}}
24.
routing
25.
{{routing}} デモ
26.
まとめ
27.
{{まとめ}} • 双方向データバインディングやばい • 双方向データバインディングやばい •
双方向データバインディングやばい
28.
{{まとめ}} • htmlがテンプレートになるから分かりやすい • 双方向データバインディングやばい •
ルーティング機能でSPA • htmlが進化する!
29.
おわりに
30.
世はJavaScript戦国時代
31.
次から次に新しい ライブラリが出てくる
32.
「そんなにいっぱい覚えてる 時間ねーんだよ!!」
33.
「今まだjQueryクラスのシェ アがないから投資時間が無駄に なるかもだし様子見」
34.
わーかーるー
35.
でもそれじゃ何も変われない
36.
1歩踏み出せば必ず 何かの力になる
37.
それを続けていけば 戦国時代を勝ち抜く力もつく
38.
触り始めるのに敷居が凄く高い ライブラリはそんなにない
39.
Don’t think Write code
Descargar ahora