JSPファイルの作り方！Hello JSP を表示するまでの基本手順

先生と生徒の会話形式で理解しよう

生徒

「JSPの勉強を始めたいんですが、まずはどうやってJSPファイルを作るんですか？」

先生

「JSPはJavaとHTMLを組み合わせてWebページを作る技術です。最初に表示させる『Hello JSP』から始めるのがわかりやすいですね。」

生徒

「JSPファイルって何に書けばいいんですか？HTMLと同じように書けるんですか？」

先生

「もちろんです！HTMLと似た書き方で作れますよ。では、JSPファイルの作り方とHello JSPの表示手順を順を追って見ていきましょう。」

1. JSPとは？Javaで動的なWebページを作る技術

JSP（JavaServer Pages）は、Javaを使って動的なWebページを作成するための技術です。HTMLにJavaコードを埋め込むことで、条件分岐や繰り返し処理、データベースとの連携などが可能になります。

初心者にとっては、最初に「Hello JSP」と表示する基本的なページを作るところから始めるのが効果的です。

2. 開発環境の準備：JSPを動かすために必要なもの

JSPファイルを作成して動かすためには、いくつかの環境が必要です。

JDK（Java Development Kit）：Javaの開発に必要
Tomcat：JSPを実行するためのサーブレットコンテナ
テキストエディタまたはEclipseなどのIDE：JSPファイルを作成・編集
Webブラウザ：JSPページの確認

特にTomcatは、JSPやServletの実行に必須なのでインストールしておきましょう。

3. JSPファイルの作成：拡張子は.jsp

JSPファイルは、拡張子が「.jsp」であることが特徴です。メモ帳やVisual Studio Code、Eclipseなどで新しいファイルを作成し、次のような内容を書いて保存します。


<%@ page contentType="text/html; charset=UTF-8" %>
<html>
<head>
<title>Hello JSP</title>
</head>
<body>
<h1>Hello JSP</h1>
</body>
</html>

このJSPファイルは、HTMLとほぼ同じ構造ですが、<%@ page %>ディレクティブが先頭にあり、これはページの設定を意味します。

4. JSPファイルの配置場所：Tomcatのwebappsフォルダ

作成したJSPファイルは、Tomcatの以下の場所に配置する必要があります。

Tomcatインストールディレクトリ/webapps/任意のフォルダ名/

たとえば、「hello.jsp」というファイルを「webapps/test/」フォルダに置いた場合、次のURLでアクセスできます。

http://localhost:8080/test/hello.jsp

5. JSPファイルをブラウザで表示する

Tomcatを起動したあと、ブラウザで先ほどのURLにアクセスすると、以下のような表示がされます。


Hello JSP

これでJSPファイルの作成と表示が成功したことになります。

6. Javaコードを埋め込んだJSPの例

JSPの特徴は、HTMLにJavaの処理を埋め込める点にあります。次のように、Javaのコードで変数を定義して表示することもできます。


<%@ page contentType="text/html; charset=UTF-8" %>
<html>
<body>
<% String name = "太郎"; %>
<p>こんにちは、<%= name %>さん！</p>
</body>
</html>

このコードを実行すると、次のように表示されます。


こんにちは、太郎さん！

7. よくあるエラーとその対処法

JSPの学習で最初によくあるエラーをいくつか紹介します。

HTTP Status 404：JSPファイルのパスが間違っているか、Tomcatが再起動されていない
JSP構文エラー：Javaコードの書き方に誤りがある
文字化け：contentTypeの設定ミスやブラウザの文字コード設定が原因

特に「文字化け」は初心者がよくつまずくポイントなので、charset=UTF-8の設定を忘れずに入れましょう。

8. JSPファイルを効率よく管理するコツ

開発が進むと、複数のJSPファイルを管理する必要が出てきます。以下のような工夫で効率よく開発できます。

JSPファイルを機能ごとにフォルダ分け
共通部分（ヘッダーやフッター）は<jsp:include>で分割
処理はサーブレット、表示はJSPに役割分担する

こうした管理方法を覚えることで、JSP開発がよりスムーズになります。

まとめ

JSPファイルの作り方と基礎操作を丁寧に振り返ろう

今回の記事では、「Hello JSP」を表示するまでの手順を中心に、JSPの基本的な仕組みや開発環境、配置場所、そしてHTMLとの違いなどを一つひとつ確認してきました。JSPはHTMLのように見えて実はサーバーサイドで動く仕組みを持っているため、その内部処理を理解するとWebアプリケーション開発の幅が大きく広がります。特に初学者にとって、最初に「どこに書くのか」「どこに置けば動くのか」が明確になることで、つまずきやすいポイントを避けながら学習を進められます。

JSPはJavaとHTMLを組み合わせて動的なWebページを作る技術であり、サーバーがリクエストを受け取るたびにJavaコードを実行して結果をHTMLとして返します。この仕組みは静的なHTMLにはない特徴であり、時間によって画面を変えたり、データベースから取得した値を反映したりと、より高度なページ生成が可能になります。JSPにJavaコードを埋め込む部分は、初めは複雑に感じるかもしれませんが、<% %>や<%= %>などの基本構文を理解すれば自然と読み書きができるようになります。

また、今回の手順で重要だったのは「配置場所」と「Tomcatの動作」です。JSPは適切なフォルダに置かれていなければブラウザからアクセスできませんし、Tomcatを正しく起動していなければ当然表示されません。URLの指定やフォルダの構成は最初の大きな壁ですが、一度慣れるととてもシンプルです。特にwebappsフォルダの仕組みやJSPファイルの位置を意識すると、Webアプリケーションの構造を理解する第一歩になります。

さらに、Javaコードを埋め込んだJSPの例では、JSPが単なるHTMLではなくサーバーサイドの処理を担える点がよくわかったと思います。変数を扱ったり、条件分岐で表示を変えたりする流れは、アプリケーション開発に欠かせない基礎スキルです。こうした基本を押さえておくと、ControllerとViewを分けるMVCモデルの考え方に進む際にもスムーズに理解が深まります。

以下では、記事の流れの総復習として「Hello JSP」を表示する基本コードを改めて整理して紹介します。実際に試しながらコードの意味を考えることで、JSPの基礎がより確かになります。

Hello JSP を表示するサンプルコード


<%@ page contentType="text/html; charset=UTF-8" %>
<html>
<head>
    <title>Hello JSP</title>
</head>
<body>
    <h1>Hello JSP</h1>
</body>
</html>

また、JSPの醍醐味でもある「Javaコードの埋め込み」を確認できるサンプルとして、次のようなコードも挙げられます。


<%@ page contentType="text/html; charset=UTF-8" %>
<html>
<body>
<% String name = "太郎"; %>
<p>ようこそ、<%= name %>さん！</p>
</body>
</html>

このように、JSPではJavaの変数やロジックを簡単に扱うことができるため、動的なページ生成が容易になります。HTMLだけでは実現できない柔軟性があり、フォルダ構成やTomcatの挙動を理解するとさらに開発しやすくなります。この記事で整理した基礎知識は、今後JSPを使ってログイン機能を作ったり、データベースと連携したWebアプリケーションを作る上でもしっかり役立つ内容です。

最後に、学習をより確実にするために、この記事で学んだ内容を生徒と先生の会話形式で振り返ってまとめています。理解の確認や復習に役立ててください。

先生と生徒の振り返り会話

生徒：「先生、最初はJSPが難しそうに見えたんですが、基本の流れが分かったら意外とシンプルですね。」

先生：「そうでしょう。JSPはHTMLにJavaを書けるという特徴さえ理解すれば、基礎はすぐ身につきますよ。」

生徒：「Tomcatのフォルダに置く場所も大事なんですね。知らないとブラウザに表示されない理由がわからないところでした。」

先生：「配置場所はとても重要です。URLとフォルダ構成の関係がわかると、Webアプリケーションがぐっと理解しやすくなりますよ。」

生徒：「Javaのコードを直接書けるのも面白かったです！変数を使ったりメッセージを表示したり、動的な動きがよく分かりました。」

先生：「その調子です。JSPは今後のServlet学習にもつながるので、ぜひ今回の基礎をしっかり活かしていきましょう。」

生徒：「はい！まずは今回のHello JSPを自分でも作ってみます！」

この記事を読んだ人からの質問

プログラミング初心者からのよくある疑問／質問を解決します

JSPとは何ですか？HTMLとの違いは何ですか？

JSP（JavaServer Pages）はJavaを使って動的なWebページを作成する技術です。HTMLとの大きな違いは、Javaコードを埋め込むことで、条件分岐やデータ処理などが可能になる点です。

サーブレットやJSPの基礎を体系的に理解したい人には、定番の入門書がこちらです。

スッキリわかるサーブレット＆JSP入門をAmazonで見る

※ Amazon広告リンク

元・職業訓練講師が直接指導【サーブレット & JSP実践セミナー】

職業訓練講師が解剖！Java Web開発の真髄「Servlet/JSP」とMVCアーキテクチャの本質。

累計120万PV超の技術メディア運営チームが贈る、商用開発基準の特別カリキュラム

職業訓練講師が解剖！Java Web開発の真髄「Servlet/JSP」とMVCアーキテクチャの本質。

Spring Boot等のモダンなフレームワークの背後で動く、Web開発の原点ServletとJSP。本講座では、HTTPリクエストからレスポンスまでのライフサイクルを徹底解剖。MVCモデルの真の役割分担を明確にし、ブラックボックス化されたWebの仕組みを「自力で制御する力」を60分で養います。