EclipseでMavenプロジェクトを作成しSpringMVCを用いた簡易サイトを構築してみる。

会社の新人研修用に作成したものです。
記事の内容に誤りがあるかもしれません。その時は申し訳ないです。:bow_tone1:
## Eclipseのダウンロード
###Pleiades All in One Eclipse ダウンロード
以下のサイトよりEclipseをダウンロードします。
http://mergedoc.osdn.jp/

今回は、「Eclipse 2019-03」をダウンロードしました。
![eclipse1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/d9e587b8-5fd3-ffc4-861c-b9137d78c231.png)

開発環境に合わせてダウンロードしてください。
「Windows 64bit」の「Java Full Edition」をダウンロードしました。
2GBほどありますのでダウンロードに少し時間がかかります。
![eclisep2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/d3b7694f-dedd-b01d-2255-096691c89d96.png)

ダウンロード後、任意の場所に配置し解凍すれば完了です。
解凍にもそれなりに時間がかかります。

##Eclipseの起動およびMevenプロジェクト作成
解凍しましたら、「eclipse」フォルダにある「eclipse.exe」を実行します。
![eclipse3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/468d1b56-01da-5256-669f-e1f6858f0d25.png)
ワークスペースは任意で指定してください。
Eclipseが起動しますと画面左のタブに「パッケージ・エクスプローラー」が表示されます。

![eclipse4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/100b8075-e49c-1140-559b-427d7d2cd819.png)

##MavenのWebアプリケーションプロジェクト作成
「Mavenプロジェクトの作成」リンクを押下しましょう。
「新規Mavenプロジェクト」ダイアログが表示されます。
「プロジェクト名およびロケーションの選択」はそのまま「次へ」を押下します。
![maven1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/54def157-2bdc-2681-1b90-98ba17148447.png)

「アーキタイプの選択」では、以下を選択し「次へ」を押下します。
　グループID：「org.apache.maven.archetypes」
　アーティファクトID：「maven-archetype-webapp」
　バージョン：「1.0」
![maven2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/defe65f1-3268-019d-4fc1-4559fa90f69b.png)
「アーティファクトのグループ id を入力してください。」では、プロジェクトにあった設定を行い「完了」を押下します。
　グループID　　　　：任意（ルートパッケージなります）
　アーティファクトID：任意（プロジェクト名になります）
　バージョン　　　　：任意（プロジェクトのばーじょんになります）
　パッケージ　　　　：グループID、アーティファクトIDを入力すると自動で設定されます。
![maven3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/5de9b16f-c231-7e09-7461-a74997e159d4.png)
プロジェクトが以下のように作成されます。
「index.jsp」でエラーがでてますが、現時点では気にしなくても大丈夫です。
![maven4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/c2e13c80-aea2-1cb4-6b40-53e4f178dcdf.png)


###そもそもMavenとは？
Java用プロジェクト管理ツールのことで、ソースコードを自動コンパイルしたり、第三者が作ったライブラリを自身のソースコードに取り込んで実行可能なファイルを作成してくれたりします。
Mavenはpom.xmlという定義ファイルに記述することでライブラリを自動で追加してくれたり、ソースを変更すると自動でビルドし直してくたりと、大変便利なツールです。
###pom.xmlの編集
Maven定義ファイルであるpom.xmlを編集していきます。
「pom.xml」を開くとデフォルトは以下のようになっています。

```xml
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>jp.co.sample</groupId>
  <artifactId>testprj</artifactId>
  <packaging>war</packaging>
  <version>0.0.1-SNAPSHOT</version>
  <name>testprj Maven Webapp</name>
  <url>http://maven.apache.org</url>
  <dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>3.8.1</version>
      <scope>test</scope>
    </dependency>
  </dependencies>
  <build>
    <finalName>testprj</finalName>
  </build>
</project>
```
以下のように修正し、必要なライブラリを追加していきます。
※追加時にEclipseのコードフォーマッタ(Ctrl+Shift+F)で整形しました。

```xml
<project xmlns="http://maven.apache.org/POM/4.0.0"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<groupId>jp.co.sample</groupId>
	<artifactId>testprj</artifactId>
	<packaging>war</packaging>
	<version>0.0.1-SNAPSHOT</version>
	<name>testprj Maven Webapp</name>
	<url>http://maven.apache.org</url>

	<!-- ①ライブラリバージョンなどプロパティ情報を定義 -->
	<properties>
		<!-- Generic -->
		<java.version>1.8</java.version>

		<!-- servlet -->
		<servlet.version>3.1.0</servlet.version>
	</properties>

	<!-- ②追加するライブラリを定義 -->
	<dependencies>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>javax.servlet-api</artifactId>
			<version>${servlet.version}</version>
			<scope>provided</scope>
		</dependency>
	</dependencies>

	<!-- ③ビルドおよび実行ファイル生成の設定を定義 -->
	<build>
		<finalName>testprj</finalName>
		<pluginManagement>
			<plugins>
				<plugin>
					<artifactId>maven-compiler-plugin</artifactId>
					<configuration>
						<source>${java.version}</source>
						<target>${java.version}</target>
					</configuration>
				</plugin>
			</plugins>
		</pluginManagement>
	</build>
</project>
```
①、②、③の部分を追加しています。
junitのライブラリは今回の説明では不要なので削除しました。

###プロジェクトの更新
pom.xmlの編集後、mavenの「プロジェクトの更新」を行います。
![pom2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/6efca42e-3d47-38a7-399d-389b1df431ca.png)

「Mavenプロジェクトの更新」ダイアログが表示されます。
「OK」を押下し更新を行います。
![pom3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/dbe5b0ac-0ce9-f352-d7ad-648690c74833.png)
###ローカル・サーバーの構築
Webアプリケーションを動かすにはWebサーバーが必要です。
eclipseにはローカル環境にWebサーバーを構築してWebアプリを実行できる機能があります。
まずはビューに「サーバー」タブを表示させます。
「ウィンドウ」→「ビューの表示」→「サーバー」（または「その他」）を選択すると、「サーバー」タブが表示されます。
![server.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/554815ce-63db-be85-4dcc-78966ab64be7.png)
「その他」の場合は、「ビューの表示」ダイアログより「サーバー」を選択し「開く」ボタンを押下します。
![server2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/a649e1d5-2f7d-ad69-74ae-c3a2bfd1d2c1.png)

右下のビューに「サーバー」タブが表示されました。
「使用可能なサーバーがありません。…」というリンクを押下します。
![server3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/f4efb828-f3d7-0490-567f-52f0195da91d.png)
「新規サーバーの定義」ダイアログが表示されます。
プロジェクトのJavaバージョンに合わせてTomcatを選択してください。
http://tomcat.apache.org/whichversion.html
Pom定義の方でJavaバージョンを1.8(Java8)に設定したため、Tomcat9を選択します。
「サーバー名」は任意の名前を入力します。他の項目はそのままにします。
![server5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/f51752e1-ccf5-79cb-1f40-7ae88e9a7fc5.png)
「追加および除去」ダイアログが表示されます。
今回作成したプロジェクトが「使用可能」欄にあるので、選択して「追加」ボタンを押して「構成済み」へ移動します。
移動後に「完了」ボタンを押下します。
![server6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/fc2676c5-3708-10cf-3a48-85f98503336c.png)
「サーバー」タブにTomcat9が追加されプロジェクトも含まれています。
![server7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/3437ed74-160b-d843-8d45-4fd925ce7f5d.png)
さっそくTomcatサーバーを動かしてみましょう。
「サーバー」タブの右側にある「始動」ボタンまたは「虫」ボタンを押下でTomcatサーバーが起動します。
※「虫」ボタンはデバッグモードでサーバーが起動します。
![server8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/13f1e847-e491-c5f9-230a-a8678f94fe89.png)
サーバー起動時、ファイアウォールの警告ダイアログが表示されることがあります。
問題なければ「アクセスを許可する」ボタンを押下してください。
![server9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/b6b0145d-c472-b819-06d3-e7d4184bd195.png)
コンソールビューにエラーの表示がなく、「サーバーの起動」と表示されていればOKです。
ローカルのWebサーバーが起動できました。
![server10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/6c4a02b8-3275-e559-33d0-ec375d6c7879.png)

任意のブラウザより、Webアプリにアクセスしてみましょう。
URLは「http:localhost:8080/プロジェクト名」です。
※プロジェクト名の部分はpom.xmlで定義した~~「artifactId」タグの値~~「build」タグ内の「finalName」値となります。
※この記事のサンプルの場合、「finalName」タグに「testprj」と指定しました。
![server10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/f12255d7-5b71-189c-39d1-5fd166d1eef1.png)

##StringMVCを用いたWebアプリ

###欠落しているソースフォルダの作成
プロジェクトが生成されると、src/main/resource のみが存在します。
生成時にソースフォルダとして以下の２つは設定されていますが、どうしてか欠落しています。
・src/main/java
・src/test/java
そのためプロジェクトの「ビルド・パスの構成」を開き、ソースフォルダの生成を行います。
![spring1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/dd3bc720-0143-4863-07b3-867b206934ee.png)
「プロジェクトのプロパティ」ダイアログが開きますので、「ソース」タブを開き欠落していることを確認します。
src/main/java(欠落） と src/test/java （欠落）　していますね。
この２つを除去して、「フォルダの追加」より作り直します。
![spring2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/f2b27163-c6d8-391a-4349-e645d9d0f27b.png)
「ソース・フォルダの選択」ダイアログが表示されます。
「main」を選択し、「新規フォルダの生成」ボタンを押下します。
![spring3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/7bafaf2a-14c9-6749-2d0e-ff26ffcd2a28.png)
「ソース・フォルダー」ダイアログが表示されます。
「フォルダ名」に「java」を入力し「完了」ボタンを押下します。
![spring4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/3470ec89-4682-e19c-19ab-e19bfe437d14.png)
すると、「src/main/java(新規）」ができました。
同じように「src/test/java」を作成してください。
![spring5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/7fc1e294-7127-a967-6bbb-2f9e54b60910.png)
２つ生成できましたら、「適用して閉じる」ボタンを押下して完了です。
![spring6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/438649/0d5a7cc3-9f71-8e8e-871d-8c97370b9c3c.png)
###SpringMVCで必要なライブラリを追加
Pom.xmlにSpringMVCで必要なライブラリを追加していきます。

```xml
	<!-- ①ライブラリーバージョンなどプロパティ情報を定義 -->
	<properties>
		<!-- Generic -->
		<java.version>1.8</java.version>

		<!-- servlet -->
		<jsp.version>2.2</jsp.version>
		<jstl.version>1.2</jstl.version>
		<servlet.version>3.1.0</servlet.version>
		<!-- Spring -->
		<spring-framework.version>5.0.6.RELEASE</spring-framework.version>
	</properties>
	<!-- ②追加するライブラリーを定義 -->
	<dependencies>
		<!-- servlet -->
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>jstl</artifactId>
			<version>${jstl.version}</version>
		</dependency>
		<dependency>
			<groupId>javax.servlet</groupId>
			<artifactId>javax.servlet-api</artifactId>
			<version>${servlet.version}</version>
			<scope>provided</scope>
		</dependency>
		<dependency>
			<groupId>javax.servlet.jsp</groupId>
			<artifactId>jsp-api</artifactId>
			<version>${jsp.version}</version>
			<scope>provided</scope>
		</dependency>
		<!-- Spring -->
		<dependency>
			<groupId>org.springframework</groupId>
			<artifactId>spring-webmvc</artifactId>
			<version>${spring-framework.version}</version>
		</dependency>
	</dependencies>
	<!-- ③ビルドおよび実行ファイル生成の設定を定義 -->
	<build>
		<finalName>testprj</finalName>
		<pluginManagement>
			<plugins>
				<plugin>
					<artifactId>maven-compiler-plugin</artifactId>
					<configuration>
						<source>${java.version}</source>
						<target>${java.version}</target>
					</configuration>
				</plugin>
			</plugins>
		</pluginManagement>
	</build>
```
##簡単なアプリケーションを作成
現時点で、ここまで記載しました。
続きは後日記載します…