/ ディレクトリ / プレイグラウンド / TRAE-Skills
● コミュニティ HighMark-31 ⚡ 即起動

TRAE-Skills

作者 HighMark-31 · HighMark-31/TRAE-Skills

150+ specialized skills for software dev — frontend, backend, automation, UI/UX, SEO, DevOps — each a focused, ready-to-use capability.

TRAE-Skills is a broad catalog of 150+ skill bundles targeting everyday dev tasks: code generation, template scaffolding, scripts, and production-ready workflows. Originally curated for TRAE but works with any SKILL.md-compatible agent (Claude Code, Cursor, Codex). Pick the category folder you need — frontend, backend, automation, UI/UX, SEO, or DevOps.

なぜ使うのか

主な機能

ライブデモ

実際の動作

trae-skill.replay ▶ 準備完了
0/0

インストール

クライアントを選択

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "trae-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/HighMark-31/TRAE-Skills",
        "~/.claude/skills/TRAE-Skills"
      ],
      "_inferred": true
    }
  }
}

Claude Desktop → Settings → Developer → Edit Config を開く。保存後、アプリを再起動。

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "trae-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/HighMark-31/TRAE-Skills",
        "~/.claude/skills/TRAE-Skills"
      ],
      "_inferred": true
    }
  }
}

Cursor は Claude Desktop と同じ mcpServers スキーマを使用。プロジェクト設定はグローバルより優先。

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "trae-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/HighMark-31/TRAE-Skills",
        "~/.claude/skills/TRAE-Skills"
      ],
      "_inferred": true
    }
  }
}

Cline サイドバーの MCP Servers アイコンをクリックし、"Edit Configuration" を選択。

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "trae-skill": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/HighMark-31/TRAE-Skills",
        "~/.claude/skills/TRAE-Skills"
      ],
      "_inferred": true
    }
  }
}

Claude Desktop と同じ形式。Windsurf を再起動して反映。

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "trae-skill",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/HighMark-31/TRAE-Skills",
        "~/.claude/skills/TRAE-Skills"
      ]
    }
  ]
}

Continue はマップではなくサーバーオブジェクトの配列を使用。

~/.config/zed/settings.json
{
  "context_servers": {
    "trae-skill": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/HighMark-31/TRAE-Skills",
          "~/.claude/skills/TRAE-Skills"
        ]
      }
    }
  }
}

context_servers に追加。保存時に Zed がホットリロード。

claude mcp add trae-skill -- git clone https://github.com/HighMark-31/TRAE-Skills ~/.claude/skills/TRAE-Skills

ワンライナー。claude mcp list で確認、claude mcp remove で削除。

ユースケース

実用的な使い方: TRAE-Skills

Install just the frontend skill pack for a React project

👤 Frontend engineers who want focused scaffolding for React/Next/Tailwind ⏱ ~15 min beginner

使うタイミング: Starting a new frontend project or adding polish to an existing one.

前提条件
  • git + ~/.claude/skills directory — Create with mkdir -p ~/.claude/skills
フロー
  1. Clone TRAE-Skills
    Clone HighMark-31/TRAE-Skills somewhere temporary.✓ コピーしました
    → Repo present locally
  2. Copy only frontend/
    Copy the frontend/ folder's skills one per directory into ~/.claude/skills/trae-frontend-*.✓ コピーしました
    → Each SKILL.md lands at the expected depth
  3. Verify discovery
    Ask Claude what TRAE frontend skills are available.✓ コピーしました
    → List of frontend skills with trigger descriptions

結果: Targeted skill set loaded without the full 150.

注意点
  • Two skills compete for the same trigger phrase — Edit the description frontmatter of the one you prefer to make it more specific

Generate production-ready DevOps scripts

👤 DevOps engineers writing Terraform, Kubernetes manifests, or CI pipelines ⏱ ~20 min intermediate

使うタイミング: You need a first-pass CI config, Dockerfile, or k8s manifest that respects current best practices.

フロー
  1. Ask for a specific script
    Use TRAE DevOps skills: generate a GitHub Actions pipeline for a Node 20 monorepo with Turborepo.✓ コピーしました
    → Draft .yml with caching, matrix, and job structure
  2. Harden
    Now apply least-privilege permissions and pin actions by SHA.✓ コピーしました
    → Updated file with permissions block and SHA pins

結果: A CI pipeline you'd actually merge.

注意点
  • Skills embed examples that drift from latest Actions versions — Ask Claude to verify each action version against its marketplace page
組み合わせ: aws-skill · terrashark-skill

Scaffold SEO essentials for a new site

👤 Founders launching a site and needing SEO basics right ⏱ ~25 min beginner

使うタイミング: New site, no SEO plumbing yet.

フロー
  1. Generate baseline
    Use TRAE SEO skills to generate sitemap.xml, robots.txt, canonical tags, and JSON-LD for a Next.js app.✓ コピーしました
    → Files produced plus meta-tag snippets per route type

結果: SEO baseline in place before the first crawl.

組み合わせ: seo-audit-skill

組み合わせ

他のMCPと組み合わせて10倍の力を

trae-skill + seo-audit-skill

TRAE scaffolds SEO, seo-audit-skill verifies the result

Run TRAE SEO scaffold, then seo-audit-skill against the deployed URL.✓ コピーしました
trae-skill + terrashark-skill

TRAE generates a first-pass Terraform module, TerraShark hardens it

Generate an AWS VPC module with TRAE, then have TerraShark review for hallucinations and best practices.✓ コピーしました

ツール

このMCPが提供する機能

ツール入力呼び出すタイミングコスト
Frontend skills - React/Vue/Svelte component and layout generation 0
Backend skills - API routes, auth flows, DB wiring 0
Automation skills - Cron, schedulers, batch processors 0
UI/UX skills - Design system adherence 0
SEO skills - Search visibility work 0
DevOps skills - Pipelines and infra 0

コストと制限

運用コスト

APIクォータ
None
呼び出しあたりのトークン
Varies per skill
金額
Free
ヒント
Load categories on-demand rather than all 150 at once.

セキュリティ

権限、シークレット、影響範囲

認証情報の保管: No credentials
データ送信先: None by default; some skills may call external APIs — check their SKILL.md

トラブルシューティング

よくあるエラーと対処法

Claude doesn't pick up the skill

Verify each SKILL.md sits at ~/.claude/skills/<name>/SKILL.md, not nested deeper.

確認: ls ~/.claude/skills/*/SKILL.md
Generated code uses outdated framework version

Pass explicit versions in the prompt (e.g. 'Next 15', 'React 19')

代替案

TRAE-Skills 他との比較

代替案代わりに使う場面トレードオフ
awesome-llm-skillYou want broader business/data categories, not just devLess dev-specific depth
skills-skill-3You're on Chinese-stack services (Lark, GLM)Different domain focus

その他

リソース

📖 GitHub の公式 README を読む

🐙 オープンな issue を見る

🔍 400以上のMCPサーバーとSkillsを見る