Javaで簡易な掲示板を作成する方法を現役エンジニアが解説【初心者向け】

Javaで簡易な掲示板を作成する方法について解説します。実際にプログラムを書いて説明しているので、ぜひ理解しておきましょう。

 

そもそもJavaについてよく分からないという方は、Javaとは何なのか解説した記事を読むとさらに理解が深まります。
 

なお本記事は、TechAcademyのオンラインブートキャンプJava講座の内容をもとに作成しています。

 

 

 

掲示板の設計

名前とメッセージを入力して投稿する簡易的な掲示板を作成します。掲示板の内容はデータベースに保存し、投稿機能でデータ追加、ページアクセスでデータを全件表示します。

作成するものは以下です。

• データベース
• データモデル
• データベースアクセスオブジェクト(DAO)
• 投稿したメッセージの一覧表示と、投稿フォームをもつ画面
• データベースからデータを全件取得し、取得データを画面へ引き渡すサーブレット
• 画面の入力フォームの内容を元に、データベースに一件データを追加するサーブレット

eclipse　Maven MySQL を用いて実装します。またローカルのtomcatへデプロイをして動作確認を行います。

 

実際に作成してみよう

eclipseで動的WEBプロジェクトを新規作成してからMavenプロジェクトへ変換します。pom.xmlに以下3つの依存関係を追加します。

<dependencies>
  <dependency>
    <groupId>mysql</groupId>
    <artifactId>mysql-connector-java</artifactId>
    <version>5.1.45</version>
  </dependency>
  <dependency>
    <groupId>org.apache.taglibs</groupId>
    <artifactId>taglibs-standard-impl</artifactId>
    <version>1.2.5</version>
  </dependency>
  <dependency>
    <groupId>javax.servlet.jsp.jstl</groupId>
    <artifactId>javax.servlet.jsp.jstl-api</artifactId>
    <version>1.2.1</version>
  </dependency>
</dependencies>

データベースとテーブルを作成します。

create database sample default character set utf8;

create table board (id int(11) auto_increment NOT NULL PRIMARY KEY, name VARCHAR(10) NOT NULL, content TEXT );

テーブルにメッセージ登録者の名前と、メッセージ内容、メッセージを識別するためのidを持たせます。idフィールドは自動採番とします。

データモデルをテーブルの定義に対応した構造で作成します。

package sample_board;

public class Board {

  int id;

  String name;

  String content;

  /**
  * @return id
  */
  public int getId() {
    return id;
  }

  /**
  * @param id セットする id
  */
  public void setId(int id) {
    this.id = id;
  }

  /**
  * @return name
  */
  public String getName() {
    return name;
  }

  /**
  * @param name セットする name
  */
  public void setName(String name) {
    this.name = name;
  }

  /**
  * @return content
  */
  public String getContent() {
    return content;
  }

  /**
  * @param content セットする content
  */
  public void setContent(String content) {
    this.content = content;
  }



}

 

 

DAOを作成します。全件取得のメソッドと一件追加のメソッドを用意します。

 

package sample_board;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

public class BoardDAO {
  // データベース接続と結果取得のための変数
  private Connection con;
  private PreparedStatement pstmt;
  private ResultSet rs;

  //全件取得用メソッド
  public List<Board> selectAllBoard() {
    // メソッドの結果として返すリスト
    List<Board> results = new ArrayList<Board>();

    try {
      //ドライバを読み込み、DBに接続
      this.getConnection();

      // Statementオブジェクトの作成
      pstmt = con.prepareStatement("select * from board");

      //Select文実行
      rs = pstmt.executeQuery();

      // 6. 結果を表示する
      while (rs.next()) {
        // 1件ずつCountryオブジェクトを生成して結果を詰める
        Board Board = new Board();
        Board.setId(rs.getInt("id"));
        Board.setName(rs.getString("name"));
        Board.setContent(rs.getString("content"));

        // リストに追加
        results.add(Board);
      }
    } catch (SQLException e) {
      e.printStackTrace();
    } catch (ClassNotFoundException e) {
      e.printStackTrace();
    } finally {
      this.close();
    }

    return results;
  }

  //1件登録用メソッド
  public void insertBoard(Board board) {

    try {
      //ドライバを読み込み、DBに接続
      this.getConnection();

      // Statementオブジェクトの作成
      pstmt = con.prepareStatement("insert into board(name,content) values(?,?)");

      pstmt.setString(1, board.getName());
      pstmt.setString(2, board.getContent());



      //Select文実行
      pstmt.executeUpdate();



    } catch (SQLException e) {
      e.printStackTrace();
    } catch (ClassNotFoundException e) {
      e.printStackTrace();
    } finally {
      this.close();
    }
  }



  public void getConnection() throws SQLException, ClassNotFoundException {
    //ドライバクラス読込
    Class.forName("com.mysql.jdbc.Driver");

    // DBと接続
    con = DriverManager.getConnection("jdbc:mysql://localhost/sample?useSSL=false&characterEncoding=utf8", "ユーザ", "パスワード");
    // ※ユーザとパスワードはMySQLに設定済みのものを記載してください。
  }

  private void close() {
    // 接続を閉じる
    if (rs != null) {
      try {
        rs.close();
      } catch (SQLException e) {
        e.printStackTrace();
      }
    }
    if (pstmt != null) {
      try {
        pstmt.close();
      } catch (SQLException e) {
        e.printStackTrace();
      }
    }
    if (con != null) {
      try {
        con.close();
      } catch (SQLException e) {
        e.printStackTrace();
      }
    }
  }
}

画面のjspは以下のようにします。

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<% request.setCharacterEncoding("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>board</title>
</head>
<body>

  <h2>○○掲示板</h2>
  <table border="1">
    <tbody>
      <tr>
        <th>id</th>
        <th>名前</th>
        <th>メッセージ</th>
      </tr>
      <c:forEach var="message" items="${list}" varStatus="status">
        <tr>
          <td><c:out value="${message.id}" /></td>
          <td><c:out value="${message.name}" /></td>
          <td><textarea><c:out value="${message.content}" /></textarea></td>
        </tr>
      </c:forEach>
    </tbody>
  </table>
  <br /><br />

  <form method="POST" action="<c:url value='/insert' />">
    <label for="name">名前</label><br />
    <input type="text" name="name"/>
    <br /><br />
    <label for="content">メッセージ</label><br />
    <textarea name="content"></textarea>
    <br /><br />
    <button type="submit">投稿</button>
  </form>



</body>
</html>

 

<c:forEach>タグを使って、取得データをテーブルに一覧表示します。入力フォームのactionで後で記載するinsertサーブレットを起動するようにします。

 

insertサーブレットは下記のようにします。

package sample_board;

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;

/**
* Servlet implementation class SelectServlet
*/
@WebServlet("/insert")
public class InsertServlet extends HttpServlet {
  private static final long serialVersionUID = 1L;

  /**
  * @see HttpServlet#HttpServlet()
  */
  public InsertServlet() {
    super();
    // TODO Auto-generated constructor stub
  }

  /**
  * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
  * response)
  */
  protected void doGet(HttpServletRequest request, HttpServletResponse response)
  throws ServletException, IOException {

  }

  /**
  * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
  * response)
  */
  protected void doPost(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {

    request.setCharacterEncoding("UTF-8");

    Board b = new Board();

    b.setName(request.getParameter("name"));
    b.setContent(request.getParameter("content"));

    BoardDAO boardDAO = new BoardDAO();

    //1件追加
    boardDAO.insertBoard(b);

    //追加後トップページへリダイレクト
    response.sendRedirect(request.getContextPath() + "/toppage");

  }

}

 

最後にトップページを表示するサーブレットです。

package sample_board;

import java.io.IOException;
import java.util.List;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
* Servlet implementation class SelectServlet
*/
@WebServlet("/toppage")
public class SelectServlet extends HttpServlet {
  private static final long serialVersionUID = 1L;

  /**
  * @see HttpServlet#HttpServlet()
  */
  public SelectServlet() {
    super();
    // TODO Auto-generated constructor stub
  }

  /**
  * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
  * response)
  */
  protected void doGet(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {

    request.setCharacterEncoding("UTF-8");

    BoardDAO boardDAO = new BoardDAO();

    //全件取得
    List<Board> list = boardDAO.selectAllBoard();

    request.setAttribute("list", list);

    RequestDispatcher rd = request.getRequestDispatcher("/WEB-INF/board.jsp");
    rd.forward(request, response);

  }

  /**
  * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
  * response)
  */
  protected void doPost(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {

    doGet(request, response);
  }

}

 

サーバへデプロイし

http://localhost:8080/sample_board/toppage

へアクセスし、掲示板の表示と登録機能を確認しましょう。

本サンプルは簡易的なものですので、こちらを元に投稿内容を充実させたり、バリデーションをかけたり、画面装飾をつけたりとアレンジをしてみてください。

 

[PR] 未経験からWebエンジニアを目指す方法とは

監修してくれたメンター

長屋雅美 独立系SIerで7年勤務後、現在はフリーのエンジニアとして自宅をオフィスとして活動しています。 JavaやC♯、shellscriptを用いた開発を主に担当し、TechAcademyではJavaコースを担当しています。

 

TechAcademyでは、初心者でもJavaやServletの技術を使ってWebアプリケーション開発を習得できるオンラインブートキャンプJava講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。