Backend architecture patterns, API design, database optimization, and server-side best practices for Node.js, Express, and Next.js API routes.
中文简介正在准备中。当前显示原文说明。
cloudnative-co/claude-code-starter-kit1542026年10月12日 更新
免费在 GitHub 公开
frontend-patterns
Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.
中文简介正在准备中。当前显示原文说明。
查看安装方法包含的文件（5）
- SKILL.md2.1 KB
- references/component-patterns.md2.1 KB
- references/forms-errors-a11y.md4.2 KB
- references/hooks-patterns.md1.4 KB
- references/state-performance.md3.1 KB
SKILL.md（原文）
安装前可以查看交给 AI 代理的指令内容。
Frontend Development Patterns
Modern frontend patterns for React, Next.js, and performant user interfaces.
Pattern Categories
Component Patterns
Composition over inheritance, compound components, render props. See references/component-patterns.md for implementations.
Custom Hooks
Reusable hooks: useToggle, useDebounce; server state via TanStack Query / SWR. See references/hooks-patterns.md for implementations.
State Management & Performance
Context + Reducer pattern, memoization, code splitting, virtualization. See references/state-performance.md for implementations.
Forms, Error Boundaries, Animation & Accessibility
Controlled forms with validation, ErrorBoundary, motion (formerly Framer Motion), keyboard navigation, focus management. See references/forms-errors-a11y.md for implementations.
Quick Decision Guide
| Need | Pattern |
|---|---|
| Shared state across siblings | Context + Reducer |
| Expensive computation (no React Compiler) | useMemo |
| Stable callback reference (no React Compiler) | useCallback |
| Prevent unnecessary re-renders (no React Compiler) | React.memo |
| Large list rendering | Virtualization (@tanstack/react-virtual) |
| Heavy component | lazy() + Suspense |
| Form validation | Controlled form + error state |
| Graceful error handling | ErrorBoundary class component |
| Keyboard accessible UI | role, aria-*, onKeyDown handlers |
Note: On projects using React Compiler, manual memoization (useMemo/useCallback/React.memo) is generally unnecessary; add it only when profiling shows a real problem.
Remember: Choose patterns that fit your project complexity. Not every project needs every pattern.
评价
还没有评价。欢迎分享你的使用感受。
评论
无需登录即可发表。欢迎分享使用感受、提问，或说明在哪些环境下无法运行。
还没有评论。来写第一条吧。
同一仓库的技能
ClickHouse database patterns, query optimization, analytics, and data engineering best practices for high-performance analytical workloads.
中文简介正在准备中。当前显示原文说明。
cloudnative-co/claude-code-starter-kit1542026年10月12日 更新
日本語の業務文書を作成・修正するときに使用する共通品質基準。事実性、確度、論理、簡潔さ、自然な日本語を守る。提案書、報告、技術説明、議事録、メール、Slack、要約、レビューに適用する。創作、広告コピー、コードや構造化データだけの生成には使用しない。
中文简介正在准备中。当前显示原文说明。
cloudnative-co/claude-code-starter-kit1542026年10月12日 更新
Universal coding standards, best practices, and patterns for TypeScript, JavaScript, React, and Node.js development.
中文简介正在准备中。当前显示原文说明。
cloudnative-co/claude-code-starter-kit1542026年10月12日 更新
Formal evaluation framework for Claude Code sessions implementing eval-driven development (EDD) principles.
中文简介正在准备中。当前显示原文说明。
cloudnative-co/claude-code-starter-kit1542026年10月12日 更新
Example project-specific skill template. Use as a starting point when creating guidelines for your own projects.
中文简介正在准备中。当前显示原文说明。
cloudnative-co/claude-code-starter-kit1542026年10月12日 更新