今回は、AngularJS勉強会に参加してまいりました。AngularJSはJavaScriptのMVCフレームワークの一つです。基礎的な部分を中心に紹介をしていきます。」という趣旨のもと行われました。それでは、以下レポートです。AngularJSGoogleとコミュニティによって開発されているJavaScriptによるMVCフレームワークで、MITライセンスのフリーウェアです。cams2012年6月にバージョン1.0.0がリリースされたということで、間もなく1周年です。※Bombermine...動かしてみるAngularJSの記法では、下記のように「ng-○○」のような属性をHTMLの要素に追加します。ng-app="">それでは、バリデータでエラーとなってしまうことが気になる方もいらっしゃるかもしれません。いった場合には、「data-ng-○○」のように独自テータ属性としてしまうことで回避できるようです。data-ng-app="">ほかにも下記のような書き方が存在しているようです。x-ng-app="">下記の機能について、説明とデモがありました。MODULES動かしてみた詳しい説明は、他のサイトに任せるとして、ドットインストールを見ながら試してみたものを下記に用意しました。入力に対して、即座にバリデーションや入力状況に応じた処理が実行されます。/>ほんの触りの部分ではありますが、その機能の片鱗を感じることができました。双方向バインディングがとても良いですね。」というAngularJSの特徴の一つだけあって、データを受け渡しの処理をほとんど記述せずとも、ある程度動くので、非常に軽快に作れます。バリデーションも充実していて扱いやすいです。入力値のチェックにもちろん正規表現も使えます。入力によって即時に柔軟に動作を変更できます。細かい作りこみは、公式のリファレンスを見ながら進めていくのが良さそうです。me」から試すことができます。(1.1系)・Extras公式モジュールが公開されています。モジュール「再利用可能なコード」でただ読みこむだけです。/>また、ng-controller属性が設定されている要素の中が、そのControllerのスコープの範囲になります。ng-bind="count">スコープの外</p><p>AngularJSでクッキーを使うには、モジュールの読み込みが必要になります。リファレンスに載っていない技術も存在しているらしく、そのあたりは骨が折れそうです。Referencehttp://docs.angularjs.org/api/リファレンスの翻訳者を募集しているそうです。ご興味のある方はぜひ。BatarangChromeの拡張で、AngularJSの開発に欠かせないものです。・スコープ内プロパティ丸見えAngularJSの機能を使ったものなら、Ajaxで取得したものも見える・パフォーマンスが確認できる・依存関係をグラフ化Testacular現在は「Karma」と名を変えてオープンソースプロジェクト化しているようです。・ファイル更新で自動テスト▼Karmahttp://dev.classmethod.jp/tool/karma/質疑応答Q:「AngularJSで、Socket.ioにつなぐ良い方法はありますか?」A:下記に試みている人がいます。下記が参考になります。Tシャツをかけた、じゃんけん大会が行われました。私の友人がゲットして行きました。うらやましいです!!まとめ少しサンプルを真似て書いただけですが、双方向バインディングのおかげで、本当に少しのコードで、たくさん動くのが印象的です。Validationあたりもよく使うものが用意されているので、フォームはAngularJSで作ったほうが簡単にリッチなものが作れると思います。「これに使えそう!あれに使えそう」という発見がたくさんあり、非常に良い刺激を受けました。登場して間もないので、これからのAngularJSに注目です。