# 開発者向け情報

Nuxt.js に関する内容、Firebase に関する内容は各ドキュメントを参照してください。
詳しい内容は下記の URL を参照ください

[おうちで時間割 Nuxt 版　仕様書 \- HackMD](https://hackmd.io/hltUcnt2S0eQEv1Heif7zw?both)

## 1. 環境構築

以下のアプリケーションを開発をおこなう環境へインストールします。

| アプリケーション名                                                                                                  | バージョン<br>(指定がある場合のみ記載) | インストール条件                             |
| ------------------------------------------------------------------------------------------------------------------- | -------------------------------------- | -------------------------------------------- |
| [Node.js](https://nodejs.org/ja/)                                                                                   | 10.19.0 以上                           | 必須                                         |
| [Visual Studio Code](https://code.visualstudio.com/)                                                                |                                        | Visual Studio Code を利用する場合            |
| [Yarn](https://classic.yarnpkg.com/ja/)                                                                             |                                        | 本プログラムを yarn で実行する場合           |
| [Docker Engine](https://docs.docker.com/engine/install/),[Docker Compose](https://docs.docker.com/compose/install/) |                                        | 本プログラムを docker compose で実行する場合 |

### 1-1. Visual Studio Code の拡張機能

Visual Studio Code を利用する場合は、以下の拡張機能をインストールします。

| 拡張機能                                                                                                               | インストール条件                                        |
| ---------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- |
| [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)                                   | 任意                                                    |
| [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur)                                              | 任意                                                    |
| [TSLint](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-tslint-plugin)                | 任意                                                    |
| [Debugger for Chrome](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome)                | 任意                                                    |
| [Remote Development](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.vscode-remote-extensionpack) | Visual Studio Code で Remote Development を利用する場合 |

---

## 2. 実行

コマンドの実行は、WorkingCopy のルートディレクトリでおこないます。

### 2-1. `yarn` を使う場合

#### 2-1-1. 依存関係を構築する

```bash
# install dependencies
$ yarn install
```

#### 2-1-2. プログラムを実行する

以下のコマンドを実行した後、 http://localhost:3000 にアクセスすると、開発中のプログラムを確認する事ができます。

```bash
# serve with hot reload at localhost:3000
$ yarn dev
```

#### 2-1-3. トラブルシュート

##### 2-1-3-1. `Cannot find module ****` と怒られた時

再度、依存関係を構築し直し、プログラムを実行します。

### 2-2. `docker compose` を使う場合

#### 2-2-1. 依存関係を構築し、プログラムを実行する

以下のコマンドを実行した後、 http://localhost:3000 にアクセスすると、開発中のプログラムを確認する事ができます。

```bash
# serve with hot reload at localhost:3000
$ docker-compose up --build
```

#### 2-2-2. トラブルシュート

##### 2-2-2-1. `Cannot find module ****` と怒られた時

プログラムを止め、以下のコマンドを実行します。

```bash
# serve with hot reload at localhost:3000
$ docker-compose run --rm app yarn install
```

## 3. 本番環境/その他の判定

`process.env.NODE_ENV` の値が、本番の場合は`'production'`に、それ以外の場合は `'development'` になっています。
テスト環境のみで実行したい処理がある場合は、こちらの値をご利用ください。

---

## 4. ステージング・本番環境への反映

下表の左列に記載されたブランチが更新されると、ブランチと Web サイトの更新が自動的におこなわれます。

| 更新対象      | 自動的に更新されるブランチ | 更新される Web サイト                         |
| ------------- | -------------------------- | --------------------------------------------- |
| `master`      | 無し                       | 本番サイト https://studyathome.web.app/       |
| `development` | 無し                       | 開発用サイト https://studyathome-dev.web.app/ |

---

## 5. ブランチルール

development 以外は、Pull Request は禁止です。
Pull Request を送る際のブランチは、以下のネーミングルールに従ったブランチにしてください。

| 種類               | ブランチのネーミングルール                 |
| ------------------ | ------------------------------------------ |
| 機能追加系         | `feature/#{ISSUE_ID}-#{branch_title_name}` |
| フィックス系       | `fix/#{ISSUE_ID}-#{branch_title_name}`     |
| ホットフィックス系 | `hotfix/#{ISSUE_ID}-#{branch_title_name}`  |

### 5-1. 基本的なブランチ

| 目的 | ブランチ    | 確認 URL                         | Pull requests を出せる人 | 備考                                                                             |
| ---- | ----------- | -------------------------------- | ------------------------ | -------------------------------------------------------------------------------- |
| 開発 | development | https://studyathome-dev.web.app/ | 全開発者                 | base branch。基本は、この`development`ブランチに Pull Request を送ってください。 |
| 本番 | master      | https://studyathome.web.app/     | 管理者のみ               | 管理者以外の Pull Request は禁止です。                                           |
