gh × Claude Code で Notion タスクから実装まで自動化する

1. はじめに
- この記事で作るもの
- 対象読者・前提条件
2. 使用ツールの準備
3. 【ハンズオン】Notion タスク → 実装自動化
4. まとめ
- 今回学んだこと
- 発展的な活用アイデア
5. おわりに

1. はじめに

こんにちは！ご紹介に預かりました、iimonでフロントエンドエンジニアをしている「なかむー」です！

みよちゃん（と呼んだことはあんまりないのですが笑）は会社員と、学生と、父親という３足のわらじを履きながら、いつも明るくチームを引っ張ってくれるので隣から見ていても本当にすごいです！

まだ、ご確認なければ１日目を要チェックです！

突然ですが、皆さんはタスク管理に何を使っていますか？

自分のチームでは Notion でバグや機能追加のタスクを管理しているのですが、正直なところ「Notion 見る → 実装方法を考える → ブランチ作る → 実装始める」という流れが地味に面倒だなと思う今日この頃です。。

そんなとき、ふと思いました。

「Notion のタスク番号を指定したら、自動で実装の雛形ができたら最高じゃない？」

ということで、今回は gh（GitHub CLI）と Claude Code を組み合わせて、Notion タスクから実装まで自動化するワークフローを作ってみます。

この記事で作るもの

Notion タスク指定 → 内容取得 → Claude Code で実装 → ブランチ作成 → コミット

最終的には、シェルスクリプト一発でここまで完了する状態を目指します！

対象読者・前提条件

GitHub を使った開発経験がある方
Notion でタスク管理している方
CLI 操作に抵抗がない方

前提条件 - Git / Node.js 18 以上がインストール済み - GitHub アカウント / Notion アカウントを持っている

2. 使用ツールの準備

Notion API

お恥ずかしながら、自分は Notion API の存在は知っていたものの、実際に使ったことがありませんでした。。「なんか難しそう」と敬遠していたんですが、やってみると意外とシンプルでした。

Integration の作成

Notion Developers にアクセス
「新しいインテグレーション」をクリック
名前を入力（例：claude-code-integration）
関連付けるワークスペースを選択
作成後、「内部インテグレーショントークン」をコピー

このトークンが API キーになります。なくさないように .env などに保存しておきましょう。

export NOTION_API_KEY="secret_xxxxxxxxxxxxx"

データベースへの接続許可

ここ、自分は最初ハマりました。。Integration を作っただけでは、データベースにアクセスできないんですね。

タスク管理している Notion データベースを開いて：

右上の「...」→「接続」→ 作成した Integration を追加

これを忘れると 401 Unauthorized で永遠に弾かれます（30分くらい悩みました）。

データベース ID の取得

Notion でデータベースを開いたときの URL から取得します：

https://www.notion.so/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx?v=yyyy
                      ↑ この32文字がデータベースID

view パラメータを除いてください

export NOTION_DATABASE_ID="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

Claude Code

Claude Code は Anthropic 公式のターミナル AI アシスタントです。

インストール

npm install -g @anthropic-ai/claude-code

初回起動時に認証が求められます：

claude

実はこの Claude Code、パイプラインで入力を受け取れるんです。これを知ったとき「なんて便利なんだ！！」と感動しました。

echo "Hello" | claude -p "これに返事して"

この機能が今回の自動化の肝になります。

gh（GitHub CLI）

GitHub 公式の CLI ツールです。ブラウザを開かずに PR やブランチ操作ができます。

インストール

# Mac
brew install gh

# Windows
winget install GitHub.cli

認証

gh auth login

ブラウザが開くので、指示に従って認証すれば OK です。

正直、最初は「わざわざ CLI 使わなくても...」と思っていたんですが、スクリプトと組み合わせると本当に便利です。考えが変わりました。

3. 【ハンズオン】Notion タスク → 実装自動化

いよいよ本題です！

完成イメージ

./auto-implement.sh TASK_ID

これだけで： 1. Notion からタスク内容を取得 2. Claude Code が実装コードを生成 3. ブランチを作成してコミット

ここまで自動でやってくれます。

Step 1: Notion API でタスク内容を取得

まず、Notion のタスク情報を取得するスクリプトを作ります。

#!/bin/bash
# get-notion-task.sh

# .envファイルを読み込む
SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
source "${SCRIPT_DIR}/.env"

TASK_ID=$1

# TSK-4 から数字部分（4）を抽出
TASK_NUMBER=$(echo "$TASK_ID" | sed 's/[^0-9]*//g')

# データベースを検索
curl -s -X POST "https://api.notion.com/v1/databases/${NOTION_DATABASE_ID}/query" \
  -H "Authorization: Bearer ${NOTION_API_KEY}" \
  -H "Notion-Version: 2022-06-28" \
  -H "Content-Type: application/json" \
  -d "{
    \"filter\": {
      \"property\": \"ID\",
      \"unique_id\": { \"equals\": ${TASK_NUMBER} }
    }
  }" \
  | jq -r '
    .results[0] |
    "## タスク情報\n" +
    "ID: " + (.properties["ID"].unique_id.prefix // "") + "-" + (.properties["ID"].unique_id.number | tostring) + "\n" +
    "タイトル: " + (.properties | to_entries[] | select(.value.type == "title") | .value.title[0].plain_text) + "\n" +
    "説明: " + (.properties["説明"].rich_text[0].plain_text // "なし")
  '

実行してみます：

chmod +x get-notion-task.sh
./get-notion-task.sh YOUR_TASK_ID

おお、取れた！

ちなみに jq がないとパースできないので、入っていない方は先にインストールしてください。

# Mac
brew install jq

また、データベースIDはデータベースをページとして開いたところのURL末尾です！（自分は勘違いしててAPIエラーになりました。。）

注意: Notion のプロパティ名（Name, Description など）は、実際のデータベースに合わせて変更してください。

Step 2: Claude Code で実装コードを生成

取得したタスク情報を Claude Code に渡します。

./get-notion-task.sh YOUR_TASK_ID | claude -p "
このタスクを実装してください。TypeScript で書いてください。既存のコードがあれば読み取って整合性を保ってください
"

Claude Code がタスク内容を解析して、実装コードを生成してくれます。

ここで面白いのが、Claude Code はカレントディレクトリのファイルも読めるので、既存のコードとの整合性も考慮してくれるんです。これ、最初知らなくて毎回コード全部貼り付けてました。。また、claude -p はワンショット実行なので、別セッションでは文脈を引き継げませんでした。。あらかじめ、setting.jsonで許可・拒否コマンドを書いておいたほうが良さそうです！

Step 3: ブランチ作成 & コミット

gh コマンドでブランチを作成し、変更をコミットします。

# タスクIDからブランチ名を生成
BRANCH_NAME="feature/notion-${TASK_ID}"

# ブランチ作成 & チェックアウト
git checkout -b $BRANCH_NAME

# 変更をステージング & コミット
git add .
git commit -m "feat: Notionタスク ${TASK_ID} の実装"

Step 4: シェルスクリプトにまとめる

全部まとめて一つのスクリプトにします。

#!/bin/bash
# auto-implement.sh
set -e

# .envファイルを読み込む
SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
source "${SCRIPT_DIR}/.env"

TASK_ID=$1
if [ -z "$TASK_ID" ]; then
  echo "Usage: ./auto-implement.sh TSK-123"
  exit 1
fi

# TSK-4 から数字部分を抽出
TASK_NUMBER=$(echo "$TASK_ID" | sed 's/[^0-9]*//g')

echo "📋 Notion からタスク情報を取得中..."
TASK_INFO=$(curl -s -X POST "https://api.notion.com/v1/databases/${NOTION_DATABASE_ID}/query" \
  -H "Authorization: Bearer ${NOTION_API_KEY}" \
  -H "Notion-Version: 2022-06-28" \
  -H "Content-Type: application/json" \
  -d "{
    \"filter\": {
      \"property\": \"ID\",
      \"unique_id\": { \"equals\": ${TASK_NUMBER} }
    }
  }" \
  | jq -r '
    .results[0] |
    "## タスク情報\n" +
    "ID: " + (.properties["ID"].unique_id.prefix // "") + "-" + (.properties["ID"].unique_id.number | tostring) + "\n" +
    "タイトル: " + (.properties | to_entries[] | select(.value.type == "title") | .value.title[0].plain_text) + "\n" +
    "説明: " + (.properties["説明"].rich_text[0].plain_text // "なし")
  ')

echo "$TASK_INFO"
echo ""

# ブランチ作成（TSK-4 形式をそのまま使用）
BRANCH_NAME="feature/notion-${TASK_ID}"
echo "🌿 ブランチを作成: $BRANCH_NAME"
git checkout -b "$BRANCH_NAME"

# Claude Code で実装
echo "🤖 Claude Code で実装中..."
echo "$TASK_INFO" | claude -p "
このタスクを実装してください。
- TypeScript で書いてください  
- ファイルを直接編集してください
"

# コミット
echo "📝 変更をコミット中..."
git add .
git commit -m "feat: Notionタスク ${TASK_ID} の実装"

echo ""
echo "✅ 完了！"
echo "次のステップ: gh pr create でPRを作成してください"

実行

chmod +x auto-implement.sh
./auto-implement.sh YOUR_NOTION_TASK_ID

実際の成果物： 期待通りの動きをしてくれました！

4. まとめ

今回は gh × Claude Code × Notion API を組み合わせて、タスクから実装までを自動化するワークフローを作りました。

正直、最初は「本当にできるのかな...」と半信半疑だったんですが、やってみたら意外とすんなり動いて驚きました。

今回学んだこと

Notion API は思ったより簡単（Integration の接続許可だけ忘れずに！）
Claude Code のパイプライン機能が超便利
gh と組み合わせると Git 操作も自動化できる

発展的な活用アイデア

タスクのステータスを自動で「進行中」に変更する
PR 作成まで自動化（gh pr create を追加）
Slack 通知を飛ばす

最初はバグ対応タスクだけでも、このワークフローに乗せてみると良いかもしれません。自分もまだ試行錯誤中ですが、少なくとも「Notion 見て実装方法を考える...」という作業が簡略化できそうです。

ClaudeCodeで実装する時間が長かったので、「Claude.mdにプロジェクト概要をあらかじめまとめておいたら時間短縮につながるのでは。。？」などまだまだ考えることがたくさんありそうです！

Claude Codeのスラッシュコマンドでも同じ様なことができそうとアドバイスを貰ったので今度はスラッシュコマンドを使うアプローチも試してみたいと思います！

皆さんもぜひ試してみてください！

5. おわりに

ここまで記事を読んでいただきありがとうございました！

弊社では現在エンジニアを募集しています！

この記事を読んで少しでも興味を持っていただけた方、ぜひカジュアルにお話ししましょう！！

iimon採用サイト / Wantedly

以上、アドベントカレンダー2日目の「なかむー」でした！

明日のアドベントカレンダー担当は「クリス」です！

以前何をしているときが一番楽しいという話になったとき、クリスは「コードを書いて、うまく行ったときが一番楽しい」と話してくれました。

「寝る前にネットサーフィンしているのが一番楽しい」と答えた自分が恥ずかしくなりました笑

そんないつも前向きで、頑張り屋のクリスがどんな記事を書いてくれるか楽しみです！！

3日目よろしくお願いします〜！！

iimon TECH BLOG

iimonエンジニアが得られた経験や知識を共有して世の中をイイモンにしていくためのブログです