OpenClaw入門（初心者編）——セットアップからGitHub連携まで手を動かして学ぶ

はじめに

前回の導入編で、OpenClawの全体像と他ツールとの違いを解説しました。

「面白そうだけど、実際に動かしてみないとわからない」——その通りです。本記事では手を動かしてOpenClawを体験することに集中します。

本記事はOpenClaw 3部作の初心者編です。

この記事を読み終わると、以下ができるようになります：

• OpenClawをインストールし、Gatewayを起動する
• メッセージングチャネル経由でOpenClawと対話する
• GitHub連携でIssue管理・PRレビューを自動化する
• ファイル操作やMCPサーバー連携の基本を理解する

事前準備

必要なもの

Node.jsのバージョン確認

node --version
# v22.0.0 以上が必要

v22未満の場合は、Node.js公式サイトからLTS版をインストールしてください。

APIキーの料金について

OpenClawではClaude Pro/MaxプランのOAuthトークンは使用できません。2026年1月にAnthropicがサードパーティツールでのOAuth利用を禁止したためです。LLMのAPIキー（従量課金）が必要になります。

Claude API料金表（100万トークンあたり）：

実際の利用コスト目安：

Anthropicの公式データでは、開発者の90%が1日$12未満で利用しています。コストを抑えるには、**Batch API（50%オフ）**やプロンプトキャッシュ（最大90%オフ）の活用が有効です。

なお、OpenClawはClaude以外にもOpenAI（GPT-4）やDeepSeekにも対応しています。コストを優先する場合はDeepSeekも選択肢になります。

ハンズオン 1: OpenClawのインストールと起動

Step 1: インストール

macOS/Linuxの場合、ワンライナーでインストールできます。

curl -fsSL https://openclaw.ai/install.sh | bash

npmで直接インストールする場合：

npm install -g openclaw@latest

Step 2: オンボーディングウィザード

インストールが完了したら、対話型のセットアップウィザードを実行します。

openclaw onboard --install-daemon

ウィザードでは以下を順に設定します。

認証設定では、Anthropic APIキーの入力が求められます。 Claude APIを利用する場合は、Anthropic ConsoleでAPIキーを取得してください。

Step 3: Gatewayの状態確認

openclaw gateway status

以下のような出力が表示されれば正常です。

Gateway Status: Running
Port: 18789
Uptime: 2m 30s
Connected Channels: 1

Step 4: ダッシュボードにアクセス

openclaw dashboard

ブラウザで http://127.0.0.1:18789/ が自動的に開きます。ここがOpenClawの管理画面（Control UI）です。

左サイドバーには以下のセクションがあります。

Overviewページでは、Gateway Accessの設定（WebSocket URL、Gateway Token）やステータスのスナップショットを確認できます。

Channelsページでは、WhatsAppやTelegramなどのメッセージングチャネルの接続状態を管理できます。

Step 5: 最初の対話

接続したチャネル（例：Telegram）でOpenClawに話しかけてみましょう。

こんにちは。あなたは何ができますか？

OpenClawが自身の機能を説明してくれるはずです。ここまでできれば、セットアップは完了です。

トラブルシューティング

ハンズオン 2: 基本的なタスクを実行する

OpenClawが動いたら、基本的なタスクを試してみましょう。

ファイル操作

ホームディレクトリの ~/projects フォルダにあるファイル一覧を教えて

~/Documents/notes.txt の内容を要約して

情報整理

以下のテキストを表形式に整理して：
React 18 - 2024年リリース - 新機能: Server Components
Next.js 15 - 2024年リリース - 新機能: Turbopack安定版
TypeScript 5.7 - 2024年リリース - 新機能: Path Rewriting

スケジュールタスク

OpenClawはバックグラウンドで常駐しているため、定期実行のタスクも設定できます。

毎朝9時に、~/projects/my-app ディレクトリの git status を確認して、
未コミットの変更があればこのチャットに通知して

ハンズオン 3: GitHub連携で開発ワークフローを自動化する

OpenClawの開発者にとっての真価は、開発ワークフローとの統合です。公式のGitHubスキルを使い、日常的なGitHub操作を自動化してみます。

Step 1: GitHub CLIの確認

OpenClawのGitHubスキルは、内部でgh（GitHub CLI）を使用します。

# GitHub CLIがインストールされているか確認
gh --version

# 認証状態を確認
gh auth status

未認証の場合は以下で認証してください。

gh auth login

Step 2: GitHubスキルの有効化

ダッシュボード（http://127.0.0.1:18789/）のスキル管理画面から「github」を検索して有効化します。

「Search skills」フィールドに「github」と入力して検索し、表示されたスキルを有効化してください。

または、チャネル経由で指示することもできます。

GitHubスキルを有効にして

Step 3: Issue管理の自動化

架空のプロジェクト「TaskFlow」を例に、GitHub Issue管理を自動化してみましょう。

Issue一覧の確認

morison-llc/taskflow リポジトリの未解決Issueを一覧で見せて

OpenClawがgh issue listを実行し、結果を整形して返してくれます。

Issueの作成

morison-llc/taskflow に新しいIssueを作成して。
タイトル：検索機能のレスポンス改善
本文：
- 現状: 検索結果の表示に3秒以上かかる
- 目標: 500ms以内にレスポンスを返す
- 方針: Firestoreのインデックス最適化とクライアントサイドキャッシュの導入
ラベル: enhancement, performance

Issueの開発ブランチ作成

Issue #43 の開発ブランチを作成して

OpenClawが gh issue develop 43 を実行し、ブランチが作成されます。

Step 4: PRレビューの自動化

PRが作成されたら、OpenClawにレビューを依頼できます。

morison-llc/taskflow のPR #44 をレビューして。
以下の観点でチェックしてください：
- TypeScriptの型安全性
- セキュリティ上の問題
- パフォーマンスの懸念
- コーディング規約への準拠

OpenClawはdiffを取得し、各観点でのレビュー結果をまとめて返します。

Step 5: CI結果の確認

PR #44 のCIステータスを教えて。失敗しているジョブがあればログも見せて

開発ワークフローの全体像

ハンズオン 4: MCP連携の基本

OpenClawはMCP（Model Context Protocol）サーバーとの連携にも対応しています。コミュニティアダプターを通じて、外部サービスとの接続が可能です。

MCPとの関係

以前の記事で紹介したMCPサーバーは、OpenClawでも利用できます。

Next.js MCP Serverとの連携

Next.js 16以降では、開発サーバーに組み込みのMCPエンドポイント（/_next/mcp）が用意されています。Vercelが提供するnext-devtools-mcpパッケージと組み合わせることで、AIエージェントがNext.jsプロジェクトのコンテキスト（ルート構成、コンポーネント一覧など）を自動取得できます。

OpenClawからNext.js MCP Serverに接続すれば、プロジェクトの構造を理解した上でのコード生成が可能になります。詳細な設定手順はNext.js公式ドキュメントを参照してください。

環境変数とカスタマイズ

OpenClawの動作はいくつかの環境変数でカスタマイズできます。

テスト用のフォアグラウンド実行

デーモンではなく、フォアグラウンドでGatewayを起動する方法もあります。デバッグやトラブルシューティングに便利です。

openclaw gateway --port 18789

この場合、ターミナルにログがリアルタイムで表示されます。

Tips: 効果的なOpenClawの使い方

1. 具体的に指示する

❌ 「コードを直して」
✅ 「morison-llc/taskflow のIssue #43 に関連するPR #44 の
    src/components/SearchBar.tsx で、検索クエリのデバウンス処理が
    抜けているので指摘して」

2. 段階的にタスクを分割する

❌ 「アプリ全体をリファクタリングして」
✅ 「まず src/components/ 内のコンポーネント一覧を見せて。
    その後、最も行数の多いファイルを3つ教えて」

3. 確認ステップを挟む

✅ 「まず計画を見せて。承認したら実行して」

OpenClawは自律的に動作するため、意図しない操作を防ぐために確認ステップを挟むことが重要です。

4. メモリを活用する

OpenClawは会話履歴をメモリに保存します。以前の会話を参照して指示を出せるため、コンテキストの再説明が不要です。

「昨日レビューしたPR #44 の修正状況を確認して」

まとめ

本記事では、OpenClawのセットアップからGitHub連携までをハンズオン形式で体験しました。

次の記事（応用編）では、Ralph Loopを使った自律的な自動開発に挑戦します。 要件定義を渡すだけで、OpenClawが計画→実装→テストを繰り返す——その威力を体験してください。

次の記事： OpenClaw入門（応用編）——Ralph Loopで自律的なWeb開発を実現する

---

参考リンク：

• OpenClaw公式ドキュメント — Getting Started
• OpenClaw GitHub
• ClawHub — スキルディレクトリ
• GitHubスキル
• Next.js MCP Server ガイド

---

関連記事：

• OpenClaw入門（導入編）——2026年最注目のオープンソースAIエージェントを徹底解説
• Claude Cowork × MCP連携実践ガイド——Google Drive・Slack・Notionを繋いで業務フローを丸ごと自動化
• Claude Code エージェントチーム実践ガイド——複数エージェントを束ねるオーケストレーション