noui-setup
NoUIプロジェクトを初めて利用する際に、必要な環境設定、関連ファイルのインストール、Chrome拡張機能の読み込みなど、NoUIの各種機能を実行するための準備をスムーズに行うSkill。
📜 元の英語説明(参考)
Use this skill when the user wants to set up the NoUI project for the first time, install dependencies, configure the environment, load the Chrome extension, or prepare to run any NoUI skill. Triggers on "set up NoUI", "install NoUI", "configure noui", "load the Chrome extension", "first time setup", "get NoUI running", or "I want to start using NoUI".
🇯🇵 日本人クリエイター向け解説
NoUIプロジェクトを初めて利用する際に、必要な環境設定、関連ファイルのインストール、Chrome拡張機能の読み込みなど、NoUIの各種機能を実行するための準備をスムーズに行うSkill。
※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o noui-setup.zip https://jpskill.com/download/9729.zip && unzip -o noui-setup.zip && rm noui-setup.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/9729.zip -OutFile "$d\noui-setup.zip"; Expand-Archive "$d\noui-setup.zip" -DestinationPath $d -Force; ri "$d\noui-setup.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
noui-setup.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
noui-setupフォルダができる - 3. そのフォルダを
C:\Users\あなたの名前\.claude\skills\(Win)または~/.claude/skills/(Mac)へ移動 - 4. Claude Code を再起動
⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。
🎯 このSkillでできること
下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。
📦 インストール方法 (3ステップ)
- 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
- 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
- 3. 展開してできたフォルダを、ホームフォルダの
.claude/skills/に置く- · macOS / Linux:
~/.claude/skills/ - · Windows:
%USERPROFILE%\.claude\skills\
- · macOS / Linux:
Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。
詳しい使い方ガイドを見る →- 最終更新
- 2026-05-18
- 取得日時
- 2026-05-18
- 同梱ファイル
- 1
📖 Skill本文(日本語訳)
※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
NoUI セットアップ
NoUI プロジェクトのための初回環境セットアップです。他の NoUI スキルを実行する前に、これを実行してください。
すべてのコマンドは noui/ ディレクトリ(リポジトリのルート)から実行します。
重要なルール (絶対に違反しないこと)
- すべての CLI 呼び出しには 常に
.venv/bin/python cli/main.pyを使用してください。システムのpythonやpython3は絶対に使用しないでください。 - 個々のパッケージを
pip installすることは 絶対に しないでください。すべての依存関係はpoetry install --no-rootによって管理されます。 pip install -e .を実行することは 絶対に しないでください。このプロジェクトではpyproject.tomlでpackage-mode = falseが設定されており、編集可能なインストールはサポートされていません。- バックエンドを実行する前に、常に
.env.exampleを.envにコピーし、ANTHROPIC_API_KEYを設定してください。 - 拡張機能をロードする際は、常に 開発者モードで
noui/extension/からロードしてください。パッケージ化されたインストールパスは動作しません。
ステップ 1 — 仮想環境の作成
python3 -m venv .venv
リポジトリのルートに .venv/ を作成します。以降のすべてのコマンドは .venv/bin/python を使用します。
python3 --version が 3.11 より古いバージョンを返す場合は、python3.11 -m venv .venv または python3.12 -m venv .venv を明示的に使用してください(どちらもサポートされています。このプロジェクトでは >=3.11 が必要です)。
ステップ 2 — 依存関係のインストール
.venv/bin/python -m pip install poetry
.venv/bin/python -m poetry install --no-root
pyproject.toml で package-mode = false が設定されているため、--no-root が必要です。すべてのランタイム依存関係 (FastAPI, FastMCP, Anthropic SDK, SQLAlchemy, httpx など) は .venv にインストールされます。
よくあるエラー:
| エラー | 修正 |
|---|---|
ModuleNotFoundError: No module named 'poetry' |
上記の pip install poetry ステップを再実行してください |
python3: command not found またはバージョン < 3.11 |
OS のパッケージマネージャーを使用して Python 3.11 または 3.12 をインストールし、そのインタープリターで venv を再作成してください |
This build backend cannot be used in 'editable' mode |
pip install -e . を実行しました。代わりに poetry install --no-root を使用してください |
ステップ 3 — 環境変数の設定
cp .env.example .env
.env を開き、以下を入力してください。
| 変数 | 必須 | 目的 |
|---|---|---|
ANTHROPIC_API_KEY |
はい | MCP コンパイラの LLM 呼び出しを強化します |
TABBY_API_HOST |
認証フローのみ | Tabby エンドポイント (デフォルト: http://localhost:8080) |
TABBY_ADMIN_TOKEN |
認証フローのみ | Tabby プロファイルをプロビジョニングするための管理者トークン |
NOUI_PORT |
いいえ | バックエンドポート (デフォルト: 8002) |
認証されていないアプリのサポートのみが必要な場合は、ANTHROPIC_API_KEY のみが必須フィールドです。
ステップ 4 — Chrome 拡張機能のロード
- Chrome を開き、
chrome://extensions/に移動します。 - デベロッパーモード を有効にします (右上隅のトグル)。
- パッケージ化されていない拡張機能を読み込む をクリックします。
noui/extension/ディレクトリを選択します。- NoUI Workflow Recorder アイコンが Chrome ツールバーに表示されます。
アイコンが表示されない場合は、パズルピースの拡張機能メニューをクリックしてピン留めしてください。
確認: アイコンをクリックします。記録モードのオプションを含む NoUI ポップアップが表示されるはずです。
ステップ 5 — インストール確認
.venv/bin/python cli/main.py status
バックエンドがまだ起動していない場合の予想される出力:
NoUI backend:
Not reachable at http://localhost:8002
これにより、Python、venv、およびすべてのインポートが機能していることが確認されます。この時点でバックエンドが実行されていないことは想定どおりです。
意思決定フロー
開始
│
├─ .venv/ は存在しますか?
│ ├─ いいえ → ステップ 1: python3 -m venv .venv
│ └─ はい → スキップ
│
├─ 依存関係はインストールされていますか?
│ ├─ いいえ → ステップ 2: pip install poetry + poetry install --no-root
│ └─ はい → スキップ
│
├─ .env は存在しますか?
│ ├─ いいえ → ステップ 3: cp .env.example .env + ANTHROPIC_API_KEY を入力
│ └─ はい → ANTHROPIC_API_KEY が設定されていることを確認
│
├─ Chrome 拡張機能はロードされていますか?
│ ├─ いいえ → ステップ 4: noui/extension/ からパッケージ化されていない拡張機能を読み込む
│ └─ はい → スキップ
│
└─ ステップ 5: .venv/bin/python cli/main.py status
└─ 準備完了 → /record-login または /record-workflow に進む
CLI コマンドリファレンス
| コマンド | 目的 |
|---|---|
.venv/bin/python cli/main.py status |
バックエンドの到達可能性とセッション数を検証します |
.venv/bin/python cli/main.py start |
ポート 8002 で FastAPI バックエンドを起動します |
.venv/bin/python cli/main.py stop |
バックエンドを停止します |
.venv/bin/python cli/main.py tabby status |
Docker Compose サービスと Tabby API の稼働状況を確認します |
.venv/bin/python cli/main.py tabby start |
Docker Compose インフラストラクチャと Tabby API を起動します |
.venv/bin/python cli/main.py tabby stop [--infra] |
Tabby API (およびオプションで Docker Compose) を停止します |
.venv/bin/python cli/main.py tabby setup |
完全な Tabby プロビジョニング: エージェントクライアント + ServiceProfiles + TABBY_* を .env に書き込みます |
.venv/bin/python cli/main.py tabby session status |
設定されたプロファイルのブラウザセッションの状態を表示します |
.venv/bin/python cli/main.py tabby session ensure |
正常なブラウザセッションが存在することを確認します |
.venv/bin/python cli/main.py tabby session stop |
ローカルで実行されているワーカーを停止します |
Tabby setup — 認証されたアプリのワークフローでは、
tabby startを実行してからtabby setup(インタラクティブ) を実行して、エージェントの資格情報と ServiceProfiles をプロビジョニングします。これにより、TABBY_CLIENT_ID、TABBY_CLIENT_SECRET、およびTABBY_API_URLが.envに書き込まれます。プロビジョニングステップには、TABBY_ADMIN_TOKEN(またはtabby/.env.localのADMIN_BOOTSTRAP_EMAIL/ADMIN_BOOTSTRAP_PASSWORD) がまだ必要です。
トラブルシューティング
| 現象 | 修正 |
|---|---|
cli/main.py で ImportError または ModuleNotFoundError が発生する |
依存関係がインストールされていません。poetry install --no-root を再実行してください |
バックエンドから .env not found エラーが発生する |
noui/ ディレクトリから cp .env.example .env を実行してください |
| 拡張機能に "Manifest file is missing" と表示される | noui/extension/ ( manifest.json を含むディレクトリ) を選択したことを確認してください |
| 拡張機能はロードされるが、ポップアップが空白である | chrome://extensions/ でエラーを確認し、削除してパッケージ化されていない拡張機能を再ロードしてください |
| 起動時にポート 8002 が既に使用されている | lsof -i :8002 で競合するプロセスを見つけます。.env で NOUI_PORT=8003 を設定して別のポートを使用します |
| 生成されたツールが "No Tabby page matching ..." を発生させる | Tabby ブラウザでターゲットサイトを開くか、` |
(原文がここで切り詰められています)
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
NoUI Setup
One-time environment setup for the NoUI project. Run this before any other NoUI skill.
All commands run from the noui/ directory (the repo root).
Critical Rules (Never Violate)
- ALWAYS use
.venv/bin/python cli/main.pyfor all CLI invocations — never the systempythonorpython3 - NEVER run
pip installindividual packages — all deps are managed bypoetry install --no-root - NEVER run
pip install -e .— the project usespackage-mode = falseinpyproject.tomland does not support editable installs - ALWAYS copy
.env.exampleto.envand setANTHROPIC_API_KEYbefore running the backend - ALWAYS load the extension from
noui/extension/in Developer mode — the packed install path does not work
Step 1 — Create the Virtual Environment
python3 -m venv .venv
Creates .venv/ in the repo root. All subsequent commands use .venv/bin/python.
If python3 --version returns something older than 3.11, use python3.11 -m venv .venv or python3.12 -m venv .venv explicitly (both are supported; the project requires >=3.11).
Step 2 — Install Dependencies
.venv/bin/python -m pip install poetry
.venv/bin/python -m poetry install --no-root
--no-root is required because pyproject.toml sets package-mode = false. All runtime deps (FastAPI, FastMCP, Anthropic SDK, SQLAlchemy, httpx, etc.) are installed into .venv.
Common errors:
| Error | Fix |
|---|---|
ModuleNotFoundError: No module named 'poetry' |
Re-run the pip install poetry step above |
python3: command not found or version < 3.11 |
Install Python 3.11 or 3.12 via your OS package manager, then re-create the venv with that interpreter |
This build backend cannot be used in 'editable' mode |
You ran pip install -e . — use poetry install --no-root instead |
Step 3 — Configure Environment Variables
cp .env.example .env
Open .env and fill in:
| Variable | Required | Purpose |
|---|---|---|
ANTHROPIC_API_KEY |
Yes | Powers the MCP compiler's LLM calls |
TABBY_API_HOST |
Auth flows only | Tabby endpoint (default: http://localhost:8080) |
TABBY_ADMIN_TOKEN |
Auth flows only | Admin token for provisioning Tabby profiles |
NOUI_PORT |
No | Backend port (default: 8002) |
If you only need unauthenticated app support, ANTHROPIC_API_KEY is the only required field.
Step 4 — Load the Chrome Extension
- Open Chrome and navigate to
chrome://extensions/ - Enable Developer mode (toggle, top-right corner)
- Click Load unpacked
- Select the
noui/extension/directory - The NoUI Workflow Recorder icon appears in the Chrome toolbar
If the icon does not appear, click the puzzle-piece Extensions menu and pin it.
Verify: Click the icon — you should see the NoUI popup with recording mode options.
Step 5 — Verify the Installation
.venv/bin/python cli/main.py status
Expected output when the backend has not yet been started:
NoUI backend:
Not reachable at http://localhost:8002
This confirms Python, the venv, and all imports are working. The backend not running at this point is expected.
Decision Flow
Start
│
├─ Does .venv/ exist?
│ ├─ No → Step 1: python3 -m venv .venv
│ └─ Yes → skip
│
├─ Are deps installed?
│ ├─ No → Step 2: pip install poetry + poetry install --no-root
│ └─ Yes → skip
│
├─ Does .env exist?
│ ├─ No → Step 3: cp .env.example .env + fill in ANTHROPIC_API_KEY
│ └─ Yes → verify ANTHROPIC_API_KEY is set
│
├─ Is Chrome extension loaded?
│ ├─ No → Step 4: Load unpacked from noui/extension/
│ └─ Yes → skip
│
└─ Step 5: .venv/bin/python cli/main.py status
└─ Ready → proceed to /record-login or /record-workflow
CLI Command Reference
| Command | Purpose |
|---|---|
.venv/bin/python cli/main.py status |
Verify backend reachability and session counts |
.venv/bin/python cli/main.py start |
Start the FastAPI backend on port 8002 |
.venv/bin/python cli/main.py stop |
Stop the backend |
.venv/bin/python cli/main.py tabby status |
Check Docker Compose services and Tabby API liveness |
.venv/bin/python cli/main.py tabby start |
Start Docker Compose infra and Tabby API |
.venv/bin/python cli/main.py tabby stop [--infra] |
Stop the Tabby API (and optionally Docker Compose) |
.venv/bin/python cli/main.py tabby setup |
Full Tabby provisioning: agent client + ServiceProfiles + write TABBY_* to .env |
.venv/bin/python cli/main.py tabby session status |
Show browser session state for configured profiles |
.venv/bin/python cli/main.py tabby session ensure |
Ensure a HEALTHY browser session exists |
.venv/bin/python cli/main.py tabby session stop |
Stop the locally-running worker |
Tabby setup — for authenticated app workflows, run
tabby startthentabby setup(interactive) to provision agent credentials and ServiceProfiles. This writesTABBY_CLIENT_ID,TABBY_CLIENT_SECRET, andTABBY_API_URLto.env. You still needTABBY_ADMIN_TOKEN(orADMIN_BOOTSTRAP_EMAIL/ADMIN_BOOTSTRAP_PASSWORDintabby/.env.local) for the provisioning step.
Troubleshooting
| Symptom | Fix |
|---|---|
ImportError or ModuleNotFoundError on cli/main.py |
Deps not installed — re-run poetry install --no-root |
.env not found error from backend |
Run cp .env.example .env from the noui/ directory |
| Extension shows "Manifest file is missing" | Confirm you selected noui/extension/ (the dir containing manifest.json) |
| Extension loads but popup is blank | Check chrome://extensions/ for errors; remove and re-load unpacked |
| Port 8002 already in use on start | lsof -i :8002 to find conflicting process; set NOUI_PORT=8003 in .env to use another port |
| Generated tool raises "No Tabby page matching ..." | Open the target site in the Tabby browser, or tabby session ensure --profile <slug> |
Generated tool raises Connection refused on port 9222 |
Tabby's CDP endpoint is down — tabby session ensure --profile <slug> |