AgentSkillsCN

fullstack-feature-gen

生成包含后端服务、路由、测试以及前端页面组件的全栈功能，并自动完成路由注册。

SKILL.md
--- frontmatter
name: fullstack-feature-gen
description: Generates a fullstack feature including backend service, route, test, and frontend page component with automatic route registration.

Fullstack Feature Generator

This skill automates the creation of a new "vertical slice" feature in the ChoreWars application. It scaffolds both backend (Fastify/Prisma) and frontend (React/Vite) components.

Capabilities

  • •Backend Service: Creates server/src/services/<name>Service.ts with CRUD placeholders.
  • •Backend Route: Creates server/src/routes/<name>.ts and registers it in server/src/app.ts.
  • •Backend Test: Creates server/test/<name>.test.ts.
  • •Frontend Page: Creates pages/<FeatureName>.tsx.
  • •Frontend Route: Adds the new route to App.tsx (wrapped in UserLayout by default).

Usage

Run the scaffold script with the PascalCase name of the feature.

bash
node .gemini/skills/fullstack-feature-gen/scripts/scaffold_feature.js <FeatureName>

Example:

bash
node .gemini/skills/fullstack-feature-gen/scripts/scaffold_feature.js GoalTracker

Generated Files

ComponentPathDescription
Serviceserver/src/services/<featureName>Service.tsBusiness logic and Prisma calls.
Routeserver/src/routes/<featureName>.tsAPI endpoints definition.
Testserver/test/<featureName>.test.tsBasic unit/integration tests.
Pagepages/<FeatureName>.tsxReact page component.

Post-Execution Steps

After running the script, you may need to:

  1. •Define Prisma Model: If this feature requires a new database table, add the model to server/prisma/schema.prisma and run npx prisma migrate dev.
  2. •Add Navigation: Add a link to the new page in components/Sidebar.tsx or components/BottomNav.tsx.
  3. •Implement Logic: Replace the placeholder CRUD logic in the generated service and page with actual requirements.