Deep Dive into CodeMap, SWEとして生き残るために必要な道具

Devin 1st Anniversary Meetup Japan Deep Dive into CodeMap SWEとして生き残るために必要な道具

自己紹介 - Kuu Main Role Software Engineer at Mercari Kuu Systems AI関連相談相手 スマホ/Webアプリ受託 趣味 海外旅行 Vibe Coding

今回伝えたいこと 1 Devin + Windsurf 系列はソースコードを解析して 情報をとり出すのに強い (Devin + Windsurf series are strong at analyzing source code to extract information) 2 既存ソースコードの情報を読み取る上で Codemapが有益 (Codemap is beneficial for reading information from existing source code) 3 Deepwikiを使えばDevinに課金してない人でも Devinの力を使える (Deepwiki allows non-subscribers to use Devin's power)

なぜ、Codemapを私が使うのか Software Engineering vs. Vibe Coding 学習コストが極小 (Minimal Learning Cost) Vibe Coding 結果だけを見ればよい (Results oriented) Software Engineering コードを理解し、価値 を創出 (Understand code & Create Value) Metaphor: Delicate game of Jenga エンジニアの思考プロセ スがそのままGUIに (Engineer's thinking process mapped to GUI) 直感的なワークフロー (Intuitive workflow) Engineer's Thinking Process Intuitive UI Layout

DeepWikiという機能がある 自動解析と生成 既存のソースコードを 解析してWikiを自動生成 継続的な更新 1週間に1回、ソースコード 更新時にWikiも自動更新 検索とマッピング機能 Wiki内での検索が可能 Codemapの作成が可能

DeepWikiを使う方法 (How to use DeepWiki) Devin or Windsurf契約 Devin or Windsurf契約 有料ユーザーが利用可 能な完全機能 会社のDeepwikiを使う 会社のDeepwikiを使う 企業契約による社内リ ポジトリへのアクセス OSSなら無料で使える OSSなら無料で使える deepwiki.com で 無料利用可能

Codemapとは (What is Codemap) AIが生成するコード の「地図」 従来のチャットベースと異な り、、コード行にリンクした 構造化ナビゲーション エンジニアの脳を 「ON」にするツール Vibe Codingの「Vibeslop」を 防ぎ、理解と説明責任を維持 DeepWikiと Ask Devinの進化形 リアルタイムかつタスク特化 型のコードベース理解 DeepWiki Ask Devin

Codemapの使い方 - 起動と生成 起動 (Launch) 起動方法 (How to Launch) マップアイコンをクリック または `Cmd+Shift+C` 生成プロセス (Generation Process) STEP 1 プロンプト入力 (Input Prompt) 実行したいタスクを入力、または自動提案を選択 STEP 2 モデル選択 (Select Model) Fast: SWE-1.5 (高速処理) Smart: Sonnet 4.5 (高精度) STEP 3 生成実行 (Execute Generation)

Slide 9: Codemapの使い方 - 2つの表示モード モード1: リスト形式 (List Mode) グループ化・ネストされたコード箇 所を確認 階層的な構造把握に最適 モード2: ビジュアルマップ (Visual Map Mode) ノードをクリックして関連コードに 直接ジャンプ 「See more」で詳細な説明 (trace guide) を展開可能 視覚的な依存関係の理解

Codemapの使い方 - Cascadeとの連携 Section 1: @{codemap} 参照の活用 Prompt | @{codemap} プロンプト内で`@{codemap}`を使用 AIエージェントに特定のコンテキスト を提供 タスク実行の精度を大幅に向上 Section 2: 実践的な効果 より正確なコード生成 コンテキストに基づいた最適な提案

実践Tips Tip 1: PR変更の追跡 (Tracking PR Changes) PR +/- "Please explain about diff between master branch" PRでの変更を追いやすくする Tip 2: 日本語での説明 (Explanation in Japanese) JP A文 "Explain in Japanese" 日本語で説明させることで理解を深める

まとめ - SWEとして生き残るために Codemapはエンジニアの 「理解」を助けるツール AI生成コードを「なんと なく動く」で終わらせ ない コードの構造を可視化 し、説明責任を維持 DeepWikiは 誰でも始められる OSSリポジトリなら deepwiki.comで無料利 用可能 社内リポジトリはDevin/ Windsurf契約で解放 SWEとして 生き残るために Vibe Coding時代でも 「コードを理解する力」 が差別化要因 AIツールを「使う側」か ら「使いこなす側」へ