Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12

18,127 views

Published on

2014/11/15 JJUG CCC 2014 Fall

Published in: Technology
  • Dating direct: ❤❤❤ http://bit.ly/2u6xbL5 ❤❤❤
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Follow the link, new dating source: ♥♥♥ http://bit.ly/2u6xbL5 ♥♥♥
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Spring Boot + Doma + AngularJSで作るERP #jjug_ccc #ccc_r12

  1. 1. Spring Boot + Doma + AngularJS で作る ERP(統合基幹業務システム) JJUG CCC 2014 Fall 2014/11/15
  2. 2. 自己紹介 • 名前: 松崎 学 • 福岡に住んでます • Twitter: matsumana • blog: http://matsumana.info • 所属: 株式会社キャム http://cam-net.co.jp/ • 職業: ソフトウェアエンジニア
 (プログラマ、ITインフラエンジニア)
  3. 3. 今日お話する事 • ERPとは何か? • 弊社サービスの特徴と、それを支える技術の概要
 ・アーキテクチャの歴史
 ・インフラ • Spring Boot, Doma, AngularJSを選んだ理由と
 実際に使ってみた感想
  4. 4. まず始めに
  5. 5. ERPとは何か? 企業全体を経営資源の有効活用の観点から 統合的に管理し、経営の効率化を図るための 手法・概念のこと。 ERPが一般的に扱うものは企業における 製造・物流・販売・調達・人事・財務会計である。 ERPパッケージはこれらの基幹業務に関する 業務活動の情報管理を支援する。 Wikipediaより http://ja.wikipedia.org/wiki/企業資源計画
  6. 6. 基幹システムとは何か? 企業の情報システムのうち、業務内容と直接に関わる販売や 在庫管理、財務などを扱うもの。 あるいは、単に、業務やサービスの中核となる重要なシステム。 IT用語辞典 e-Wordsより http://e-words.jp/w/E59FBAE5B9B9E7B3BBE382B7E382B9E38386E383A0.html
  7. 7. 例えばERPでカバーする サブシステムには 次のようなものがあります
  8. 8. • 受発注 • 購買債務 • 販売債権 • 製造 • 在庫 • 原価 • 財務会計 • 管理会計
  9. 9. • 人事 • 給与 • 勤怠 • などなど
  10. 10. • サービス(SaaS)として提供
 マルチテナントなアプリ
 顧客のオンプレミス環境ではなく、
 弊社が構築・運用しているインフラ環境(AWS)
 でアプリを稼働させている • インフラ費用は全て弊社負担
 インフラ費用増 = 利益減
 少ないリソースでリクエストを捌く事が非常に重要 • OSやブラウザのバージョンアップ対応は無償 サービスの特徴
  11. 11. アーキテクチャを 選定する上で重要なポイント • SaaSなので、インフラ要件はWeb系に近い
 (インフラ構成はかなり参考にしています) • ERPはミッションクリティカルかつ、ライフサイクル が長い。長い場合は10年間とか使われる
 (弊社では同じアプリを10年使い続けるのではなく
 定期的に作り直す事にしています) • 画面の操作性、入力効率、サクサク感
  12. 12. サービスの規模感 • 画面数
 約1,000画面 • テーブル数
 約750
  13. 13. サービスの歴史 フレームワーク編 • 2007∼ Seasar2 (Teeda + S2Dao)
 ※現在も稼働中 • 2012∼ Java EE 6 (JSF + JPA)
 ※現在も稼働中 • 2014∼ Spring Boot + Doma + AngularJS
  14. 14. サービスの歴史 インフラ編 • 2007∼ 国内データセンター • 2013∼ AWS
  15. 15. インフラの 全体概要図
  16. 16. http://goo.gl/cTexvM
  17. 17. • サーバやミドルウェアは必ず障害が発生する前提で
 考えたインフラ構成とアーキテクチャ • 一部に障害が発生してもサービスが止まらないように
 各レイヤーは冗長構成にする • サービスが止まるような障害の場合でも
 出来るだけ早く復旧出来るようにする ポイント
  18. 18. 使用しているソフトウェア • Webサーバ: Apache 2.2 • APサーバ: Seasar2 → Tomcat 6
 Java EE 6 → GlassFish 3.1.2.2
 Spring Boot → Jetty9.2.3.v20140905 • DBサーバ: PostgreSQL 9.3 • 監視: Zabbix 2.0
 EC2インスタンスのOSリソース監視
 APサーバをJMXで監視 (Zabbix Javaゲートウェイ) • CI,デプロイ: Jenkins
  19. 19. ログ収集はFluentd
  20. 20. • AWS (EC2, S3, Route53, SES, RDS, VPC) • GitHub • レスポンスタイム可視化: New Relic • ログ分析: Google BigQuery • 通知: HipChat 使用しているサービス
  21. 21. 次はアプリのお話
  22. 22. 2007年の サービスローンチ時から 開発を続けてきた Seasar2製のアプリですが 数年後には色んな問題が 出てきました
  23. 23. • ローンチ当時は、IE6とIE7のみサポート
 (開発を開始した2007年にはChromeは存在してない) • 2009年にリリースされたIE8で互換表示モード登場
 互換表示でしか動作しないアプリに
 なってしまった・・・ _人人 人人 人人 人人_ > 突然のオワコン感 <  ̄Y^Y^Y^Y^Y^Y^Y^Y ̄
  24. 24. 互換モード以外にもいくつか
 問題が出てきた • 時代遅れ感が出てきたUI
 リッチなWebサイトが世の中に増えて
 顧客の目が肥えてきた • 他社システムと連携するため、
 REST API提供を求められるようになった
  25. 25. 今のアプリを改修するべきか?
 それとも作りなおすべきか?
  26. 26. この時点で画面数は 数百になっていた 改修するよりも 作りなおした方が良い という結論になる
  27. 27. 候補にあがったもの • Java EE 6 (JSF) • Spring • Play Framework 1
  28. 28. その時点で 一番良さそうだった Java EE 6を選択 サポートするブラウザはIE8以上とした (互換表示モードからの脱却)
  29. 29. Java EE 6で開発と 運用をやってみたけど • JPAでハマる事が多い • CDIに@ViewScopedがない
 ※Java EE7で改善されてます • PrimeFacesではGridの列固定が出来なかった
 ※現在のバージョンでは出来ます • JSFで作った画面が重く感じる
 ※画面項目数、サーバスペック、クライアントスペック等によるので
 あくまでも当社比です
  30. 30. Java EEやPrimeFaces を使うなら 保守契約を おすすめします
  31. 31. 弊社にはJava EEは 合わないのでは?
 (́・ω・`) という気持ちになってきた
  32. 32. Java EE 6で2つの サブシステムを作ったが これ以上増やすのは やめようという結論になり
 次の手を模索する事に
  33. 33. そんなある日
 Spring Bootの存在を知る • JJUG ナイトセミナー 2014/01/21
 @makingさんの
 「Spring4とSpring Bootで作る
 次世代Springアプリケーション」
 http://www.slideshare.net/makingx/spring-4spring-boot-spring-jjug-jsug
  34. 34. 早速試してみた • Springで大変だと聞いていたxml設定ファイルや
 依存関係の複雑さが解決されているし、
 組み込みAPサーバもいい感じ
 • 元々、SpringとDropwizardに注目していたので
 いいとこ取りな感じがとても良い
  35. 35. いくつか候補をあげて 比較検討
  36. 36. 要件を再度整理 • 少ないリソースで、多くのリクエストを捌けて
 スケールしやすいアーキテクチャ
 (ステートフルなアプリはスケールさせにくいので
 ステートレスが良さげ) • サクサク動く画面にしたい • UIを改善したい • モダンブラウザにも対応したい
 (顧客からChrome対応の要望がかなり多い)
  37. 37. 候補1 • Java EE 7(JSF) + Doma
 
 対応する商用アプリケーションサーバが
 未リリースなのでNG
 (リリース時期も未定だった)
  38. 38. 候補2 • Spring Boot (Spring MVC + Thymeleaf) + Doma
 
 JSFの複合コンポーネント的なものがない
 JSPだとカスタムタグがあるが
 Spring BootはJSPを推奨していないみたい
  39. 39. 候補3 • Spring Boot (Spring MVCでAPI) + Doma
 + Backbone.js
 
 JSFの複合コンポーネント的なものがない
 Backbone.jsで構造化は出来るが
 生産性がもっと高いものが良い
  40. 40. 候補4 • Spring Boot (Spring MVCでAPI) + Doma
 + AngularJS
 
 Directiveがカスタムタグの代替にはなりそう
 フロントフレームワークの中では遅い部類だと
 言われているが、試してみるとJSFよりサクサク動く
 ※当社比
  41. 41. そんな経緯で Spring Boot
 +
 Doma
 + AngularJS
 を採用
  42. 42. 開発はLinux上で やってます
  43. 43. • Windowsで開発し、本番がLinuxだと
 それに起因するバグを出してしまう事がある
 
 文字コード、改行コード、パス区切り文字
 レポートのレイアウト崩れ(iText, iReport)
 など
  44. 44. • 必要な開発ツールのごった煮感が半端なくて、
 セットアップが大変なので
 チームのメンバーにVirtualBoxとVagrantを
 インストールしてもらい、
 boxファイルとChefのcookbookを配布
 
 ※ホストOSとゲストOSでクリップボードの共有が
 おかしいので、ちょっと不便です・・・
  45. 45. プロビジョニングしている ソフトウェア (1) • Java8 • Maven • Node.js • PostgreSQL 9.3 • Fluentd (td-agent)
  46. 46. プロビジョニングしている ソフトウェア (2) • Chromium • Mozc • LibreOffice • oh-my-zsh • xrdp
  47. 47. Spring Boot, Doma,
 AngularJSを 使ってみた感想など
  48. 48. Spring Boot / Spring • Seasar2とJava EE 6を使ってきたので、
 Springのコンテナ機能(DI, トランザクション, AOPなど) は理解しやすかった • テストライブラリが充実していて良い感じ • ユニットテストもJettyも起動が早く快適に開発できる
 ※当社比 • サーバのリソース消費が少ない
 (TomatではなくJettyを選択
 早い時期からJava8やWebSocketに対応していた為)
  49. 49. Doma • SQLでゴリゴリ書きたい派には、とてもオススメ • 依存ライブラリが無いのも、とてもいい感じ • 便利機能がいっぱい
 ・Java8対応
 ・コンパイル時チェック
 ・SQLファイル内の変数チェック
 ・SQLファイルの存在チェック
 ・ページング (Limit, Offset, 総レコード件数) 他にも沢山あります。詳しくはドキュメントを http://doma.readthedocs.org/ja/latest/
  50. 50. AngularJS • 学習コストは確かに高いが、現在は日本語の書籍も
 あるので、多少は改善されているのかも • Directiveにてデザインと動作を共通化した部品が
 作成でき便利 • ライブラリはangular-bootstrapだけ使う事にした
 (その他で必要なものは自分たちで作る方針にした) • バージョンアップで後方互換性が保たれない
 (弊社の場合はアプリを改修して、バージョンアップ 
 に追従していく方針にした)
  51. 51. 弊社でのAngularJSの 使い方を少しだけご紹介 • Directiveに画面レイアウト情報とデータを与えて
 画面項目を動的に生成
 マルチテナントなアプリなので、
 顧客ごとのカスタマイズをマスタで行えるようにしています
  52. 52. <hoge-form-grid layout-src="layout.formLayout" model-src="model" > </hoge-form-grid> <hoge-table-grid-paging layout-src="layout.tableLayout" model-src="model" > </hoge-table-grid-paging> <hoge-table-grid layout-src="layout.tableLayout" model-src= model"> </hoge-table-grid>
  53. 53. モジュール構成 (概要) • Javaのビルドルーツ: Maven • フロントエンドのタスクツール: Grunt
 maven-grunt-pluginを使ってMavenから起動される
 jshint, karma(Jasmine), concat, cssmin, uglifyを実行する
  54. 54. Spring BootやDomaに 関するブログを いくつか書いてます
  55. 55. • Spring BootでISUCON4予選のJava実装を作った • Spring Bootで現在捌いているリクエスト数を
 取得する • Spring + Domaで実装したアプリのユニットテスト • Domaで実行したSQLを取得する • Spring Boot + Domaで動的データソース切り替え http://matsumana.info/blog/categories/spring/
  56. 56. Springの資料としては TERASOLUNAの ガイドラインが おすすめ http://terasolunaorg.github.io/guideline/
  57. 57. Springユーザだけではなく
 Java EEユーザにとっても 参考になると思います
  58. 58. AngularJSは業務システムに 使えるのか? • 品質的には業務で使っても問題ないと思う • 画面モック(素のHTML)を元にアプリ作成可能 • AngularJSに限った事ではないが、
 現在流行っているフロントフレームワークが
 5年後、10年後も互換性を保った状態で流行っている とは考えにくい
 「動かなくなったらフロントだけ作りなおせば良い」
 という意見はあると思うが、フロントフレームワーク を使わなければ、発生しない不要なコストなのかも
  59. 59. フロントフレームワーク を採用する場合に 考えてもらいたい事 • そのシステムは何年間くらい使われるのか?
 (ソフトウェアの償却期間は、3年もしくは5年です) • フレームワークのバージョンアップに追従する予算は 確保出来るのか?
  60. 60. 次のような場合は Java EE(JSF)を 選択した方が 良いのかも (個人的な意見です)
  61. 61. • 保守サポートが必要な場合 • フロントフレームワークのバージョンアップに伴う
 改修の予算が確保できない場合
  62. 62. 弊社の今後 • Spring Boot + Doma + AngularJSは
 弊社にはあっているので今後も使い続けるつもり
 
 AngularJSで業務システム作っている方、
 ぜひ情報交換させてください!
  63. 63. まとめ • 標準技術だから。流行っているから。ではなく
 きちんと検討・検証して自分達にあうものを
 選びましょう
  64. 64. 事例の一つとして 何かのお役に立てば 幸いです ありがとうございました!

×