1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Java Servlet/JSP 環境構築メモ

1
Posted at

JSPやServlet(Java Webアプリ)を動かすための環境構築手順と用語のまとめ。
単にコンパイルするだけでなく、Webコンテナ(Tomcat)などの環境が必要となるらしい。
VScodeでの実践

1. 用語解説

Webアプリが動く仕組みのイメージ:

Apache (Webサーバー) → Tomcat (Webコンテナ) → Java (Servlet/JSP)

用語 説明
JSP HTMLの中にJavaを埋め込めるファイル(拡張子 .jsp)。表示周りの処理が得意。
Servlet Javaコードの中にHTMLを出力する処理を書くイメージ。Get / Post 通信などの制御処理が得意。
Get / Post Webリクエストの種類。フロント(画面)からバックエンド(サーバー)へデータを送る手段。
ネットワーク関係で結構重要なので、必要なら理解を深める必要あると思う
Tomcat Webコンテナ。サーバー上でJavaのWebアプリを動かすためのエンジン。これがないとjavaが動かせないらしい。jakarta.servlet.http.HttpServlet; などを提供、実行する。
Apache Webサーバー。URLを受け取り、適切なファイルを返す役割(Tomcatの手前にいることが多い)。
pom.xml Mavenの設計図。依存関係(ライブラリ)やビルド手順を記述するXMLファイル。
Maven Javaのビルドツール。コンパイルやライブラリ管理を自動化してくれる。

2. 環境構築手順

① Apache Tomcat のインストール

実行環境(Webコンテナ)を整える。今回はバージョン 10.1.50 を使用。

  • 公式サイト: Apache Tomcat® - Welcome!

  • 手順: インストーラーをダウンロードし、基本的にはデフォルト設定のままインストールを完了させる。

② ディレクトリ構成の作成

Mavenプロジェクトの一般的なディレクトリ構造に合わせてフォルダを作成する。

プロジェクト名/
├── pom.xml                   ← (設定ファイル:Mavenの設計図)
└── src/
    └── main/
        ├── java/             ← (Javaのソースコード置き場)
        │   └── com/
        │       └── example/  ← (パッケージ名:任意)
        │           └── YourServlet.java
        │
        └── webapp/           ← (Web公開用ルート:HTML/CSS/JS)
            ├── index.jsp
            ├── input.html    ← (★作成するHTML)
            ├── success.html
            ├── styles.css
            ├── scripts.js
            └── WEB-INF/      ← (ブラウザから直接アクセスさせない場所)
                └── web.xml   ← (設定ファイル:省略可能な場合もあり)

③ pom.xml の配備

pom.xml に依存関係などを記述する。

  • ※エディタ上で謎のエラーが出る場合は、pom.xml を右クリック → 「Reload Project」 で直ることが多い。

④ Maven のインストール

ビルドツールをPCに導入する。

⑤ VS Code への Tomcat 登録

VS Code上でTomcatを操作できるように設定する。

  1. VS Codeの Servers パネルを開く。(サイドバー下部や拡張機能エリアにある)

  2. 「Create New Server」(またはサーバーアイコン)をクリック。

  3. 「No, use server on disk」 を選択。

  4. 解凍済みの apache-tomcat-10.x.xx フォルダを選択する。

  5. サーバーの種類で 「Apache Tomcat 10.x」 を選択。

  6. 「Finish」で完了。

Tips: サーバー起動時にPending状態で止まる場合は、ポート番号が競合している可能性があるため、Serverの設定(Edit Server)からポート番号を変更する。


3. ビルドと実行(デプロイ)

手順1:Mavenビルド

VS Codeの Maven パネルから実行する。

  1. ctrl+shift+Pでコマンドパレットを表示

  2. create java programs で検索し、maven を選択。

  3. Maven パネルが出現するので展開し、プロジェクト名(localAppsなど) > Lifecycle を開く。

  4. clean を実行(推奨:古いファイルを掃除)。

  5. package を実行(ビルド作成)。

    • 成功すると target フォルダ内に .war ファイルが生成される。

手順2:Tomcatへのデプロイ

  1. Servers パネルで、登録した Apache Tomcat 10.x を確認。

  2. 右クリックメニュー等から 「Add Deployment」 を選択。

  3. 「No, use server on disk」target フォルダ内の .war ファイル を選択。

手順3:サーバー起動と確認

  1. Apache Tomcat 10.x を右クリックして 「Start」

  2. デプロイしたアプリを右クリックして 「Publish Server (Full)」

    • 状態が Started (Synchronized) になればOK。
  3. ブラウザで以下のURLにアクセスして動作確認を行う。

Plaintext

http://localhost:8080/finalName/home.html

8080 は設定したポート番号、learn は pom.xml の <finalName> で設定した名前。home.htmlは初期画面

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?