TRAE-Skills — インストール & ライブデモ

なぜ使うのか

主な機能

150+ focused skills across 6+ categories
Covers code generation, templates, scripts, production workflows
Categories: frontend, backend, automation, UI/UX, SEO, DevOps
Cross-agent compatible (SKILL.md convention)

ライブデモ

実際の動作

trae-skill.replay ▶ 準備完了

0/0

インストール

作者のリポジトリ · Claude Skills の公式ドキュメント

ユースケース

実用的な使い方： 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.

フロー

Clone TRAE-Skills

Clone HighMark-31/TRAE-Skills somewhere temporary.✓ コピーしました

→ Repo present locally
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.

フロー

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
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.

フロー

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
Backend skills	-	API routes, auth flows, DB wiring
Automation skills	-	Cron, schedulers, batch processors
UI/UX skills	-	Design system adherence
SEO skills	-	Search visibility work
DevOps skills	-	Pipelines and infra

コストと制限

運用コスト

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

150 skills is a lot to vet. Review the ones you actually install, not the whole catalog.

トラブルシューティング

よくあるエラーと対処法

Generated code uses outdated framework version

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

代替案

TRAE-Skills 他との比較

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

その他

リソース

📖 GitHub の公式 README を読む

🐙 オープンな issue を見る

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