読者です 読者をやめる 読者になる 読者になる

decadence

個人のメモ帳

AngularJS 所感 (+ Sinatra)

何これ

AngularJSで遊んでるメモ

経緯

研究室でJS勉強会が行われている.1週に1回(たまに無い週も)って形で4~5回行われた.
初め数回でChrome拡張作ろう → jQueryAjax完璧 → プロトタイプ継承完璧!とかしながら,good partsみたいなものを適宜考えながらやっていった.
やることがなくなったので何しよう → AngularJSとか流行ってるしやるか!

所感

まずAngularJS使う機会として3通りぐらいに分けれそう
1. クライアントサイドだけで完結するパターン
2. APIのみ提供するサーバを持ちつつクライアントサイドをほぼ静的に書くパターン
3. RailsなどのWAFと組み合わせて使うパターン

AngularJSを触れて良い所として,以下のようなものが順に挙げられる

  • Controllerを用いた明示的Scope
    • document.getElementById('hoge')とかしないで良くなるが良い
  • AngularJSの機能に沿えば,機能やそれに対する依存性を分離出来る
    • Controller, Service, Module, Filter等
  • 個々のモデルをAngularを通してきちんと定義出来る
  • CRUDとの連携が得意
  • pushState良い

一番AngularJSを使う機会が多くなるのは2のパターンな気がする.
一先ず書いてみなければ,ということでSinatra + AngularJSで2のパターンっぽい例を書いてみた
krrrr38/SinatraAngularExample · GitHub

Sinatra書くの初めてだから,悪い所あれば教えて貰いたい.

実際3のパターンでも何か色々出来ないかな,とか思うのだが,他のWAFを用いながらAngularJSを使おうとする際,APIを経由せずにJS側に値を渡すといった事が難しい気がする.
例えばページの中にメインコンテンツとサイドコンテンツがある時,メインコンテンツを他のWAF側で描画しつつ,サイドコンテンツをAngularJSで管理すると良いのかもしれない.

AngularJS,きちんとControllerがDOMどこをいじるのかといったScopeを明示出来る上に,きちんとAngularJSの設計を行えばどの機能にControllerが依存するのかといった事も書けるので,良いと思う.
function HogeController = ~となどといった記述,なぜ許容しているのかわからないけど,このような書き方さえ許容しないように書いていけば負債にもなりにくくなると思う.

どうでもいいけど

Controller間のデータのやりとりに,他のcontrollerひっぱってきて~とかいった記事あったけど最悪で,AngularJSにおいてシングルトンであるとされるServiceを共有資源として渡すのが良いと思う.

Sinatra便利だなぁ...ActiveRecord便利だなぁ...
この2つ,超簡単に作るWebアプリケーション運動促進してる.きちんとしたサービス作るのに向いているかとかは知らない.

追記

書いた通りだけど,AngularJS学ぶ時

ってのが良いと思う.
意識的にはここに書いてるけど,moduleってのがあってそれにはアプリケーション層のもの,Service,Filter,DirectiveがあってさらにControllerがあって,当たり前だけど大事でそれらの責務を理解した上で,そのモジュールが何に依存しているのかってのをきちんと考えながら作ると良いものが出来る気がする.当たり前だった.

広告を非表示にする