33
WEBアプリケーションフレーム ワークとその応用 宮城大学事業構想学研究科 北野 宮城大学事業構想学部 須栗 裕樹 宮城大学事業構想学部 富樫

WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

WEBアプリケーションフレームワークとその応用

宮城大学事業構想学研究科 北野 優 宮城大学事業構想学部 須栗 裕樹   宮城大学事業構想学部 富樫 敦  

Page 2: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

WEBアプリケーションは無数につくられている

YAHOO!オークション

mixi

GREE

Amazon

Webアプリケーションだらけ!

小規模のものも、相当数作られている ・本研究は、小規模なWebアプリケーションを効率的に作る研究

Page 3: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

開発の工数削減が求められている

削減

早く 安く

Page 4: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

仕様が変わる

仕様変更要求

プログラム修正

¢  ビジネスに情報システムの存在が既に組み込まれている

Page 5: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

WEBアプリケーションフレームワークの役割

¢ 工数を減らす。 Webアプリケーションとして基本的なライブラリをまとめる。 HTTPがステートレスである。画面遷移や利用者の管理を行うために必要なセッション管理を,Webアプリケーション側で行う必要がある。

¢ 品質を一定にする。 セキュリティ処理などを一元的に行い、一定以上の品質のものを作りやすくする。

Page 6: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

既存のフレームワークは工数の削減が十分でない

¢ Ruby On Rails 設定ファイルは少ないが、厳密なモデルを要求する。 MVCモデルを採用 学習コストが高い ¢ Struts 設定ファイルが多い。 MVCモデルを採用。 厳密なモデルを要求する。 学習コストが高い。

Page 7: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

学習時間が多すぎる。様々な技術を覚える必要がある。  言語も難しい。

学習時間

技術

言語

Page 8: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

RORの使用頻度

縦軸:Ruby on Railsで開発されたプロジェクト84を100とした時の割合 縦軸:使用頻度順のクラス

使用プロジェクト数

Page 9: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

ROR の使用頻度

縦軸:Ruby on Railsで定義されているクラス総数579を100とした時の割合 縦軸:プロジェクト

使用クラス数

Page 10: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

MVCモデル

Page 11: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

プログラマの分散ができない

モデル設計

プログラマ

プログラマ

プログラマ

Page 12: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

仕様変更に対応する必要がある。

仕様変更要求

プログラム修正

Page 13: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

デザインとプログラムの分離

デザイン

プログラム プログラマ

修正

修正

Page 14: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

一般のテンプレートの例

<html> <body> <!-- <% foo.data %> --> </body> </html>

Page 15: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

RUBYON RALSのテンプレート

<html><body> 誕生日の編集 <%form_tag :action => 'edit', :id => @patient do %> <%=render :partial => 'form' %> <br> <%=link_to 'Patient List', :controller => 'patient_id' , :action => 'patientList' , :id => @birthday %> <br><br> <%=submit_tag 'Edit' %> <%end %> </body></html>

Page 16: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

結局分離できない。 Viewに記述するコードは複雑化する傾向がある。 デザイナー自由に作業できない。

Page 17: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

提案する手法

¢ Perlを採用したWebアプリケーションフレームワークである。

¢ 必要最小限のフレームワークにした。  セッション管理 HTMLテンプレート ファイルボックス機能 XML生成機能に絞った。

¢ MVCモデルを簡略化した、軽量MVCモデルを採用した。

Page 18: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

軽量MVCモデル

Page 19: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

提案するWEBアプリケーションフレームワーク

Page 20: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

モジュール構造

Page 21: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

基本的な構造

Page 22: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

ファイルボックス

Page 23: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

エクセル(XML)生成の例

Page 24: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

エクセル(XML)出力例

Page 25: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

開発の一例

¢ 宮城県は大地震と津波の被害を受けた

Page 26: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

2つの駅を喪失し、仮設住宅が多数作られた

被災

Page 27: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

バス路線とダイヤの見直しが必要になった

旧バス路線

震災前

旧バスダイヤ

新バス路線

震災後

新バスダイヤ

路線やダイヤを変える必要が出てきた。

Page 28: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

そこで、現状把握のためのアプリケーションをWEBアプリケーションで開発 した

WebアプリケーションとiPhone(情報収集用)で開発

バス乗降システム

情報が入ってるくると、要求仕様が変わっていった・・・・

Page 29: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

第1ステップ現在の運用を一覧表にした

Page 30: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

第2ステップ集計を行った

Page 31: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

第3ステップ GOOGLE MAP に表す

Page 32: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

テンプレート例

Page 33: WEBアプリケーションフレーム ワークとその応用swim/jpn/presentations/swim2012... · 2012. 5. 27. · WEBアプリケーションフレームワークの 役割!

まとめ ¢ Webアプリケーションフレームワークを開発  軽量なMVCモデルの提案  →学習しやすい。  →分散開発が行い易い。  →仕様変更に強い。  →デザインとコードの分離。 ¢ 山元町で活用したコミニティバス運用支援Webアプリ

ケーションフレームワークを開発した