見出し画像

MVCモデルによるWebアプリケーション開発(No1.ランダムウォーク)-J2EE

J2EE(JSP・Servlet)の環境でWebアプリケーションの開発方法を学ぶ講座をシリーズで提供します。初回は入力-処理-出力のシンプルな題材(ランダムウォークシミュレーション)をMVCモデルで実装してみます。


開発概要

J2EEアプリケーション・サーバ(Tomcat)を利用して開発を行うということを前提に実装を進めていきます。開発ツールには統合開発環境のEclipseを用いることにします。

最初の題材としてランダムウォークのシミュレーションを取り上げます。ランダムウォークについて詳しく説明はしませんが、過去の事象が未来の事象には影響を与えないというモデルで、都市計画や株価予測などのシミュレーションに応用されているものです。

J2EE環境ですので使用言語は当然Java(JSP・Servlet)となり、設計技法にはMVCモデルを使います。MVCモデルとはWebアプリケーションの構成をModel(業務ロジック)ーView(表示)ーController(制御)に分割して設計する技法です。3つのモデルに役割分担することで部品化が促され、ひいてはチーム開発に貢献します。

実装していく過程でEclipseの利用方法が不明な場合は、別途メール等でお知らせください。この講座では、作成済みの仕様と設計書から「J2EE環境でのMVCモデルの実装の仕組みを学ぶ」ことを目的とします。

開発方針

Webアプリケーションの開発環境には図1のようにEclipse2023を用います。

開発環境
図1.開発環境 Eclipse 2023

Spring等のフレームワークは使用しません。これは、MVCモデルにおけるhttpプロトコルの処理の実装を直に学んでいただきたいためです。

Webアプリケーション開発の最初の一歩として、仕様と最小限の設計ドキュメントを提示します。この情報をもとに、まずは、自分で試行錯誤しながら実装してみてください。

設計仕様

【ランダムウォークの仕様】
以下の条件のイメージを具現化するシミュレーションを行います。
(条件)
・コイントスをイメージします
・表がでたら100円もらえます
・裏がでたら100円取られます
・10万回の試行でコインを投げた時の最終的な予想金額を計算します
・10万回の施行を5回行い予想金額の変化を考察します

【Model(計算ロジック)の設計方針】
以下の仕様で実装します。
(仕様)
・0か1の乱数を発生させる
  Javaの例:int ran=new java.util.Random().nextInt(2);
・乱数値が0ならば予想金額の変数に100を加える
・乱数値が1ならば予想金額の変数から100を引く
・入力された試行回数繰り返し予想金額を表示する
(実装)
・JavaBeansの仕様に基づきRandomWalkBean.javaを作成します
・package名は jp.ict.aso.model とします
・作成するクラスはSerializableインターフェースを実装します
・変数はprivate宣言します
・引数なしのコンストラクタを実装します
・適切な引数を与えるコンストラクタを実装し、引数はインスタンス変数に格納します
・処理ロジックを実装します、このとき処理結果はインスタンス変数に格納します
・setterメソッドを実装します 
・getterメソッドを実装します  

外部設計

接続urlはhttp://localhost:8080/libcon/Walkとします。よってEclipseの動的Webプロジェクトの名前はlibconとなり、サーブレットのurlパターンはWalkとなります。


Eclipseのメニューバーより
ファイル→新規→動的Webプロジェクト→「libcon」プロジェクトを作成する


図2のように入力欄に試行回数(今回は10万回)を入力し、送信ボタンをクリックすることでサーバに試行回数が送られ、シミュレーションが実行されます。シミュレーションは図3のように連続して5回実行されます。

図2.ランダムウォークの入力画面
図3.ランダムウォークの結果出力画面

内部設計

クラス連携図は図4のようになります。

図4.MVCモデル図

ランダムウォークロジックのクラス図は以下のようになります。
-------------------------------------- //クラス名
RandomWalkBean
-------------------------------------- //フィールド(プロパティ)
- money:int
- kurikaeshi:int
-------------------------------------- //メソッド
+ RandomWalkBean():        //コンストラクタ
+ RandomWalkBean(kurikaeshi:int):   //コンストラクタ
+ execute():void             //ロジック
+ setKurikaeshi(kurikaeshi:int):void    //セッター
+ setMoney(mony:int):void      //セッター
+ getKurikaeshi():int         //ゲッター
+ getMoney():int           //ゲッター
--------------------------------------
- private
+ public

実装手順

1.ランダムウォークロジック用JavaBeansクラスを作成します


Eclipseパッケージ・エクスプローラより
libconプロジェクトを右クリック→新規→クラス
→以下の内容で作成


RandomWalkBean.java 
  パッケージ:jp.ict.aso.model
  名前:RandomWalkBean
  ソースコード:考えましょう!

2.リクエストコントロール用Servletクラスを作成します


Eclipseパッケージ・エクスプローラより
libconプロジェクトを右クリック→新規→その他→Web→サーブレット
→以下の内容で作成する


RandomWalkServlet.java 
  パッケージ:jp.ict.aso.controller
  クラス名:RandomWalkServlet
  ソースコード:考えましょう! ※アノテーションは/Walk

3.試行回数の入力画面のJSPファイルを作成します


Eclipseパッケージ・エクスプローラより
libconプロジェクトを右クリック→新規→その他→Web→JSPファイル
→以下の内容で作成する


・randomWalkForm.jsp
  保存場所:libcon/src/main/webapp/WEB-INF/jsp
  ファイル名:randomWalkForm.jsp
  ソースコード:考えましょう!

4.試行結果を表示するJSPファイルを作成します


Eclipseパッケージ・エクスプローラより
libconプロジェクトを右クリック→新規→その他→Web→JSPファイル
→以下の内容で作成する


・randomWalkResult.jsp
  保存場所:libcon/src/main/webapp/WEB-INF/jsp
  ファイル名:randomWalkResult.jsp
  ソースコード:考えましょう!

実行確認

サーブレットクラス(RandomWalkServlet.java)を実行します!!


Eclipseパッケージ・エクスプローラより
RandomWalkServlet.javaを右クリック→実行→サーバーで実行
→図5のように実行される


図5.実行画面

ソースコード例

以下に各プログラムのソースコードの例(本文内では「考えましょう!」になっている部分)を示しますので、実装の参考にしてください。

ここから先は

390字 / 6画像

¥ 1,000

この記事が気に入ったらサポートをしてみませんか?