今回は、GitHubの便利機能の紹介です！ 
⚠️現時点ではPublic Previewの機能紹介になります 


## こんな人向け

- 大規模なタスク/プロジェクトを分割して管理したい
- 分割したタスクを一目で進捗を見えるようにしたい

⚠️組織(organization)アカウントの人しか使えません


## Sub-Issues機能
GitHubでは、Issueに親子関係を作成することができ、Sub-Issue を Issue に追加することで、大きな作業をタスクに分割できます。 
Sub-Issue は、親の Issue との関係が表示されるため、GitHub 全体で作業を追跡できます。 
これにより、ビューの作成、親の問題によるフィルター処理、グループ化を行うことができます。

Sub-Issue 自体に Sub-Issue を含めることができるため、プロジェクト全体または作業の一部を視覚化し、Issue 間の関係を示す Issue の完全な階層を作成できます。

親 Issue ごとに最大 100 個のサブ Issue を追加でき、最大 8 レベルの入れ子になったサブ Issue を作成できます。 
つまり、最大100の8乗個のIssueを管理できます。

## Sub-Issueの作成手順
1. Issue画面の「Create Sub-Issue」から子Issueを作成できます。
2. Issue の説明の下部にある、[Sub-Issue の作成] をクリックします。
 
 ![](https://cont.sterfield.co.jp/uploads/1_a946d23684.png) 
3. テンプレートが準備されている場合には、ダイアログで、Issue のテンプレートを選択できます。
 
 ![](https://cont.sterfield.co.jp/uploads/2_fc9a7ceff4.png) 

4. 必要に応じて、Issueの情報を入力し、Issue の種類を設定し、 担当者、ラベル、プロジェクト、マイルストーンを設定します。 
 ![](https://cont.sterfield.co.jp/uploads/3_66a99f2eb1.png) 
## 既存の Issue を Sub-Issue として追加する方法
1. Issue画面の「Add existing Issue」から子Issueを作成できます。 
 ![](https://cont.sterfield.co.jp/uploads/4_cb14540079.png) 
2. Sub-Issue として追加する問題を選択します。
 ・提案の 1 つから Issue を選択します。
 ・[Issue の検索] フィールドに、Issue のタイトルまたは Issue 番号を入力し、結果をクリックします。
 ・他のリポジトリから Issue を追加するには、リポジトリ名の横にある をクリックし、別のリポジトリを選択します。
 ![](https://cont.sterfield.co.jp/uploads/5_59fafbf05a.png) 
子Issueが登録された親Issueには、子Issueの進捗状況が表示されます。 
 ![](https://cont.sterfield.co.jp/uploads/6_d5394fd099.png) 
 ![](https://cont.sterfield.co.jp/uploads/7_7c52dd58b2.png) 

## Sub-Issueの解除手順
1. Issue画面の解除したいSub-Issue横の[…]をクリックします。
2. 「Remove Sub-Issue」をクリックする
 ![](https://cont.sterfield.co.jp/uploads/8_c6aa8fc7e9.png) 
## まとめ
今までもISSUEの概要に書いたタスクリストからISSUEを生成する機能がありましたが、Sub-Issue機能の方がIssue同士のリレーションがしっかりしているので、確認する際に迷子になりづらい点がgoodです◎ 
そんな理由で、GitHubをチームで利用しているなら、必ず使ったほうがいい機能だと思いました。 
個人的には、Sub-Issue作ったタイミングで、自動的に親Issueに紐づいてくれたらいいのに。と思ったりしました（笑）

small_pixta_50037742_S.jpg

thumbnail_pixta_50037742_S.jpg

pixta_50037742_S.jpg

GitHubの便利機能紹介シリーズ「Sub-Issue機能」

## はじめに
この記事では、GitHubのリポジトリからステータスが"OPEN"のIssueを取得し、Googleスプレッドシートに追記する方法を紹介します。GitHubのREST APIを使用し、Google Apps Scriptを使って自動化します。これにより、特定の組織の複数のリポジトリからIssue情報を一括で取得し、追加の作業なしでスプレッドシートに保存できます。

ということで、前回の記事でGoogle Apps Script（GAS）をChatGPTに書いてもらったのですが、さまざまなことができることが分かったので、実際に業務で使っているGitHubとの連携を試してみました。
いくつか課題は残ったものの基本的な動作は確認できたのでそのGASそのものもシェア致します。

https://sterfield.co.jp/blog/18162/

## 必要なもの

### GitHubアカウントとアクセストークンの作成
 ![](/uploads/Fine_grained_Personal_Access_Tokens_861a8dbc65.png) 
GitHub >Setting>Developer Settings> personal access tokens >Fine-grained tokens
を選択します。
ここから新しいトークンを発行するのですが、我々の管理では、リポジトリは組織に紐づいているので、組織に対してのトークンと必要な権限、リポジトリのIssueの読み取り権限を設定します。

### Googleスプレッドシートの作成
最後にGASを共有していますが、スプレッドシートのIDが必要になります。
以下のようにd/と/editの間のXXXの値がスプレッドシートのIDになるので、控えておきしょう。

`https://docs.google.com/spreadsheets/d/XXX/edit` 

### Google Apps Scriptのセットアップ
 ![](/uploads/Chat_GPT_GAS_Google_1_8c0845570a.png) 
スプレッドシート＞拡張機能＞Apps Scriptで開いたページのコード.gs欄にベタっと貼り付けます。

## リポジトリの取得

ここから先のコードは、全てChatGPTから取得した末尾にシェアしているものを記載します。

GitHubのREST APIを使用して指定した組織のリポジトリを取得する関数を作成する
リポジトリの一覧を表示するためのスプレッドシートの作成

## Issueの取得と追記

取得したリポジトリごとにステータスが"OPEN"のIssueを取得する関数を作成する
スプレッドシートにIssue情報を追記する

## 実行と結果確認

Google Apps Scriptの実行方法とトリガーの設定
スクリプトを実行し、Issue情報がスプレッドシートに追記されることを確認する

以下のように、取得はできたものの課題を残す結果となったので、課題点は後述します。

 ![](/uploads/Google_1c1a29f017.png) 


## エラーハンドリングの追加と問題解決のヒント
エラーが出たら、そのエラー文言をChatGPTに投げ、修正コードをもらっていくのですが、こんなお茶目な一面も。
 ![](/uploads/GAS_1ac28d726e.png) 

## 課題点

- 一度に取得できるIssueを増やす。ページングの実装なども追加したが、全件取得には至らなかった。この点は、GraphQLの書き方をChatGPTが提案してくれたが、どうにも上手くいかず、今回はREST APIでの手法となった。
- Projectsから課題を取得できないか。これは、Projectsがベータ版となっており、ChatGPTが2021年9月までの情報に留まっているため、断念。
- シート内の重複削除。そもそも全件取得が出来ていないので、未検証。

## まとめ
この記事では、GitHubのREST APIとGoogle Apps Scriptを活用して、GitHubリポジトリからステータスが"OPEN"のIssueを自動的に取得し、Googleスプレッドシートに追記する方法を紹介しました。これにより、開発チームやプロジェクト管理者は、リポジトリ内のオープンな課題を一元管理し、効果的に追跡することができます。さらに、自動化されたプロセスにより、作業の効率化とヒューマンエラーの軽減も期待できます。是非、この方法を試してみてください。

本当に革命的だなと思うのは、今までエンジニアに依頼するしかなかったような作業が非エンジニアである人間とChatGPTとの会話だけで出来てしまうところです。そして、このやり取りをしながら、指示を変えたりデバッグしていく作業はとても楽しいものでした。

そして、結構な時間をChatGPTと向き合ってきて、コツが分かってきたのですが、何かコードをもらう時に、一気に指示を出すのではなく、最初は最小単位で指示を出し、成功したら少しずつ機能を追加していくと、結局は近道です。
今回のケースですと、まずは、Githubから特定のリポジトリのIssueを取得。これが成功したら、ステータスをオープンに限定、複数のリポジトリから取得する、スプレッドシート側の重複をチェックするというように足していくと良かったです。

最後に今回のGASをシェアします。トークンやスプレッドシートのIDなどは、置き換えてください。 

## GAS

```
// カスタムメニューを作成する関数
function onOpen() {
 var ui = SpreadsheetApp.getUi();
 ui.createMenu('Custom Menu')
 .addItem('Fetch and Append Issues', 'fetchAndAppendIssues')
 .addToUi();
}
function fetchAndAppendIssues() {
 var organization = "your_organization"; // 組織名
 var spreadsheetId = "your_spreadsheet_id"; // スプレッドシートのID
 var sheetName = "your_sheet_name"; // 追加するシートの名前
 var status = "open"; // 取得するIssueのステータス
 var perPage = 100; // 1回のリクエストで取得するIssueの数（最大100件）

 var sheet = SpreadsheetApp.openById(spreadsheetId).getSheetByName(sheetName);

 var repositories = getRepositories(organization);
 var newData = []; // 新しいデータを格納する配列

 for (var i = 0; i < repositories.length; i++) {
 var repo = repositories[i];
 var page = 1; // ページ番号

 while (true) {
 var url = "https://api.github.com/repos/" + organization + "/" + repo + "/issues?state=" + status + "&per_page=" + perPage + "&page=" + page;
 var response = UrlFetchApp.fetch(url, {
 headers: {
 "Authorization": "Bearer YOUR_GITHUB_ACCESS_TOKEN" // GitHubのアクセストークン
 }
 });

 var issues = JSON.parse(response.getContentText());
 if (issues.length === 0) {
 break; // ページの結果が空ならループを終了
 }

 for (var j = 0; j < issues.length; j++) {
 var issue = issues[j];
 var title = issue.title;
 var number = issue.number;
 var createdAt = issue.created_at;
 var htmlUrl = issue.html_url;

 newData.push([title, number, createdAt, htmlUrl]); // 新しいデータを配列に追加
 }

 page++; // 次のページに進む
 }
 }

 if (newData.length > 0) {
 if (sheet.getLastRow() === 0) {
 sheet.getRange(1, 1, newData.length, newData[0].length).setValues(newData); // データを直接書き込む
 } else {
 sheet.getRange(sheet.getLastRow() + 1, 1, newData.length, newData[0].length).setValues(newData); // データを追記
 }
 }
}

function getRepositories(organization) {
 var url = "https://api.github.com/orgs/" + organization + "/repos";
 var response = UrlFetchApp.fetch(url, {
 headers: {
 "Authorization": "Bearer YOUR_GITHUB_ACCESS_TOKEN" // GitHubのアクセストークン
 }
 });

 var repositories = JSON.parse(response.getContentText());
 var repoNames = [];

 for (var i = 0; i < repositories.length; i++) {
 var repo = repositories[i];
 repoNames.push(repo.name);
 }

 return repoNames;
}
```

large__09b5edad-a516-4f8f-93d9-5632be519bcc.jpeg

medium__09b5edad-a516-4f8f-93d9-5632be519bcc.jpeg

small__09b5edad-a516-4f8f-93d9-5632be519bcc.jpeg

thumbnail__09b5edad-a516-4f8f-93d9-5632be519bcc.jpeg

_09b5edad-a516-4f8f-93d9-5632be519bcc.jpeg

GitHubリポジトリからIssueを取得してスプレッドシートに追記するGAS試作版を作ってみた

Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧 - タグ: #github

2025/01/17

2023/07/14