開発ライフサイクルから見たAngularJS
- 2. #ng_jp ng-self 酒巻 瑞穂 Enterprise Engineer html5jエンタープライズ部 （スタッフ） html5jWebプラットフォーム部 （スタッフ） FirefoxOSコードリーディング (ヒラ) AngularJS Japan User Group （スタッフ）
- 4. 開発プロセスから振り返る #ng_jp Angularなおもひで 要求設計 基本設計 機能設計 詳細設計 受入テスト 結合テスト 機能テスト 単体テスト コーディング
- 5. Angularな開発ライフサイクル 〔計画 : project planning〕 AngularJSをメインキャストに！ Web開発のメリットを殺すような開発サイクルはなるたけ避けたほうが良い 昨今まではフロントはサーバーと同じサイクルで管理される事が多かったが、近代のフロ ントエンドは十分アーキテクチャとして完成している。 プロジェクト管理体制の独立している、バックエンドの開発サイクルのついでに、jenkins からGruntを叩くだけというのは、開発速度の低下を招く為個人的にお勧めできない CIも粗結合！ フロントエンドの生産性や柔軟性を損ねず従来と同じレベルのCIが実現できる。 バックエンドCI、統合CIと連携する場合はフロントエンド等からの連携で #ng_jp
- 6. Angularな開発ライフサイクル 〔設計 : application design〕 相棒はどんな eco system？ ● AngularJSの開発はeco systemをどれだけ活用するかも重要でした。 ossな子、ベンダー製の子、身内の子。 ● 様々なコンポーネントを組み合わせ、どのように結合するかというコンポーネントベー スの設計になりました。 ● それ以外にも、モック画面が動くので。プロトタイピングなどの動作を見せる開発がよ り容易になり見落としが減る、顧客からの要件調整がより効率的に。 ● UIの要件がコンポーネントとして定義できるすばらしさ(direcrive) ● API設計 ▶︎ リソースモジュール設計 ▶︎ リソースモジュールを使用した開発 リソースモジュール ▶︎ odbcのラッパ、DAOのように直接APIコールではなく、より 開発者たちに使いやすい、再利用できるようAPIをラッピングできる。 #ng_jp
- 7. Angularな開発ライフサイクル 〔製造 : development〕 分業と、共通認識と AngularJSという共通の認識土台で作業できることのすばらしさ AngularJSを知っているデザイナー最強説 LT程度でこのすばらしさは伝えられないので、ぜひ皆さん実践して経験してください。 #ng_jp
- 8. Angularな開発ライフサイクル 〔試験 : software test〕 おどろきのテスト書きやすさ AngularJSはテストを重視したフレームワーク Angularチームもテストに真摯に取り組んでいる。 AngularJS用のテスト補助ライブラリangular-mock、Protractorを用いたテストでより、効 率的なテストを！ #ng_jp
- 9. Angularな開発ライフサイクル 〔運用 : operations〕 Webの進化の大恩恵 運用メンバーは開発メンバーと違う事が多い 引き継ぎや運用者のことも考えるとシンプルなほうがいい I. npmを使った環境構築 II.ブラウザ開発ツール III.TraviceやGruntなどのCIの充実 #ng_jp
- 10. 開発はより早く、安く！ #ng_jp 開発者 KAIHATUSHA
- 12. シンプルなアーキテクチャ ３段変形は男の子のロマンかもしれないけど、実用的じゃないよね。 やはりデータはシンプルに！ Popular System #ng_jp RDB(table) Server (Plain Object) Frontend (javascript object) MongoDB (javascript object) NodeJS (javascript object) AngularJS (javascript object) 変換！ 変換！ object json
- 13. まずはJavaScriptを覚えよう #ng_jp エンジニアが居ないから選択肢を取れないと言うのはナンセンス フロントエンジニアを増やし 手札としてAngularJSしいてはMEAN stackを選べるように！ そのために自分たちで触って覚えよう！