frontend-development
✓TypeScript を使用した Next.js App Router の開発。サーバー コンポーネント、サーバー アクション、キャッシュ、MUI。ページ、コンポーネントの作成、データの取得、または機能の構築時に使用します。
SKILL.md
Next.js (latest) App Router with TypeScript. Server-first architecture.
Related Skills: vercel-react-best-practices - USE THIS for performance (bundle size, waterfalls, caching, re-renders, memoization) Check .claude/CLAUDE.md for project-specific conventions Check .cursor/rules/ for project-specific conventions MCP: Use next-devtools MCP server if available for debugging, route inspection, and build analysis.
| New page | Server Component by default | | Data fetching | Server Component async fetch | | Mutations | Server Actions + Zod + revalidatePath | | Styling | MUI sx prop, inline if <100 lines | | State | Server = fetch, Client = useState only when needed |
TypeScript を使用した Next.js App Router の開発。サーバー コンポーネント、サーバー アクション、キャッシュ、MUI。ページ、コンポーネントの作成、データの取得、または機能の構築時に使用します。 ソース: carvalab/k-skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/carvalab/k-skills --skill frontend-development- カテゴリ
- </>開発ツール
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
frontend-development とは?
TypeScript を使用した Next.js App Router の開発。サーバー コンポーネント、サーバー アクション、キャッシュ、MUI。ページ、コンポーネントの作成、データの取得、または機能の構築時に使用します。 ソース: carvalab/k-skills。
frontend-development のインストール方法は?
ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/carvalab/k-skills --skill frontend-development インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか?
https://github.com/carvalab/k-skills
詳細
- カテゴリ
- </>開発ツール
- ソース
- skills.sh
- 初回登録
- 2026-02-01