👨‍💻

GitHub PR から Marp スライドを自動生成させるプロンプト出力ツールを作った話

2025/04/13に公開

 はじめにPull Requestの内容を分かりやすく共有したい場面って意外と多いですよね。
チームメンバーへの進捗報告
リリース直前の振り返り
カンファレンス・勉強会での登壇資料作成
とはいえ、毎回資料をゼロから作るのは意外と面倒…。

そこで、GitHubのPR情報から資料の「たたき台」を自動で生成できるプロンプトを出力するツールを作ってみました。

 🛠 作ったもの：Marpスライド用プロンプト生成スクリプト🔗 スクリプトはこちら：

👉 GitHub Gist - pr2slide-prompt-generator.sh
sh ./pr2slide-prompt-generator.sh someone/awesome-repo 42 ja
このコマンドを実行するだけで：
PRの本文・コメント・コミット・diff
リポジトリのREADME
をもとに、ChatGPTにそのまま渡せるMarpスライド用プロンプトを出力してくれます。
💬 プロンプトとは？

ChatGPTなどのAIに渡す指示文のことです。

 📸 実際に生成されたスライド以下は、このスクリプトで生成したプロンプトをChatGPTに投げ、Marp形式で出力されたスライドをSpeaker Deckにアップした例です。
MarpのVS Code拡張機能を使ってPDFに変換し、そのままアップロードしています。
このように、「タイトル」「背景」「実装概要」「コード変更の差分」「レビューコメントのやり取り」など、毎回作るのが面倒な構成を自動で出力できるため、
スライド構成を考える手間が減る
PRの文脈を整理しやすくなる
チームメンバーとの共有がスムーズになる
といった課題を一気に解消できます ✨

 📦 事前に必要なもの（依存コマンド）このスクリプトは以下のCLIツールに依存しています：


ツール
説明


gh
GitHub CLI。PRメタデータやdiffの取得に使用（要ログイン：gh auth login）


awk, sed

標準的なテキスト処理ツール（macOS/Linuxに標準搭載）


pbcopy / clip

（任意）生成結果をクリップボードに送るために使用（Tips参照）


 🧪 使い方使い方はとてもシンプルです。

GitHubのリポジトリ名とPR番号を指定するだけで、ChatGPTに貼るだけのプロンプトを出力してくれます。
sh ./pr2slide-prompt-generator.sh <OWNER/REPO> <PR_NUMBER> [LANG] [--exclude-comments]
たとえば、この記事で紹介しているOSSツールのLocustへのPR（#2550）に対して生成したときは、以下のように実行しました：
sh ./pr2slide-prompt-generator.sh locustio/locust 2550 ja | pbcopy
このコマンドで生成されたプロンプトをChatGPTに投げるだけで、

先ほどのスライドが完成しました ✨

 💡 スクリプトについてこのスクリプトには次のような特徴があります：
✅ コマンド一発で完結：複雑な設定は不要
🌐 多言語対応：ja, en など出力言語を選択可能（省略時は環境変数 LANG を参照）
🔒 プライバシー配慮：デフォルトではレビューコメントも含まれますが、--exclude-comments を付けると除外できます
グローバルな開発チームでも、社外への資料共有でも、そのまま活用できる柔軟な設計になっています。

 基本構文sh ./pr2slide-prompt-generator.sh <OWNER/REPO> <PR_NUMBER> [LANG] [--exclude-comments]


引数
説明


<OWNER/REPO>
GitHubリポジトリ名（例: locustio/locust）

<PR_NUMBER>
PR番号（例: 2550）

[LANG]
出力するスライドの言語（例: ja, en）。省略時は環境変数 LANG を使用

--exclude-comments
（任意）PRのレビューコメントをプロンプトから除外したいときに指定


 📝 便利Tips：生成結果をクリップボードにコピースライドプロンプトをすぐにChatGPTに貼りたいときは、クリップボードに直接送ると便利です。

 ✅ macOSの場合sh ./pr2slide-prompt-generator.sh owner/repo 42 ja | pbcopy

 ✅ Windows (PowerShell) の場合sh ./pr2slide-prompt-generator.sh owner/repo 42 ja | clip
そのままChatGPTにペーストすればOK！

 📚 Marpについて補足スクリプトで出力されたプロンプトを与えたChatGPTによって生成されるのは Marp 形式のMarkdownです。

MarpはMarkdownでスライドを作れるツールで、VS Codeで Marp for VS Code 拡張機能を使えば：

.md ファイルを開いて、右上のボタンでスライドプレビュー

PDFも拡張機能で出力できる
VS Codeで開くだけで、すぐにスライドとして確認・編集できます。

 📦 スクリプトの構成と生成されるプロンプトの構造このスクリプトは、シェルスクリプトと GitHub CLI だけで完結するシンプルなツールです。

実行すると以下のような処理を行い、Marp形式のスライド生成プロンプトをMarkdownで出力します。

 🔍 スクリプト内部の処理フロー
gh pr view で PR のタイトル・本文・コメント・コミット・ファイル一覧を取得

gh pr diff の出力を整形（1行200文字に制限して消費トークンを減らす）

gh api repos/.../readme で README を取得し、base64 デコード
最後に、Marp形式のスライドテンプレートとともに整形された情報を結合して出力

 🧩 出力されるプロンプトの構成（テンプレート）出力されるMarkdownプロンプトは、以下のような構造になっています：
--- で始まる Marp のメタ情報（テーマ、ヘッダー、スタイルなど）
PR 情報（タイトル、本文、レビューコメント、コミット、ファイル一覧）
PR の差分（長すぎる行は自動で短縮）
リポジトリのREADME（GitHub API経由で取得）
最後に、Marpスライド生成のための明示的な「指示文」
このプロンプトをそのままChatGPTなどに渡すことで、

背景・実装・コード変更・レビュー・成果といった構成を持ったスライドが自動生成されます。
実際のプロンプト全文はこちら（クリックして展開）---
marp: true
theme: default
header: 'produced by pr2slide'
footer: ''
paginate: true
size: 16:9
style: |
  section {
    font-size: 28px;
  }
---

# PR #2550 Information

## PR Metadata

（長いため省略）

## PR Diff (key blocks only)

​（長いため省略）

## Repository README

（長いため省略）

---

## Slide Deck Generation Instruction

Using the PR metadata and the diff above, please generate a slide deck in **Marp format Markdown**.
The goal is to create a presentation that clearly explains the purpose, implementation, and impact of the pull request to both technical and non-technical stakeholders.

### Slide Structure

1. Title slide (Repository name with link, PR title with link, author, date)
2. Context and Motivation (Why this PR was needed)
   - Start with a brief overview of the repository (1 slide).  
     For example, you can title the slide “About pr2slide” and summarize the purpose or background of the repository.  
     You may refer to the content of the repository’s README for this.
     And include a link to the Repository.
   - What limitations or constraints existed in the system?
   - How did these affect users or development workflows?
   - Why was this the right time to address them?
   - If an Issue is mentioned (e.g., Issue #1234), include a clickable link like:
3. Problem and Approach (What was solved and how)
   - What specific issues does this PR address?
   - What solution was chosen for each?
   - Were alternative approaches considered? Why were they rejected?
   - (Optionally) Mention alternative ideas considered and why they were not chosen
4. Implementation and code changes  
   - Combine explanation of implementation and actual code changes  
   - Organize by purpose or layer (e.g., Backend, UI, Test)  
   - For each: describe what was implemented, show relevant diff snippet, and explain the reasoning  
   - If any screenshots or demo images (e.g., GIFs) are included in comments, consider embedding them to illustrate the feature visually.  
     Display each image on a separate slide for clarity and maximum visibility.
5. Explanation of relevant technologies (optional final slide)  
   - Briefly introduce key tools/libraries used in the PR  
   - Useful for audience unfamiliar with the stack
6. Development process (commit order and workflow)
7. Summary of review feedback and author responses
   - 1 slide per reviewer
   - When a reviewer reacts positively to a fix (especially after a revision), include the praise prominently.
     If the praise is clearly stated (e.g., “Great improvement after your changes!”), create a dedicated slide just for that comment finally.
   - Quote or paraphrase specific points of discussion  
   - Highlight any design suggestions, naming issues, or test requests
8. Timeline of completion (how the work progressed)
9. Summary (1): Achievements
10. Summary (2): Future outlook
   - Describe what potential improvements, follow-ups, or refactoring opportunities were suggested
   - Include any future improvements or ideas discussed in the PR description, comments, or review threads
   - Especially highlight TODOs or "next step" suggestions mentioned by the reviewer or the author

### Notes

- Output must be in **Marp-formatted Markdown** (slides separated with \`---\`)
- Use headings (\`#\`, \`##\`) for each slide
- Use diff blocks for code snippets, and shorten if too long
- Please write the slide content in **ja**, following the standard writing style suitable for software engineers.

 🔭 今後の展望現在はコマンドラインスクリプトとして提供していますが、

将来的には以下のような形で SaaS化（Webアプリ化） できるといいなと考えています。
✅ GitHubのPR URLを入力するだけで、スライドを自動生成
🎨 複数のデザインテンプレートから 見た目を選択可能
✏️ Web UI 上で スライド構成をリアルタイム編集
技術的にもユーザー体験的にも、

「ドキュメントの自動化 × コラボレーション」が実現できるような方向を目指しています。

 ✍️ おわりに「PRの内容はちゃんと伝えたい、でも説明資料を書くのが大変…」

そんな時にこのツールが少しでも役に立てば嬉しいです。
PRスライドのたたき台が一瞬でできるので、

ChatGPTとの組み合わせで「爆速資料づくり」が可能になります🚀

引数	説明
`<OWNER/REPO>`	GitHubリポジトリ名（例: `locustio/locust`）
`<PR_NUMBER>`	PR番号（例: `2550`）
`[LANG]`	出力するスライドの言語（例: `ja`, `en`）。省略時は環境変数 `LANG` を使用
`--exclude-comments`	（任意）PRのレビューコメントをプロンプトから除外したいときに指定

ツール	説明
`gh`	GitHub CLI。PRメタデータやdiffの取得に使用（要ログイン：`gh auth login`）
`awk`, `sed`	標準的なテキスト処理ツール（macOS/Linuxに標準搭載）
`pbcopy` / `clip`	（任意）生成結果をクリップボードに送るために使用（Tips参照）

はじめに

🛠 作ったもの：Marpスライド用プロンプト生成スクリプト

📸 実際に生成されたスライド

📦 事前に必要なもの（依存コマンド）

🧪 使い方

💡 スクリプトについて

基本構文

📝 便利Tips：生成結果をクリップボードにコピー

✅ macOSの場合

✅ Windows (PowerShell) の場合

📚 Marpについて補足

📦 スクリプトの構成と生成されるプロンプトの構造

🔍 スクリプト内部の処理フロー

🧩 出力されるプロンプトの構成（テンプレート）

🔭 今後の展望

✍️ おわりに

Discussion