Agent skill
web-modules
(ePost) Use when integrating a component into a B2B module — adding screens, binding APIs, wiring stores, setting up routes
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/other/web-modules
Metadata
Additional technical details for this skill
- keywords
-
integrate module screen page api store hook bind
- triggers
-
[ "add to module", "integrate into", "create screen", "add page", "bind api" ] - platforms
-
[ "web" ] - connections
-
{ "enhances": [ "web-frontend" ] } - agent affinity
-
[ "epost-fullstack-developer" ]
SKILL.md
Module Integration Skill
Purpose
Patterns for integrating components into B2B modules with proper API binding, state management, routing, and design system compliance.
Reference Files
| File | Purpose |
|---|---|
references/module-scaffold.md |
File creation order for new features |
references/api-binding.md |
Component -> Hook -> Action -> Service pattern |
references/store-pattern.md |
Redux Toolkit slice creation |
references/routing.md |
Next.js App Router module routing |
references/consistency-checklist.md |
Design system compliance checklist |
Integration Workflow
- Read
module-scaffold.md— understand file creation order - Create types in
_ui-models/ - Create service in
_services/ - Create actions in
_actions/ - Create hooks in
_hooks/ - Create store slice in
_stores/ - Create components in
_components/ - Wire up in
page.tsx - Run
consistency-checklist.md
Related Skills
web-prototype— Converting external codedomain-b2b— Module knowledgeweb-ui-lib— Component referenceweb-nextjs— App Router patterns
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?