Java で作る Webアプリケーション開発入門

Eclipse を使った Webアプリケーションを開発の入門として、 HelloWorld アプリの作成をしてみます。良く作られる MVC (Model-View-Control) のカタチとして最低限のものを作ってみます。

概要
プロジェクトの作成
実装
実行
- 環境準備
- テスト実行

概要

今回作成する Webアプリケーションは単純に画面に "Hello World !" を表示させるだけです。ただ、これから作る Webアプリケーションのひな形になれるよう、 MVC のカタチをとってみます。

MVC とはアプリケーションの作り方で、 Model、View、Control の 3機能に分割してアプリケーションを作る作り方です。今回の Java (Apache + Tomcat) であれば Model は JavaBeans (Javaクラス)、 View は JSP、Control はサーブレットになります。

プロジェクトの作成

Webアプリケーションプロジェクトの骨組みを作ります。

[File]-[New]-[Dynamic Web Project] を選択。
Project name に任意の名前を入力。
[New Runtime] を押下。
（Eclipse インストール後の初回起動の場合ターゲットランタイムの設定が必要です。一度設定されているようであればこの手順はスキップ。）
インストールした Tomcat のバージョン、[Create a new local server]を選択して [Next] を押下。
Tomcat をインストールしたディレクトリ（CATALINA_HOME）を指定して [Finish] を押下。
（デフォルトインストール先の場合 "C:\Program Files\Apache Software Foundation\Tomcat 8.0"）
[Next] を押下。
デフォルト設定のまま [Next] を押下。
[Generate web.xml deployment descriptor] を選択して [Finish] を押下。

（web.xml は Webアプリケーション構成を記述するファイルです。）

実装

実装では Servlet、JavaBeans、JSP の 3ファイルを作成します。

Servlet (Controller)

新規作成したプロジェクト [WebApplication1] を右クリック、[New]-[Servlet] を選択。
追加するサーブレットの設定をして [Finish] を選択。

Projcet

WebApplication1 (追加先プロジェクト名を選択)

Sorce folder

\WebApplication1\src (プロジェクト配下の src を指定)

Java package

sample.controllers (いわゆる名前空間の指定)

Class name

HelloWorldController (クラス名を指定)

Superclass

javax.servlet.http.HttpServlet (必ず HttpServlet を継承)

以下のコードをコピー&ペースト。

package sample.controllers;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import sample.models.HelloWorldModel;

/**
 * Servlet implementation class HelloWorldController
 */
@WebServlet("/HelloWorld")
public class HelloWorldController extends HttpServlet {
  private static final long serialVersionUID = 1L;
       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public HelloWorldController() {
        super();
    }

  /**
   * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
   */
  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // Modelの生成
    HelloWorldModel model = new HelloWorldModel();
    model.setMessage("Hello World !");

    // ViewへModelデータを渡す準備
    request.setAttribute("model", model);
    
    // Viewを表示
    this.getServletContext()
        .getRequestDispatcher("/WEB-INF/sample/views/HelloWorldView.jsp")
        .forward(request, response);
  }
}

L14: このサーブレットを呼び出すときのURLを指定します。ここで指定した値は "http://サーバー名/プロジェクト名/○○" の "○○" に相当する部分になります。

L34: JSPへデータを渡す準備をします。第1引数で指定した文字列を使ってJSP側でデータを取り出します。

L37～L39: JSPへ処理を転送させます。 JAVAではフォワードと呼ぶそうです。

JavaBeans (Model)

新規作成したプロジェクト [WebApplication1] を右クリック、[New]-[Class] を選択。
追加するクラスの設定をして [Finish] を選択。

Sorce folder

\WebApplication1\src (プロジェクト配下の src を指定)

Package

sample.models (いわゆる名前空間の指定)

Name

HelloWorldModel (クラス名を指定)

以下のコードをコピー&ペースト。

package sample.models;

public class HelloWorldModel {
    private String message = "";
    
    public void setMessage(String value){
        this.message = value;
    }
    
    public String getMessage(){
        return this.message;
    }
}

JSP (View)

新規作成したプロジェクト [WebApplication1] を右クリック、[New]-[JSP File] を選択。
追加するJSPの設定をして [Finish] を選択。

Enter or select the parent folder

WebApplication1/WebContent/WEB-INF/sample/views (JSP配置先を選択)

File name

HelloWorldView.jsp (任意のファイル名)

以下のコードをコピー&ペースト。

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>HelloWorldサンプル</title>
</head>
<body>
  <p>${requestScope["model"].message }</p>
</body>
</html>

L9: サーブレットでセットされたデータを取り出します。単純に ${model.message} といった記載もできます。