Tweet
Tweet

Slide 1

Slide 1 text

「backlog-exporter」とAIの連携 による業務効率化 2025/03/14 リテールアプリ共創部 部会 戸田 駿太

Slide 2

Slide 2 text

部署 リテールアプリ共創部 名前 戸田 駿太 オフィス 日比谷オフィス 趣味 キャンプ サッカー バイク 料理 X https://x.com/shuntemskills 自己紹介 2024年4月　クラスメソッドへ新卒入社 2024年9月　技能五輪国際大会出場 2024年10月　リテールアプリ共創部へ配属 現在　運用保守チームに所属

Slide 3

Slide 3 text

【目的】BacklogとAIを組み合わせて業務効率化をしよう！

Slide 4

Slide 4 text

プロジェクトの課題 情報検索に時間がかかり効率が悪い オンボーディングに多くの工数が必要 過去の知見を活かした見積もりが困難 情報統合が手作業で非効率 知識が属人化しやすい プロジェクト間の知見共有が不足 Backlogで検索をかけた時の画像 (wikiが多くて探しにくい) 課題も多くて探しにくい

Slide 5

Slide 5 text

これを解決するためにツールを作ってきました！

Slide 6

Slide 6 text

Backlog Exporter DevelopersIoのブログ npmパッケージ 作ったもの

Slide 7

Slide 7 text

「backlog-exporter」ってどんなもの？ npmを使って簡単にインストール・実行可能 一度のコマンドで全データをエクスポート 更新コマンドで最新情報を簡単に同期 マークダウンで保存 Backlogの課題とWikiをローカルに保存するCLIツール 課題のみをエクスポート $ npx backlog-exporter@latest issue --domain example.backlog.jp --projectIdOrKey PROJECT1 --apiKey あなたのAPIキー wikiのみをエクスポート $ npx backlog-exporter@latest wiki --domain example.backlog.jp --projectIdOrKey PROJECT1 --apiKey あなたのAPIキー データを更新 $ npx backlog-exporter@latest update 課題とwikiを一括エクスポート $ npx backlog-exporter@latest all --domain example.backlog.jp --projectIdOrKey PROJECT1 --apiKey あなたのAPIキー

Slide 8

Slide 8 text

「backlog-exporter」でどうやって課題を解決する？ AIを使ってBacklogのRAGを実現 エクスポートしたMarkdownファイルをAIに読み込ませる GitHub Copilot / Cursor などのAIツールで活用 プロジェクト固有の情報に基づいた回答が可能に 自然言語でのやり取りで情報アクセスが容易に backlog-dataを参照して 〇〇について教えて 参考: ディレクトリ構造 / ├─ backlog-data │ ├─ backlog-project1 │ │ ├─ issue │ │ │ ├─ 課題1 │ │ │ └─ 課題2 │ │ └─ wiki │ │ ├─ wiki1 │ │ └─ wiki2 │ └─ backlog-project2 │ ├─ issue │ └─ wiki ├─ githubリポジトリ1 └─ githubリポジトリ2

Slide 9

Slide 9 text

具体的な活用シーン

Slide 10

Slide 10 text

backlog-exporterの活用例 オンボーディング の効率化 ナレッジ検索の 高度化 ドキュメント 作成支援 プロジェクト 横断分析 タスク 見積もり支援 ドキュメントから ソースコード探索 仕様確認の 効率化 コードレビュー 支援 使い方次第でいっぱいある

Slide 11

Slide 11 text

backlog-exporterの活用例: オンボーディングの効率化 実際の出力（機密情報はマスクしています） 〇〇について教えてと聞いてみる 新メンバーがプロジェクトの概要を素早く理解 「このアプリはどんなもの？」と質問するだけ 先輩に何度も質問する必要がなくなる プロジェクト固有の用語も理解しやすく Cursorがファイルを探索して情報を取得 その結果に基づいて〇〇の情報をまとめてくれる まず、バックログフォルダの内容を確認して、〇〇に関する情報を探してみます。 〇〇に関する情報を探すために、wikiディレクトリを確認してみましょう。 まず、Home.mdファイルを確認して、プロジェクトの概要を把握しましょう。 次に、用語集を確認して、〇〇の定義を探しましょう。 次に、機能要件を確認して、〇〇の機能について詳しく調べましょう。 〇〇についてさらに情報を得るために、技術情報ディレクトリを確認しましょう。 リポジトリ情報を確認して、〇〇のシステム構成について調べましょう。 AWS構成図を確認して、〇〇のシステム構成についてさらに詳しく調べましょう。 〇〇のAWS構成図を確認しましょう。 最後に、〇〇のネットワーク仕様書を確認しましょう。 収集した情報をもとに、〇〇について説明します。 # 〇〇について 〇〇は「〇〇〇〇」の略称で、〇〇を利用して〇〇するサービスです。このサービスには 以下のような特徴があります： ## 主な機能 1. **〇〇表示**： - 〇〇 - 〇〇（〇〇機能） 2. **〇〇**： - 〇〇のデジタル版 3. **〇〇〇〇**： - 〇〇のうち、〇〇を登録して〇〇する機能 - 〇〇の機能を指す ## システム構成 - **〇〇サーバ**：〇〇の機能を搭載したサーバ（〇〇環境） - **〇〇**：一時的に表示される〇〇 - **〇〇環境**：WAF、API Gateway、Lambda、CloudFront、S3などを利用 //実際はもう少し長く出力してくれます

Slide 12

Slide 12 text

backlog-exporterの活用例: オンボーディングの効率化 別チームの調査タスクを行うことがあった プロジェクトの知識がないためbacklog-exporter とCursorを駆使してタスクを理解 オンボーディングと調査を爆速で実施できた 実際に別チームのオンボーディングをした時の話

Slide 13

Slide 13 text

backlog-exporterの活用例: ドキュメント作成支援 質問例: 過去の類似ドキュメントを参考に新規作成 プロジェクト固有のフォーマットに沿った文書生成 コードと合わせて読み込むことでより正確に 議事録や報告書の下書き作成も可能 コード参照してログイン機能の仕様書を作 成して 他のドキュメントのフォーマットを参考に 〇〇のAPI仕様書を作成して （Backlogのmdを指定して）このタスクの 変更点をコードを参照して詳細にまとめて

Slide 14

Slide 14 text

backlog-exporterの活用例: ドキュメント作成支援 API設計書を作成するタスクで大活躍 このAPI設計書はかなり詳細な記載が必要 コードを隅々まで読んで言語化する必要がある 最終的にBacklogのwikiに保存 従来 コード確認、設計書作成など全て手作業で一つ6時間かか っていた 現在 Backlogの中にある設計書を全てAIに読み込ませる 鍛え上げたプロンプトを使用してほぼ完成 それをレビューして修正 全部合わせて1.5時間ほどで完成するようになった 参考プロンプト @{出力先.md} にPOST /xxxx のAPI設計書を書いてください。 OpenAPIは @xxxx.yaml に記載してあります。 フォーマットは @{参照先ディレクトリ} の他のAPI設計書を参考にしてくだ さい。 内部のコードは @{参照先リポジトリ} に書いてあります。 必ずコードを読んで間違いの無いように記載してください。 4倍効率化できた！

Slide 15

Slide 15 text

backlog-exporterの活用例: Backlog更新確認 プロンプト例: Backlogの更新をAIで確認する 昨日からのBacklogの課題やwikiの更新を まとめてくれる 更新した人や内容を要約してくれる リンクを貼ってもらうことで実際の Backlogのページを確認することができる ## 更新確認依頼 課題の更新について確認依頼が来た場合、以下の手順で作業をし てください。 1. 現在日付を取得するために `date` コマンドを実行する 2. `backlog-settings.json`ファイル内のlastUpdatedを確認し、日本 時間で4時間以上前の場合は、データを再取得する必要がある。 こ ちらのコマンドを実行する。`backlog-exporter update --force` 3. 更新確認対象の期間が指定されていなければ、前日9時から現在 時刻までとする。 4. `backlog-update.log`を確認し、指定された期間に更新があった 課題を、更新確認対象とする。 5. 更新があった課題の全ての、更新内容を「誰が」 「誰に対して」 「何をコメントしたか」を必ず明確にまとめること。まとめる際 は、必ず課題のURLを記載して、URLはクリックしたら遷移できる 状態にして。

Slide 16

Slide 16 text

最後にちょっとだけ技術的なところ

Slide 17

Slide 17 text

採用した技術スタック Typescript 言語 単純に使い慣れている TSのCLIフレームワー ク 機能が豊富 簡単にCLIが作れる Github Actionsが最初 から実装されていた npmに公開する時も簡 単だった AIに最適化されたエデ ィタ ほとんどAIにコードを 書いてもらった AIがない開発はもうで きない... Claude 3.7 sonnetが 優秀 Node.jsのパッケージマ ネージャー npmで公開することで 誰でもコマンドがすぐ に使える oclif Cursor npm

Slide 18

Slide 18 text

ご清聴ありがとうございました！