Let’s angular js!!
•Als PPTX, PDF herunterladen•
2 gefällt mir•1,420 views
ゆるふわAngularJSハンズオン
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Andere mochten auch
Mehr von Syoko Matsumura
Let’s angular js!!
- 2. はじめに ▪ このスライドの内容は，先日開催されたGTUG Girls Meetup ” 1から始めるAngularハンズオン”に則っています。 ▪ ソース・参考資料等は以下のリンク先を適宜参考にしてください ▪ http://bit.ly/1F0CTr8 初めまして、Yeoman(ヨーマン)です。 口頭での説明、小話はここで話しますね。
- 5. AngularJSが生まれた背景 ▪ Java Scriptとは，DOMを操作することを原点としている言語である。 Java Script jQuery BACKBONE.JS AngularJS もっとDOMを 操作しやすく！ もっともっと DOMを操作しやすく！ jQueryは煩雑だ、 整理しよう。 反対にReact.jsは、 より細やかなDOM操作を目的として生まれた言語。
- 7. AngularJSとは ▪ キーワード ▪ カスタムタグ ▪ 双方向バインディング ▪ DI ▪ ルーティング ▪ Virtual DOM 管理画面など1ページで完結するApplicationに最適。 何度も描画が必要なゲームには不向き。
- 9. 環境構築 ▪ WebIDE (JS Bin) 使います。 ▪ URL: http://www.jsbin.com ▪ 構築手順 1. JS Binの左上にある[Add library]から”Angular 1.3.2 Stable” を選択しライブラリをインポートする 2. 以上。表示されているプログラムはindex.htmlに相当する。 手軽に試す分にはWeb IDEは便利！ index.htmlの他にファイルが欲しくなったらWebIDEは卒業。
- 10. Hello, AngularJS World!! ▪ body内に記述する。 出力結果 Hello (AngularJS World!!!) <body> Hello </body> Hello
- 11. AngularJSが動いているか確認 ▪ {{}}内の演算結果が表示されればOK 出力結果 これで正しく出力されていればOK! <body> Hello {{1+1}} </body> Hello 2
- 12. 基本の構文を書いてみよう
- 13. AngularJSの基本 1. バインディング ▪ 入力内容を即時出力する 2. 条件分岐 3. くり返し 4. フィルタリング 5. Validationチェック 全部書くの大変…説明は下記URL参照してください http://bit.ly/1AeJG3S