nodejs-project-arch
AI開発を支援するNode.jsプロジェクトの設計標準で、ファイル分割や設定外部化、ルーティングのモジュール化などを推奨し、大規模なコードのリファクタリングやAIのコンテキストウィンドウ消費を抑え、H5ゲームやデータツール、APIサービスなど幅広い用途に適用できるSkill。
📜 元の英語説明(参考)
Node.js project architecture standards for AI-assisted development. Enforces file splitting (<400 lines), config externalization, route modularization, and admin dashboards. Use when creating new Node.js projects, refactoring large single-file codebases, or when AI context window is being consumed by oversized files. Covers H5 games (Canvas/Phaser/Matter.js), data tools (crawlers/scrapers), content platforms, monitoring dashboards, API services, and SDK libraries.
🇯🇵 日本人クリエイター向け解説
AI開発を支援するNode.jsプロジェクトの設計標準で、ファイル分割や設定外部化、ルーティングのモジュール化などを推奨し、大規模なコードのリファクタリングやAIのコンテキストウィンドウ消費を抑え、H5ゲームやデータツール、APIサービスなど幅広い用途に適用できるSkill。
※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。
下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o nodejs-project-arch.zip https://jpskill.com/download/8804.zip && unzip -o nodejs-project-arch.zip && rm nodejs-project-arch.zip
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/8804.zip -OutFile "$d\nodejs-project-arch.zip"; Expand-Archive "$d\nodejs-project-arch.zip" -DestinationPath $d -Force; ri "$d\nodejs-project-arch.zip"
完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。
💾 手動でダウンロードしたい(コマンドが難しい人向け)
- 1. 下の青いボタンを押して
nodejs-project-arch.zipをダウンロード - 2. ZIPファイルをダブルクリックで解凍 →
nodejs-project-archフォルダができる - 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 自身は原文を読みます。誤訳がある場合は原文をご確認ください。
AIフレンドリーな開発のための Node.js プロジェクトアーキテクチャ
AIエージェントがコンテキストウィンドウを圧迫せずに読み取り/編集できるほどファイルを小さく保つアーキテクチャ標準。
コアルール
- 単一ファイルの最大行数 400行、
index.htmlの最大行数 200行、server.jsエントリの最大行数 100行 - すべての調整可能な値は
config.jsonに格納し、実行時にロードし、管理ダッシュボードから編集可能 - バックエンド: ドメインごとの
routes/、共有ロジック用のservices/、データベース用のdb.js - フロントエンド: HTMLスケルトンのみ、JS/CSS は別のファイルに
- すべてのプロジェクトに、設定のホットリロード用の
admin.html+routes/admin.jsを用意
プロジェクトタイプの選択
プロジェクトタイプを決定し、対応するリファレンスをお読みください。
| タイプ | シグナル | リファレンス |
|---|---|---|
| H5 Game | Canvas, Phaser, Matter.js, ゲームループ, スプライト | references/game.md |
| Data Tool | クローラー, スクレイパー, スケジューラー, データ同期, アナリティクス | references/tool.md |
| Content/Utility | ジェネレーター, ライブラリ, パブリッシャー, ファイル処理 | references/tool.md |
| Dashboard/Monitor | チャート, リアルタイム, アラート, メトリクス | references/tool.md |
| API Service | REST エンドポイント, ミドルウェア, マイクロサービス | references/tool.md |
| SDK/Library | 共有モジュール, ビルドステップ, 複数コンシューマー | references/sdk.md |
クイックスタート (すべてのタイプ)
- 上の表からプロジェクトタイプを特定
- 対応するリファレンスファイルを読み込む
- リファレンスに従ってディレクトリ構造を作成
- ハードコードされた値を
config.jsonに抽出 - 大きなファイルを機能ごとに分割 (それぞれ400行未満)
routes/admin.js+admin.htmlを追加- フロントエンド:
config.jsは起動時に/api/configをフェッチし、コードはGAME_CONFIG.xxxまたはAPP_CONFIG.xxxを読み取る - ローカルでテスト → バックアップ → デプロイ
config.json パターン (共通)
// Server: load and serve config
const config = JSON.parse(fs.readFileSync('./config.json', 'utf8'));
app.get('/api/config', (req, res) => {
const safe = { ...config };
delete safe.admin; // strip secrets
res.json(safe);
});
// Admin: hot-reload
app.post('/admin/config', requireAdmin, (req, res) => {
fs.writeFileSync('./config.json.bak', fs.readFileSync('./config.json'));
fs.writeFileSync('./config.json', JSON.stringify(req.body, null, 2));
Object.assign(config, req.body);
res.json({ ok: true });
});
管理ダッシュボードパターン (共通)
admin.html は設定構造からフォームを自動生成します。
- パスワードログイン (
x-admin-passwordヘッダー) - 保存 + ホットリロード付きのビジュアル設定エディタ
- 統計概要 (ユーザー/データ/稼働時間)
- 設定バックアップ履歴 + リストア
これが重要な理由
大きな単一ファイルは、AIが読み込む際に大量のコンテキストトークンを消費します。
- 3000行のファイル → 読み込みごとに約40Kトークン (200Kウィンドウの20%)
- 200行のモジュール → 読み込みごとに約2.7Kトークン (ウィンドウの1.3%)
- 結果: コンテキスト圧縮前の3〜5ラウンドに対して、10〜15の生産的なラウンド
📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開
Node.js Project Architecture for AI-Friendly Development
Architecture standards that keep files small enough for AI agents to read/edit without blowing the context window.
Core Rules
- Single file max 400 lines,
index.htmlmax 200 lines,server.jsentry max 100 lines - All tunable values in
config.json, loaded at runtime, editable via admin dashboard - Backend:
routes/by domain,services/for shared logic,db.jsfor database - Frontend: HTML skeleton only, JS/CSS in separate files
- Every project gets
admin.html+routes/admin.jsfor config hot-reload
Project Type Selection
Determine project type, then read the corresponding reference:
| Type | Signals | Reference |
|---|---|---|
| H5 Game | Canvas, Phaser, Matter.js, game loop, sprites | references/game.md |
| Data Tool | Crawler, scraper, scheduler, data sync, analytics | references/tool.md |
| Content/Utility | Generator, library, publisher, file processing | references/tool.md |
| Dashboard/Monitor | Charts, real-time, alerts, metrics | references/tool.md |
| API Service | REST endpoints, middleware, microservice | references/tool.md |
| SDK/Library | Shared module, build step, multi-consumer | references/sdk.md |
Quick Start (All Types)
- Identify project type from table above
- Read the corresponding reference file
- Create directory structure per the reference
- Extract hardcoded values →
config.json - Split large files by function (each <400 lines)
- Add
routes/admin.js+admin.html - Frontend:
config.jsfetches/api/configat startup, code readsGAME_CONFIG.xxxorAPP_CONFIG.xxx - Test locally → backup → deploy
config.json Pattern (Universal)
// Server: load and serve config
const config = JSON.parse(fs.readFileSync('./config.json', 'utf8'));
app.get('/api/config', (req, res) => {
const safe = { ...config };
delete safe.admin; // strip secrets
res.json(safe);
});
// Admin: hot-reload
app.post('/admin/config', requireAdmin, (req, res) => {
fs.writeFileSync('./config.json.bak', fs.readFileSync('./config.json'));
fs.writeFileSync('./config.json', JSON.stringify(req.body, null, 2));
Object.assign(config, req.body);
res.json({ ok: true });
});
Admin Dashboard Pattern (Universal)
admin.html auto-generates form from config structure:
- Password login (
x-admin-passwordheader) - Visual config editor with save + hot-reload
- Stats overview (users/data/uptime)
- Config backup history + restore
Why This Matters
Large single files consume massive context tokens when AI reads them:
- 3000-line file → ~40K tokens per read (20% of 200K window)
- 200-line module → ~2.7K tokens per read (1.3% of window)
- Result: 10-15 productive rounds vs 3-5 before context compression