“Log in KGモーターズ Tech Blog 目次 Claude Codeでできることを一通りまとめてみた Sota Nakamura 2025/08/13に公開 GitHub Model Context Protocol Claude Claude Code Tech はじめに KGモーターズ株式会社でエンジニアをしている中村です。 最近KGモーターズ内でもAIを活用するムードが高まっており、せっかくなのでエンジニアがよく使うツールたちをまとめて社内外に知ってもらうのはありなのではと思い、第一弾としてClaude Codeに関する記事を書くことにしました。 Claudeとは Anthropic社が開発するモデルのシリーズ名。Anthropic社は元々OpenAI社で働いていた従業員達が創業した会社です。 安全性を重視しており、またコーディング能力が高いのが特徴です。 Claude Codeとは Anthropicが提供しているCLIベースのAIコーディング用エージェントです。 プレビュー期間はありましたが、2025/05に一般公開されました。 この時期はCursorやClineなどコーディング支援ツールが人気でしたが、みなさんお馴染みのエディターであるVSCodeにClaude Codeが対応したことで話題となった気がします。 使い方などはアップデートも早いので、チュートリアルを見るのが確実です。 主な特徴 とはいってもどんな特徴なのか?というと… 自然言語指示で高品質なコードを生成してくれる 実行中にToDoリストを作成して、どこを作業してるのかの進捗報告をしてくれる 途中で指示してもいい感じのタイミングで拾ってくれる Githubとの連携もスムーズ VS Codeから使える MCPサーバーも使える etc… ざっとこのくらいは余裕でできてしまいます。 ということで、上記からいくつかピックアップして事例やTipsを紹介します。 その前に環境構築は終わらせておきましょう。 環境構築 公式ページの通りに進めてインストールをしましょう。 ⚠️ 私は事前にProプランに入っております 黙ってclaude-codeを入れましょう $ npm install -g @anthropic-ai/claude-code インストールできたかな? $ claude –version 1.0.72 (Claude Code) とりあえず起動する $ claude 初期設定でテーマを決めてと言われたり Loginが必要だったり、注意書きがでたり…しますがよしなに捌いていただき、完了させてください。 始める前に前提知識 スラッシュコマンド スラッシュコマンドは会話中に/で始まるコマンドを入力することで、特定の機能を素早く実行できる仕組みです。 スラッシュコマンドを使うことで開発作業を効率化することができます。 よく使うのはこの辺でしょうか… コマンド できること /login 別のアカウントに切り替る /logout 現在のアカウントからログアウト /bug AnthropicにBugレポートをする /config Claude Codeの設定を表示または変更 /clear 会話履歴をクリアしコンテキストを空に /compact 要約をコンテキストに維持し会話履歴をクリア /init CLAUDE.mdを初期化 /ide IDE統合を管理&状態の表示 カスタムコマンド カスタムコマンドを使うと、よく使う操作を自動化することができます。 指定の場所にマークダウンファイルを作成し、その中に指示を書くとテンプレート化できるということです。 置き場所1: .claude/commands 実行時のプレフィックス /project: 使用シーン チーム開発で共有するプロジェクト固有のコマンド Gitなどで管理する よくある使い方 コーディング規則のチェック テスト手順書 プロジェクト固有の制約(ドキュメントを作成するなど) 作成と使用方法 ちゃっかりオプションの引数を使っちゃったりできます $ mkdir -p .claude/commands $ echo “Issue #ARGUMENTS を以下の手順で確認して実装してください。手順: 1. 背景の理解 2. 対象コードの特定 3. 解決策の立案 4. 実装 5. テストの作成 6. PRの作成” > .claude/commands/feature-issue.md /project:feature-issue 56 置き場所2: ~/.claude/commands/ 実行時のプレフィックス /user: 使用シーン 個人開発ワークフローや全体的なタスク 全てのPJで使用可能 よくある使い方 自分でいつも行っているチェックリストの適用 よくある実装パターン 作成と使用方法 上とほぼ同じのため割愛します claudeコマンド Claude Codeをはじめる時にclaudeコマンドを使うと思いますが、並列で一気にコーディングしたい時、ファイル作成許可などを聞いてくるのが困るというケースもあると思います。 その他自律的に動いてほしい時に以下のコマンドで立ち上げる時もあります。 claude –dangerously-skip-permissions 自然言語指示で高品質なコードが生成される やること ではまず手始めに簡単なWebサイトを作成してみましょう。 特に画像も与えず、KGモーターズの簡単な会社紹介のみをプロンプトに含めます。 今からKGモーターズ株式会社の簡単なホームページをNext.jsで作成してください。 以下が会社情報です。実際の車の画像はないですが、ワクワクし、おしゃれなデザインに仕上げてください。 ====================== 会社名:KGモーターズ株式会社 設立:2022年7月28日 事業内容:小型モビリティロボットの製造・販売・MaaS開発 代表取締役:楠 一成 資本金:9500万円 累計調達額:20.2億円(デット・エクイティ含む) 本社所在地:広島県東広島市西大沢2丁目2-9 Vision: 今日より明日がよくなる未来を創る かつて日本には、「明日はきっと今より良くなる」という空気がありました。モノやサービスは今よりずっと不便でも、未来には“伸びしろ”があると信じられていたのです。 しかし、今の成熟した社会では、モノやサービスが良くなりすぎた結果、維持できなくなっているものがあり、希望が少しずつ失われつつあります。 その象徴が「移動」です。 移動の自由は、人間の生活や欲求に深く関わるもの。 そこに制限がかかると、日々の行動だけでなく、未来への期待そのものが閉ざされてしまいます。 だからこそ私たちは、移動のあり方を根本から見直し、“明日が楽しみになる感覚”を、もう一度社会に取り戻そうとしています。 Mission: 「小型モビリティロボットで 世界をワクワクさせる」 これからの人口減少社会において必要なのは、大量輸送ではなく、ひとりを、最小のエネルギーとコストで運べる、新しい移動の選択肢です。 けれど、“我慢して選ぶ移動”では、社会に根づくことはありません。 「乗りたくて選んでいたら、結果的に持続可能な移動につながった」 そんな未来を実現するために、私たちはワクワクするモビリティづくりを目指します。 その他: 誰もが、安全で、快適で、自由に、 手頃な価格で移動できる社会を目指して 私たちは、小型モビリティロボットを通じて、移動の「楽しさ」と「持続可能性」を両立させることに挑んでいます。 たとえ維持コストや環境負荷がどれだけ低くても、我慢して乗る移動手段では、真の持続可能とは言えません。 “乗りたくて選んだら、それが持続可能につながっていた。”そんな未来こそ、私たちが目指す世界です。 実行後 こんな感じでTodoリストを勝手に作成してくれます。 ⏺ KGモーターズ株式会社のホームページを作成します。ワクワクするおしゃれなデザインで仕上げましょう。 ⏺ Update Todos ⎿ ☐ Next.jsプロジェクトのセットアップ ☐ ホームページのレイアウト設計と基本構造作成 ☐ 会社情報セクション(会社概要、代表者情報等)の実装 ☐ Vision・Missionセクションのデザインと実装 ☐ レスポンシブデザインとスタイリングの調整 ☐ アニメーションやインタラクションの追加 終わったそうです。 開発サーバーが起動しています:http://localhost:3000 ブラウザでアクセスすると、KGモーターズのワクワクする未来の移動をテーマにしたホームページをご覧いただけます! この後少々手直ししましたが、こんな感じです。これがワクワクするのか?の定義は置いておいて、このくらいのクオリティのものが速攻でできてしまうということです。 Githubとの連携 github CLIを使うことでPull requestも勝手に出してくれます。 CLIが入ってない状態だとインストールは勝手にやってくれますが認証ができずエラーになりますので $ gh auth login ターミナルに出た数字をブラウザに打ち込んで認証ができます。 上記ができた前提でやっていきましょう。 PRの作成 カレントディレクトリがgit対象フォルダだとします。とりあえずまっさらなリポジトリを用意しました。 ここで以下のプロンプトを打ち込みます。 $ claude 今からテーブルデータのデータ分析をNotebookで行いたいので環境構築と必要なライブラリを用意してください。完了したらPull requestをだしてください。 実行したら以下のようにTodoリストを作って作業を始めてくれました。 ⏺ データ分析用のNotebook環境を構築します。まずタスクを整理してから進めます。 ⏺ Update Todos ⎿ ☐ プロジェクトの現状を確認 ☐ データ分析用Jupyter Notebook環境を構築 ☐ 必要なライブラリをインストール(pandas, numpy, matplotlib, seaborn等) ☐ サンプルNotebookを作成 ☐ 変更をコミット ☐ Pull requestを作成 ちょこちょこ承認を求められるのですが、進め方に問題はなさそうです(強いていうならライブラリ管理がrequirements.txtかーくらいですが許容範囲です)。 そして無事Pull Requestができていました。サンプルの分析Notebookまで作ってくれていました。 該当Issueを実施する 上記ではプロンプトでTaskを与えてPull Requestを出しましたが、通常開発ではIssueにタスクが書かれており、そのIssueを実施してPull Requestを出すと思います。 このFlowを模擬してみます。 以下のIssueを作成しました。実際にはこんなTaskを誰かに渡したら「分類したいクラスはなんだ?」「カラム名には何があるか?」など要件を普通に聞かれますが、一旦雑に出してみます。 ではいきましょう > Issue 2のTaskを実施し、Pull Requestを作成してください。 実行後…ちゃんとIssueを拾っていることがわかります。 ⏺ Issue 2のタスクを確認するため、GitHubのIssueを取得します。 ⏺ Bash(gh issue list) ⎿ 2 OPEN 2クラス分類の雛形コードの作成 2025-08-10T16:29Z さてPull Requestが出てきました。 コードもざっとみましたが、しっかりできてそうです。こんな感じでIssueも拾って開発が進められます。 Githubとの連携(Claude Code GitHub Actions) さっきはClaude CodeからGithubを呼び出して(厳密にはCLI経由で)自律的に開発を行っていましたが、Claude Code GitHub ActionsではGithub上からCluade Codeが使えるようになります。 で、何がいいの?おいしいの?という感じかもしれませんが、これは本当にすごいと思いました。 Github上で@cluadeとメンションをつけるとタスクリストを含むコメントが返ってきて実装を終わらせてくれます。 Claude Code Actionをさっそくレビューしてみた!より抜粋 以下の記事の最後でも触れられているのですが、これはスマホから開発が行えるという可能性があるということです。(スマホでGithubにコメントしてClaudeがタスクを終わらせてくれる)。 一方でマージ前の検証をどう担保するか?は課題としてあるので、プロジェクトの性質に合わせて自動検証の仕組みを入れておくとうまく回る気がしています。まさにAIに合わせて業務フローを再度考えるということですね。 では早速使ってみましょう。 セットアップ 以下のQuick Startを見ながらやっています。 claudeで対話セッションモードになったら以下を実行します /install-github-app おそらくGit管理されたディレクトリで実行すれば、current repositoryに対象のリポジトリがでてくると思います。 Install GitHub App Select GitHub repository > Use current repository: {owner name}/{Repository name} Enter a different repository するとブラウザに飛び色々と確認されるので、claude code github actionsを入れたいリポジトリを選びInstallします。 次にClaude Code発動タイミングの選択がありますが、メンションをつけた時だけでいいので上を選択… Select GitHub workflows to install We’ll create a workflow file in your repository for each one you select. ✓ @Claude Code Tag @claude in issues and PR comments ✓ Claude Code Review Automated code review on new PRs この後API Keyを入れるよう求められますが、持っていない方は以下から作成しましょう。 Claudeのアカウントとは別にアカウント登録が必要なようです。 アカウント登録が終わったら、Get API Keyから作成します。API Keyは右ポケットにこっそりしまっておきましょう。 ⚠️最初は$5くらい付いていたきがするので、お試しで触る方はこのままいきましょう ! 私の場合、github CLIにworkflowの操作権限がなかったので、以下のエラーが出てしまいました。 Error: Failed to create workflow file .github/workflows/claude.yml: gh: Not Found (HTTP 404) そのため以下のコマンドで権限を付与してから再実行しております。 gh auth refresh -h github.com -s repo,workflow セットアップが完了するとブラウザが立ち上がりPull Requestの画面になります。Create Pull Requestで次に進みましょう。 Github Actionsのworkflowができていますね。 これをマージしてセットアップ完了です。 動かしてみる 例えばこういうIssueを作ってみましょう。 ではいってらっしゃい。 きたきた… 進捗もちゃんとみれます。誰にこんな丁寧なホウレンソウを教わったんでしょうか。 終わったようです。 作成されたブランチからPull Requestを出して終わり、ということです。 めっちゃ簡単で怖い… MCP MCPはModel Context Protocolの略です。 要はAIとAIが使うツールが通信してAI自身が色々なツールを使えるようにすることです。 元々は2024年末にAnthropic社が提案しました。 このプロトコルに則っていればAIが複数のツールを使うことができ、より便利さが加速するというわけです。 Anthropic社が提案して広がったというより、2025年の春先にOpenAIが「GPTにもMCP使えるようにする」と言ったことで一気に加速したイメージです。 MCPを活用した事例としては ローカルPCと接続してブラウザ操作 puppeteer MCP 受け入れテストなどのWebサイトのテストが自動化できたりする デザインに沿ったアプリ開発 figma MCP こちらを見るとよくわかります(figmaも有料プランでないとダメなのがつらい) などがありますが、一番上のpuppeteerを使ってみましょう。 ローカルPCと連携 Puppeteer MCPサーバーのインストール $ npm install -g @modelcontextprotocol/server-puppeteer 設定ファイルの準備 ~/.claude/settings.jsonに以下を記載 { “mcpServers”: { “puppeteer”: { “command”: “npx”, “args”: [“@modelcontextprotocol/server-puppeteer”] } }, “toolPermissions”: { “mcp__puppeteer”: “session”, “mcp__puppeteer__puppeteer_navigate”: “allow”, “mcp__puppeteer__puppeteer_screenshot”: “allow”, “mcp__puppeteer__puppeteer_click”: “session”, “mcp__puppeteer__puppeteer_type”: “session”, “mcp__puppeteer__puppeteer_evaluate”: “session” } } ちなみに権限の意味は以下です。 allow: 確認なしで自動実行 session: セッションごとに確認 never: 実行負荷 MCPサーバーの追加 $ claude mcp add puppeteer npx @modelcontextprotocol/server-puppeteer 確かに追加されています。 $ claude mcp list Checking MCP server health… puppeteer: npx @modelcontextprotocol/server-puppeteer – ✓ Connected 使ってみた 以下のショート動画を使って大事なシーンをカットして解説書を作ってもらいます。 https://www.youtube.com/shorts/Dv0k_lgEfxQ このショート動画で大事なシーンのスクショを取り、何を言っているか解説メモをのこしてください。 出てきたメモはこれです。趣旨やまとめはバッチリなのではないでしょうか。 # KGモーターズ YouTube Shorts 動画解説メモ ## 動画概要 – チャンネル: @KG_motors – タイトル: 「数万回開けても繰り返してる」 – 説明: YouTubeから始まった、EVメーカー 2万回達成!mibot、ドアの開閉テストの様子 ## 重要シーン解説 ### シーン1(初期画面)  – KGモーターズの工場内で、mibotという超小型EVの前に立つエンジニア – 字幕: 「数万回開けても繰り返してる」 – 工場の緑色の柱と明るい照明が見える ### シーン2(テスト説明)  – 同じエンジニアがmibotのドアテストについて説明 – 字幕: 「人がやった方が早いと今回は」 – ドアの耐久性テストに関する話をしている様子 ### シーン3(テスト実施中)  – 実際にmibotのドアを開閉している様子 – 字幕: 「気でもおかしくなったんですが。」 – 右下に小さく別の人物(おそらく社長やマネージャー)が映っている – 繰り返し作業の大変さを表現 ### シーン4(感想・まとめ)  – 眼鏡をかけた別の人物(おそらく責任者)が登場 – 字幕: 「感想を一言お願いします」 – 工場の明るい環境で、テストに関するインタビューを受けている ## 動画の主旨 – KGモーターズのmibot(超小型EV)の品質管理について – ドアの開閉テストを数万回実施していることをアピール – 手作業での耐久テストの様子を紹介 – 製品の信頼性に対する取り組みを示す広報コンテンツ ## 技術的ポイント – 物理的な耐久テストの重要性 – 品質保証プロセスの透明性 – 小規模メーカーならではの丁寧な検証作業 その他 バージョンアップが頻繁にされるのでここをみておくと良いです。 あとはClaude CodeのHooks機能を使うと、決まったタイミングで何か処理を自動化することもできたりします。 最後に KGモーターズでは開発エンジニアを募集しております! mibotのソフトウェア開発に興味のある方はぜひお気軽にご連絡ください! Sota Nakamura 1人乗り小型モビリティを開発するKGモーターズでソフトウェア開発をしています! フォロー KGモーターズ Tech Blog Publication 「今日より明日が良くなる未来を創る」をVisionに、ワクワクする小型モビリティを開発しているKGモーターズのTech Blogです。 エンジニア採用中です! フォロー Discussion ログインするとコメントできます Login エンジニアのための情報共有コミュニティ About Zennについて 運営会社 お知らせ・リリース イベント Guides 使い方 法人向けメニュー New Publication / Pro よくある質問 Links X(Twitter) GitHub メディアキット Legal 利用規約 プライバシーポリシー 特商法表記 ” https://zenn.dev/kg_motors_mibot/articles/f46c6927c409fc#:~:text=Log%20in,%E7%89%B9%E5%95%86%E6%B3%95%E8%A1%A8%E8%A8%98
Claude Codeでできることを一通りまとめてみた
