Play Frameworkハンズオン環境構築

# 環境構築

環境構築にはターミナル(Mac)とコマンドプロンプト(Windows)を使用します。
それぞれ起動方法は次のサイトを参照してください。

ターミナル(Mac)
<a href="http://www.1x1.jp/blog/2013/12/open_terminal_on_mac.html" target="_blank">参考サイト</a>

コマンドプロンプト(Windows)
<a href="http://pc-karuma.net/windows10-open-command-prompt-window/" target="_blank">参考サイト</a>

# 1.Homebrewのインストール(Macユーザーのみ)

Macでは以降の環境構築手順でHomebrewというパッケージ管理システムを使用します。
<a href="http://brew.sh/index_ja.html" target="_blank">Homebrew</a> 公式サイトに書かれている方法を用いてインストールします。

## 1)Command Line Tools のインストール
Homebrewを使うためには、Command Line Tools for Xcodeをインストールする必要があります。

次のコマンドをターミナルから実行すると、インストールの確認ダイアログが表示されます。
インストールボタンをクリックします。

```
xcode-select --install
```

## 2)Homebrewのインストール
次のコマンドを実行するとインストールされます。

```
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
```

## 3)インストールの確認
次のコマンドを実行します。

```
brew --version
```

次のように表示されれば大丈夫です。
(2019年1月8日時点の最新バージョン：1.8.6)

```
Homebrew 1.8.6
Homebrew/homebrew-core (git revision 7dfcc; last commit 2019-01-07)
```

バージョンが古い場合は次のコマンドでアップデートしてください。

```
brew update
```


# 2.Java環境構築

ScalaはJavaプラットフォーム（Java仮想マシン）上で動作するためJVMのインストールが必要になります。また、使用するJDKとしてMac、Windowsでは Amazon Corretto 8 を使用します。

### Mac
#### 1)pkgファイルをダウンロード
次のサイトから「amazon-corretto-preview2-8u192-macosx-x64.pkg」をダウンロードします。
https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-8-ug/downloads-list.html
#### 2)インストール
ダウンロードしたpkgファイルをダブルクリックし、インストール手順に従ってインストールします。
#### 3)環境変数の設定
次の設定を `.bash_profile` や `.zshrc` などに記述します。

```
export JAVA_HOME=/Library/Java/JavaVirtualMachines/amazon-corretto-8.jdk/Contents/Home
export PATH=$JAVA_HOME/bin:$PATH
```

※ JAVA_HOMEに設定するパスは、こちらのコマンドから取得できます。

```
 /usr/libexec/java_home
```

#### 4)インストールの確認
ターミナルを起動し次のコマンドを実行します。

```
java -version
```

次のように表示されたら成功です。
(2019年1月8日時点の最新バージョン：1.8.0_192)

```
openjdk version "1.8.0_192"
OpenJDK Runtime Environment (build 1.8.0_192-amazon-corretto-preview2-b12)
OpenJDK 64-Bit Server VM (build 25.192-b12, mixed mode)
```

### Windows

#### 1)Windowsが32bit版か64bit版か確認する
Windows10の場合次のサイトの手順で確認してください。
<a href="http://pc-karuma.net/windows10-32bit-64bit-check/" target="_blank">確認サイト</a>

Windows8の場合次のサイトの手順で確認してください。
<a href="https://support.microsoft.com/ja-jp/kb/958406" target="_blank">確認サイト</a>

#### 2)ダウンロード
次のサイトから、Windowsが32bit版の場合「amazon-corretto-preview2-8u192-windows-x86.msi」をダウンロードします。64bit版の場合「amazon-corretto-preview2-8u192-windows-x64.msi」をダウンロードします。

https://docs.aws.amazon.com/ja_jp/corretto/latest/corretto-8-ug/downloads-list.html

#### 3)インストール
ダウンロードしたファイルをダブルクリックしインストールウィザードに従ってください。

#### 4)インストールの確認
コマンドプロンプトを起動し次のコマンドを実行します。

```
java -version
```

次のように表示されたら成功です。
(2018年1月8日時点の最新バージョン：1.8.0_192)

```
openjdk version "1.8.0_192"
OpenJDK Runtime Environment (build 1.8.0_192-amazon-corretto-preview2-b12)
OpenJDK 64-Bit Server VM (build 25.192-b12, mixed mode)
```

#### 5)もし上記のように表示されない場合は環境変数の設定をお試しください
次のサイトを参考にして環境変数を設定してください。

<a href="https://web-dev.hatenablog.com/entry/java/jdk/8/windows10-env-variables" target="_blank">環境変数の設定</a>

### Linux(Ubuntu)

#### 1)インストール
次のコマンドを実行します。

```
sudo apt install openjdk-8-jdk
```

#### 2)インストールの確認
コマンドプロンプトを起動し次のコマンドを実行します。

```
java -version
```

次のように表示されたら成功です。バージョンは1.8以上であれば大丈夫です。
(2019年1月8日時点の最新バージョン：1.8.0_191)

```
openjdk version "1.8.0_191"
OpenJDK Runtime Environment (build 1.8.0_191-8u191-b12-0ubuntu0.16.04.1-b12)
OpenJDK 64-Bit Server VM (build 25.191-b12, mixed mode)
```

# 3.IntelliJ環境構築

今回のハンズオンはIntelliJを使います。
IntelliJとは、Java言語など多言語対応の統合開発環境です。
Androidの開発環境として有名なAndroid Studioのベースにもなっています。

## IntelliJのインストール
### 1)ダウンロード
#### Mac
こちらのサイトからCommunityエディションの「DOWNLOAD」をクリックし、.dmgファイルをダウンロードしてください。
<a href="https://www.jetbrains.com/idea/download/" target="_blank">ダウンロードサイト</a>
<img width="1053" alt="スクリーンショット 2019-01-08 15.03.15.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/8788fe69-34db-d613-6e3d-cf8bdbac5d01.png">

#### Windows
こちらのサイトからCommunityエディションの「DOWNLOAD」をクリックし、.exeファイルをダウンロードしてください。
<a href="https://www.jetbrains.com/idea/download/#section=windows" target="_blank">ダウンロードサイト</a>

#### Linux
こちらのサイトからCommunityエディションの「DOWNLOAD」をクリックし、.tar.gzファイルをダウンロードしてください。
<a href="https://www.jetbrains.com/idea/download/#section=linux" target="_blank">ダウンロードサイト</a>


### 2)インストール
#### Mac
.dmg パッケージを開いてIntelliJ IDEAをアプリケーションフォルダにドラッグ&ドロップしてください
#### Windows
.exe ファイルを起動してインストールウィザードに従ってください
#### Linux
.tar.gzファイルを展開しbin/idea.shを実行します。

```
./idea.sh
```

### 3)IntelliJの設定
IntelliJを起動します。
次のダイアログが表示されますので[I do not have...]を選択し[OK]をクリックします。

<img width="350" alt="intellij1.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/91f7dcbc-aa23-b174-da60-a52f1bff8188.png">

[I confirm ...]をチェックし[Continue]をクリックします。
<img width="511" alt="1.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/11bdf47d-8f9d-6912-0dc4-fd8ef49bf1d9.png">


次の画面が表示されます好きなデザインを選択し[Next: Keymaps]をクリックします。

<img width="708" alt="2.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/02335def-6924-06a6-e7ac-563dcdf94524.png">


[Next: Launcher Script]をクリックします。

<img width="679" alt="3.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/a27ec05a-4f68-90db-b563-5110d940e898.png">

[Next: Default plugins]をクリックします。

<img width="720" alt="4.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/ac338972-317a-1681-2c0c-a1bc506eddfb.png">

[Next: Featured plugins]をクリックします。

<img width="681" alt="5.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/8d157a68-154f-b396-5eec-623b3626a87c.png">

Scalaの[Install]をクリックしScalaプラグインをインストールします。最後に[Start using Intellij IDEA]をクリックし完了です。

<img width="657" alt="6.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/70492fab-319a-4703-2087-30e2fa5d7cc5.png">


# 4.sbtのインストール

## sbtとは？

sbtとはScala用のビルドツールになります。
Playframeworkのプロジェクト作成やビルドをするために必要になります。

## 1)sbtのインストール

### Mac
    brew install sbt

### Windows

次のサイトから[sbt-1.2.8.msi]をダウンロードし、ダブルクリックしてインストールします。
<a href="http://www.scala-sbt.org/download.html" target="_blank">ダウンロードサイト</a>

### Linux
こちらのサイトの手順に沿ってインストールします。

<a href="http://www.scala-sbt.org/download.html" target="_blank">インストール</a>

# 5.プロジェクトの作成

## 1)プロジェクトを配置するディレクトリに移動

プロジェクトファイルを配置するための適当なディレクトリに移動します。

```
cd <プロジェクトを配置するディレクトリ>
```

## 2)新規プロジェクト作成

```
sbt new playframework/play-scala-seed.g8

This template generates a Play Scala project 

name [play-scala-seed]: 
```
ここで「play-hands-on」と入力します。

あとはデフォルトで問題ありません。

```
This template generates a Play Scala project

name [play-scala-seed]: play-hands-on
organization [com.example]:

Template applied in ./play-hands-on
```

Windowsでは次のようなエラーが出ることがありますが、無視して問題ありません。

```
[error] java.io.IOException: Unable to delete file: \AppData\Local\Temp\giter8-86279809762767\src\main\g8\.gitignore
[error] Use 'last' for the full log.
```

## 3)プロジェクトが作成されたかの確認

コマンドを実行したディレクトリに「play-hands-on」ディレクトリがあれば大丈夫です。

# 6.プロジェクトのインポート

## 1)Import Projectをクリックします。
<img width="587" alt="スクリーンショット 2019-01-09 12.32.00.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/77855904-e612-3b88-5496-52acb07eaa04.png">

## 2)上記で作成したプロジェクトのルートディレクトリを選択します。
<img width="647" alt="スクリーンショット 2019-01-09 12.33.15.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/2481e020-658b-fccc-5e99-325d46f88e01.png">

## 3)[Import project from external model]とSBTを選択し[Next]ボタンをクリックします。
<img width="572" alt="スクリーンショット 2019-01-09 12.38.50.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/5908da45-68f8-bec8-d497-27e5834f7360.png">

## 4)インポート設定
[Project JDK]の[New...]ボタンをクリックします。
<img width="575" alt="スクリーンショット 2019-01-09 12.41.20.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/7eeb09cd-ff6f-8bc0-2b0c-1365e68eb47b.png">

## 5)次のダイアログで[JDK]を選択します。
<img width="736" alt="スクリーンショット 2019-01-09 12.42.11.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/7c121572-2846-e5ea-3f76-daff3a14c387.png">

## 6)ディレクトリ選択ダイアログが表示されます。上記でインストールしたJavaを選択します。
Mac

```
/Library/Java/JavaVirtualMachines/amazon-corretto-8.jdk/Contents/Home
```

Windows

```
C:\Program Files\Amazon Corretto\jdk1.8.0_192
```

Linux

```
/usr/lib/jvm/java-8-openjdk-amd64
```
<img width="644" alt="スクリーンショット 2019-01-09 12.43.13.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/7e71f788-380f-d1b8-6f5b-1f05de1b3eb8.png">

## 7)Syncが始まります。Syncが完了したら準備は全て完了です。
<img width="975" alt="スクリーンショット 2019-01-10 13.39.27.png" src="https://qiita-image-store.s3.amazonaws.com/0/124660/a80f90b1-f3f5-6667-3ee7-906f1a6122a7.png">


以上でハンズオンの環境構築は完了です。