[Java]STSの導入からローカルホストでの動的ページの確認までの流れ(2/3)

前回のMVCモデルの説明からの続きです。

記事は3つに分割しています。
[1. MVCモデルの説明](https://qiita.com/aki0141/items/5337f16242a99a02810f)
**2. STSの導入からPleiadesによる日本語化まで　←今ここ**
[3. プロジェクトの作成からローカルホストでページを確認するまで](https://qiita.com/aki0141/items/5dc0c9378c545cbaad98)

今回はSTSの導入からPleiadesによる日本語化までです。

#使用ツール
- SpringToolSuite 4.7.0 (Eclipseのプラグインとして使用)
- Thymeleaf

STSはJavaのフレームワークの1つであるSpringを使うためのものです。そのSTSを導入するためにいくつかある統合開発環境(IDE)の中から今回はEclipseを選びました。
IDEというのはコードを書いたりコンパイルしたりデバッグしたりとった機能を提供します。Eclipse以外にもVSCodeやTheiaといったIDEにも導入できます。
ThymeleafはHTMLのテンプレートエンジンです。

#STSの導入と起動まで
[公式ページ](https://spring.io/tools)からSTSをダウンロードします。IDEは一番上のEclipse用を選びます。
<img width="600" alt="download01" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/b0d8f4f3-8908-eb32-d36e-fcc2a638ba3f.png">

ダウンロード先は特に指定していなければ各自のダウンロードフォルダになっているはずです。そこに"spring-too-suite-4"という名前から始まるjarファイルがあるので実行します。
<img alt="download02" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/87b4778c-d4f2-cb0b-6103-98c048a33668.png">
PC画面の左上あたりにこんなウィンドウが出てきていれば正常にインストールが進んでいます。

インストールが終了するとSTSのフォルダが作成されていると思います。
今回はダウンロードフォルダにそのまま入れていますが、他のフォルダに移しても構いません。
<img width="600" alt="download03" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/6cfb0f2a-1200-739a-5972-35ab98224ca5.png">

フォルダに入るといくつかファイルがあります。その中でもSTSのロゴが表示されている.exeファイルが本体です。
このファイルからSTSが起動できます。
<img width="600" alt="download04" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/058985b2-1a32-7a16-ccc1-219641be88a7.png">

起動するとランチャーが出てきてワークスペースを指定するよう言われますので、あらかじめどこかにフォルダを作成しておきましょう。
今回はデスクトップに"HelloWorld"というフォルダを作成し、そこをワークスペースに指定しています。
<img alt="launch" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/9a364b28-c4f5-a1cc-eb9a-404fcd481297.png">

起動ボタンをクリックするとSTSの作業画面が表示されます。
この時点でプロジェクトを作成することはできますが、今回はPleiadesというEclipse用のプラグインを導入して日本語化します。
<img width="600" alt="home01" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/d9748c1e-85cd-0cee-5518-50ed4911cd60.png">

#Pleiadesを導入して日本語化する
まず準備としてSTSを開いている場合は閉じておきましょう。
Pleiadesは[こちら](https://mergedoc.osdn.jp/)のページからダウンロードすることができます。
ページには上段にAll in Oneが、中段にプラグインがダウンロードできるリンクが並んでいると思いますが、すでにEclipseをSTSという形でインストールしているため、プラグインだけで大丈夫です。
今回はWindowsなので一番左のボタンからダウンロードします。
<img width="600" alt="pleiades01" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/7fa65661-4905-8477-58de-8000a469aa1c.png">

ダウンロードが終わるとまたダウンロードフォルダに.zipファイルができているので解凍します。
画像は上が解凍前、下が解凍後です。
<img width="600" alt="pleiades02" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/c77c4341-ea56-71fc-0c7f-811197926a55.png">

解凍後のフォルダに入るとまたいくつかファイルがあります。その中で"setup.exe"というファイルを実行します。
<img width="600" alt="pleiades03" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/26eff57b-56bb-cce7-25bf-622c767a4568.png">

実行するとセットアップのウィンドウが表示されます。
PleiadesはEclipseだけではなく、Android StudioなどほかのIDEでも使用することができます。
この中で日本語化するアプリケーションの選択ボタンをクリックします。
<img width="600" alt="pleiades04" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/d2eb69dd-71d8-29f9-561c-4b1fc31103e8.png">

ファイルの選択ウィンドウが出てくるので、すでにインストールされているSTSのフォルダの実行ファイル(SpringToolSuite4.exe)を選択します。
<img width="600" alt="pleiades05" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/c982ffd5-8d27-1426-77df-5424de350de2.png">

選択後は元のセットアップウィンドウに戻ります。この時点で日本語化するアプリケーション、Pleiadesが配置されるディレクトリ、Pleiadesの設定が追加されるファイルが記入されていると思います。
あとは右下の日本語化するボタンをクリックすることでSTSの日本語化が始まります。
<img width="600" alt="pleiades06" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/c286ac60-e713-20cc-cfcc-3e77f3f14a28.png">

セットアップウィンドウが閉じたらSTSを起動しましょう。最初のランチャーですでに日本語化されていることがなんとなく分かるかと思います。
プロジェクトのフォルダは上で作ったものと同様、デスクトップのHelloWorldを選択します。
Pleiadesが上手く実行されていれば作業画面も日本語化されているはずです。
<img width="600" alt="home02" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/670074/8b330a66-6b70-9502-3a38-661dd9ae778a.png">

ここまでSTSのダウンロードからPleiadesによる日本語化まで進めました。
次は実際にプロジェクトを作成し、ローカルホストでページを確認するとこまでいこうと思います。

次回：[プロジェクトの作成からローカルホストでページを確認するまで](https://qiita.com/aki0141/items/5dc0c9378c545cbaad98)