🤖

AI Codingの社内向けガイドを作成しました | Resilire Tech Blog

に公開

はじめに

レジリアの奥村@arashigaoka3 です。

AI Codingは得意な人が活用すると爆発的に生産性が向上する一方で、ツールのアップデートが激しく、業務が忙しいとキャッチアップが難しかったり、やり方を間違えると逆に非効率になってしまう一面があります。
Resilireでは、ほぼどのツールでも自由に使って良い一方で、具体的な知見の共有が進んでいない面もあったため、ガイドを作成しました。
このブログでは、社内の雰囲気の共有も兼ねてそのガイドをほとんどそのまま共有させていただきます。
以下が弊社のSCRM(Supply Chain Risk Management)リポジトリをベースにしたガイドです。

AI Coding guide

対象読者

  • エンジニア
    • CursorやGithub copilotのような、エディタ型がメインの人
    • AI codingの経験が全くないという人

前提

本ガイドでは、Claude Codeを利用する。(最近は他の強力なツールも登場しているが依然として有力な選択肢の1つ。)

ClaudeCodeとは

  • Claudeのモデル自体を開発している、Anthropicが開発したコーディングエージェント。
  • Claude Opusのような非常に高性能なモデルを利用できる点が強み。
  • ターミナル操作に限定され、GUIに慣れたユーザーにとってはては初期の扱いにくさが弱み。
  • claudecodeuiなど、OSSでUIを開発してるところもあるので、そのうちそれを通すのが主流になるかも。

始め方

node.jsが入っていれば、npmでインストールするだけ。scrmのfrontを使っている人はpnpmがいいかな。

pnpm i -g @anthropic-ai/claude-code
cd /path/to/scrm
claude

おすすめのワークフロー

  • プランモードでultrathinkする

    • Shift + Tabを何度か押すと、プランモードになる
      • プランモードはファイル編集をしないモードで、よく考えて作業してくれる
    • ultrathinkというキーワードをつけると、拡張思考モード(つまり賢くなるってこと)になる
  • 複雑なタスクを行いたい場合は、**Explore, plan, code, commit** のように、Exploreのフェーズを入れると良い

  • 僕はhooksも活用して以下のフローで作業している(そのうちカスタムスラッシュコマンドにするかも)

  • lint,buildが終わるまでは作業を続行

  • 終わったらgit addでステージング

  • difitでレビュー

    npx difit . --port=13001
    
  • レビューコメントはコピープロンプトして修正させる

  • 終わったらコミットさせる

  • ブランチの作業が終わったら、

    • asana mcpでテスト観点を書かせる
    • PRをdraftで出す
    • PRでclaudeにレビューさせる
    • OKならPRをopenにする

よくハマるやつ

画像を貼り付ける時はcommand+vではなく、ctrl+v

おすすめの設定シリーズ

  • denyコマンドの設定(これは上級者向けなので後からで良い)

  • hooksの設定

    具体的なshellを書いてますが、社内に最適化されてるので略
    
  • mcp

    • mcpとは、claude codeからいろんなツールを利用させるプロトコル。僕が使っていて便利なものを共有

    • figma mcp

      • figmaのデザインを参照するもの
      claude mcp add -s user --transport sse figma-dev-mode-mcp-server http://127.0.0.1:3845/sse
      
    • playwright mcp

      • スクショを取らせたり動作確認に便利
      claude mcp add -s user playwright npx @playwright/mcp@latest
      
    • asana mcp

      • チケット操作を簡単にできる
      claude mcp add --transport sse -s user asana https://mcp.asana.com/sse
      
    • o3 mcp

      • 特にライブラリの使い方がわからなかったりバグったりした時に便利
      • claude codeからo3に問い合わせてくれる。ただたまに不安定なので様子を見てあげよう
    claude mcp add o3 -s user \
    -e OPENAI_API_KEY={YOUR_KEY} \
    -e SEARCH_CONTEXT_SIZE=medium \
    -e REASONING_EFFORT=medium \
    -- npx o3-search-mcp
    
    • context7
      • 僕は今のところ使っていないが、色んなツールの最新の情報を参照できて評判もいい
  • git-worktree

    • 複数環境で作業したい人むけ
    • 僕はこんな感じでdirectory切っている
    ├── claude
    │   ├── review
    │   ├── scrm
    │   ├── scrm-2
    │   ├── scrm-3
    │   ├── scrm-4
    │   ├── scrm-5
    │   ├── scrm-6
    │   └── worktree-setup.sh
    
    • envのコピーとかshellがめんどいのでworktree-setup.shってやつに集約している
    #!/bin/bash
    
    # Usage: ./worktree-setup.sh [branch-name] [worktree-path]
    # 以下略
    
  • カスタムスラッシュコマンド

    • /prコマンド`
      • 随時更新中

まとめ

Resilireではガイドの作成以外にも、AI Codingによるモブプロや、Claude Code Actionsをエンジニア以外も利用できるようにするなど、AI Codingの民主化に取り組んでいます。

採用情報

Resilireでは、AI技術を活用して革新的なサービスを開発したいエンジニアを募集しています。

詳しい採用情報はこちらからご確認いただけます:
https://recruit.resilire.jp/

Discussion