GitHubとClickUpを連携して常時100個のタスク管理を楽にしてみた

# はじめに
- YUZURIHAの松村です。
- 現在私が担当しているプロジェクトは開発フェーズからテストフェーズに入り、エンジニアとテスター合わせて約20人ほどで進めています。
- その中で、エンジニア・テスター間のやりとりやタスク管理をどのように行なっているのか、ご紹介します。

# 開発フェーズからテストフェーズへ
- 開発フェーズまではほぼエンジニアだけで進めていたので、誰がどの機能の実装を担当しているのかを管理するだけ。至ってシンプルです。
- タスク管理に特に支障はありませんでした。
- しかし、テストフェーズに入るとそうは行きません。
- テスターが仕様に沿ってテストを行い、不具合等があればタスクをどんどん作成して行きます。
- エンジニアは追加の実装等も並行して進めながら、そのタスクを確認して不具合を修正して行きます。
- そのため、20人の間で常に100個ほどのタスクがバンバン飛び交うことになります。

# テストフェーズに入って発生した問題
- 以上のような背景から、テストフェーズに入ってからいくつかの問題が発生しました。

## タスクのステータスを変更し忘れる
- エンジニアとテスターは連携して、「テスト→不具合があればタスク作成→不具合修正→再度テスト」の順で作業を進めます。
- 互いにタスクのステータスを確認し合いながら進めるため、ステータスを都度変更する必要があります。
- 忘れずにステータス変更できれば良いのですが、人間なのでどうしても忘れることは出てきます。
- 例えば「エンジニアが不具合を修正したのにステータスを変更し忘れて、テスターは再度テストができずに待ちぼうけ状態になる」という事態が頻発しました。

![kaisya_komaru_man.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/d96cea56-4db2-b432-106f-c5944766253a.png)

## タスクを間違える
- 似たような名前のタスクが複数あると、間違えて自分の担当ではない方のタスクを操作してしまうこともあります。
- 「あれ？知らん間に勝手にステータスが完了になってる！」
- 「まだ不具合修正中なのに！！」
- という悲しい事故も起こってしまいました。。。

![computer_monku.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/d3d0553d-4e46-f270-9de7-b89393c5d7b3.png)

# 解決策
## タスク管理ツールにClickUpを導入
- 弊社ではかねてより別プロジェクトのタスク管理ツールとして、ClickUpを有料プランで使っています。
- また、GitホスティングサービスはGitHubを使っています。
- そして、調べてみると！ClickUpとGitHubは連携できるようになっていました！
  - https://help.clickup.com/hc/en-us/articles/6305771568791-GitHub-integration
- そこで当プロジェクトでもタスク管理ツールとしてClickUpを導入し、GitHubと連携させてみることにしました！

## GitHubとClickUpの連携対応
- まずClickUpのホーム画面で、左下のメニューから`App Center`を選択します。
  - ![スクリーンショット 2023-10-06 16.36.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/3cbf4ca7-fef9-a962-eff9-5f3c3f3751ce.png)

- 次に、`App Center`のDevelopmentからGitHubを選択します。
  - ![スクリーンショット 2023-10-06 16.36.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/340bd80c-5989-53c3-64d2-ca18cd5461d1.png)

- ここから`Manage`→`Activate GitHub for Team`の順でクリックして、`+`でGitHubをAddします。

- 以下の画面まで進んだら、ClickUpと連携したいリポジトリが属するOrganizationを選択して、Grantします。
  - ![mceclip1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/1a10cf50-728a-b146-2c93-d54b999c65e0.png)

- 再度`App Center`からGitHubの`Manage`をクリックすると、GrantしたOrganizationのリポジトリを、ClickUpに追加できるようになっています。
  - ![mceclip0.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/f8a32a8d-d96e-78ea-f704-bc361a6048c3.png)

- ClickUpのタスクIDをGitHubのブランチ名に入れることで、タスクとブランチを紐付けることができます。そこで、ブランチ名のフォーマットを設定します。
  - ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/9fb98de0-2a20-acff-c82e-ba60acaab308.png)
  - 今回は、`feature/CU-{タスクID}`というブランチ名のフォーマットにしました。

- 以上で、GitHubのリポジトリとClickUpを連携することができました。

## ClickUpのフォルダ・リストごとの自動連携
- GitHubとどのように自動連携するかを、ClickUpのフォルダ・リストごとに設定できます。
- スペースからフォルダ(またはリスト)を選択し、settingsからAutomationsをクリックします。
  - ![スクリーンショット 2023-10-23 14.36.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/07829fef-9eda-b3cd-0c85-bb79bcd91349.png)
- 今回は、以下2つのAutomationsを設定しました。
  - リモートブランチ`feature/CU-{タスクID}`が作成されたら、タスクのステータスが`IN PROGRESS`になります。
    - ![スクリーンショット 2023-10-23 14.49.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/f7508ec7-1f33-aa70-d61c-f06a4740d8c0.png)
  - リモートブランチ`feature/CU-{タスクID}`のPull Requestがマージされたら、タスクのステータスが`WAITING FOR CHECK`になります。
    - ![スクリーンショット 2023-10-23 14.49.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/0052912f-96f9-1d3f-c262-00f58438a05a.png)

## ClickUpのタスクからGitHubを管理
- ClickUpでタスクを作成してタスクのGitHubアイコンをクリックすると、GitHubを管理する画面が表示されます。
  - ![スクリーンショット 2023-10-23 15.37.50.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/47e24bb0-944d-5d5a-a4f9-b32cf543317c.png)
  - ![スクリーンショット 2023-10-23 15.49.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/1e844e99-890d-8bda-0bc9-b2cafa6c229f.png)
- ここからどのブランチ・Pull Requestに紐づいてるのか一目瞭然なので、とても便利ですね。
- ブランチを作成する際もGitのコマンドをコピペしたらいいだけになってるので、こういうのもけっこうありがたいです。

## GitHubのPull Request
- 次にGitHub側がどうなるかを見てみます。
  - ![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f323632373932322f62356534333132382d373766342d353063382d356638322d3966643438373365626563352e706e67.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/9e5a673e-54ff-8ecb-520a-3f784a186ad1.png)
- `feature/CU-{タスクID}`ブランチでPull Requestを作ると、自動的に`Task linked`のコメントが追加されます。
- ここからClickUpのタスクにリンクできます。
- コメントするユーザは、ブランチやPull Requestを作ったユーザではなく、リポジトリとClickUpの連携を行ったユーザになります。

## タスクのステータスの遷移
- 以上の設定によって、ClickUpのステータスは以下のように遷移するようになりました。
### 1. `OPEN`
- テスターが最初にタスクを作成した際のステータス

### 2. `IN PROGRESS`
- 「エンジニアが修正対応中」のステータス
- リモートブランチ`feature/CU-{タスクID}`が作成されたら変更

### 3. `WAITING FOR RELEASE`
- 「エンジニアの修正対応が完了してPull Requestのレビュー待ち」のステータス
- ここはエンジニアが手動で変更する

### 4. `WAITING FOR CHECK`
- 「Pull Requestをマージしてデプロイされて、テスターの再テスト待ち」のステータス
- `feature/CU-{タスクID}`のPull Requestがマージされたら変更

### 5. `CLOSE`
- 「テスターが再テストして問題なかったので完了」のステータス
- ここはテスターが手動で変更する

## プランごとの差異
- 実際活用にするあたって気になるのが、プランごとの差異だと思います。
- `The App Center is available on all ClickUp plans.`と記載されている通り、`App Center`からGitHubと連携すること自体は無料プランでも可能です。
  - https://help.clickup.com/hc/en-us/articles/12580135233559-Intro-to-App-Center#01H8Q1XBNJ0D3PWSW6V5FGKHED
- しかしAutomationsの数がプラン毎に異なるため、注意が必要です。
  - https://help.clickup.com/hc/en-us/articles/6312102752791-Intro-to-Automations#h_9430636153

# 結果
- GitHubとClickUpを自動連携してから3ヶ月ほど経過しますが、今のところタスク管理上の事故は起こっていません。
- これでタスクのステータスを変更し忘れたり、操作するタスクを間違えるといった問題を解消することができました！

![business_group_happy.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627922/c08f2274-b1f0-4af7-e975-4c73c148ef00.png)


# 最後に
- ClickUpは日本語対応しておらず(勿論日本語のドキュメントも無いため)取っ付きにくさもあると思います。
- しかし、GitHubとの連携一つを取っても気の利いた詳細な設定が可能なので、タスク管理ツールとして優秀だなと思いました。
- そしてチーム開発を進める上では、人数が多ければ多いほどタスク管理が極めて重要なポイントになってきます。
- その時々において、チーム体制やフェーズに合った管理方法を導入することが大事だなと実感しました。
- また、弊社メンバーの以下の記事でもClickUpについて紹介しているので、是非ご覧ください。

https://qiita.com/saito55/items/e3e65955a4a43dcba38a