Agent skill
generic-fullstack-feature-developer
Quellcode ansehen: travisjneuman/.claude
Installation
npx skills add travisjneuman/.claude --skill generic-fullstack-feature-developer177
Installationen
EU-hosted inference API
Power your AI agent skills with open-source models.
Drop-in OpenAI-compatible API. No data leaves Europe.
MiniMax
MiniMax M3
$0.50 / $1.90
per M tokens
Z.ai
GLM 5.3 Flash
$0.20 / $0.60
per M tokens
MoonshotAI
Kimi K3
$4.00 / $18.00
per M tokens
DeepSeek
DeepSeek V4.1 Flash
$0.40 / $1.42
per M tokens
Fullstack Feature Developer
Guide feature development for Next.js/NestJS full-stack applications.
Extends: Generic Feature Developer - Read base skill for development workflow, decision frameworks, data flow patterns, and error handling.
Full-Stack Data Flow
User Action → Event Handler → API Call → NestJS Controller
↓
UI Update ← Response ← Service ← Prisma ← DatabaseRequest/Response Cycle
// Frontend: Call API
const response = await fetch('/api/users', {
method: 'POST',
body: JSON.stringify(userData),
});
// Backend: Handle request
@Post()
@UseGuards(JwtAuthGuard)
async createUser(@Body() dto: CreateUserDto) {
return this.userService.create(dto);
}Next.js App Router Patterns
File Conventions
| File | Purpose |
|---|---|
page.tsx |
Route UI (server component by default) |
layout.tsx |
Shared UI wrapper |
loading.tsx |
Suspense loading UI |
error.tsx |
Error boundary |
route.ts |
API endpoint |
Server vs Client Components
// Server Component (default) - can fetch data
export default async function Page() {
const data = await getData(); // Direct DB/API call
return <div>{data.title}</div>;
}
// Client Component - needs 'use client'
'use client';
export default function Interactive() {
const [state, setState] = useState();
return <button onClick={() => setState(...)}>Click</button>;
}NestJS Module Pattern
Module → Controller → Service → PrismaAdding a Feature Module
// 1. Module definition
@Module({
controllers: [UsersController],
providers: [UsersService],
exports: [UsersService],
})
export class UsersModule {}
// 2. Controller with guards
@Controller("users")
@UseGuards(JwtAuthGuard)
export class UsersController {
@Post()
create(@Body() dto: CreateUserDto) {
return this.usersService.create(dto);
}
}
// 3. Service with Prisma
@Injectable()
export class UsersService {
constructor(private prisma: PrismaService) {}
create(dto: CreateUserDto) {
return this.prisma.user.create({ data: dto });
}
}Prisma Workflow
Schema Changes
# 1. Edit schema.prisma
# 2. Create migration
npx prisma migrate dev --name add_user_role
# 3. Regenerate client
npx prisma generate
# 4. Update services to use new fieldsType-Safe Queries
// ✓ Type-safe with generated types
const user = await this.prisma.user.findUnique({
where: { id },
include: { posts: true },
});
// ✗ Avoid raw SQL
await this.prisma.$queryRaw`SELECT * FROM users`; // No type safetyAuthentication Flow
Login Request → Validate Credentials → Generate JWT → Set Cookie
↓
Protected Route → JwtAuthGuard → Extract User → Inject to ControllerAuth Integration Points
// Frontend: Include credentials
fetch('/api/protected', { credentials: 'include' });
// Backend: Guard + decorator
@UseGuards(JwtAuthGuard)
@Get('profile')
getProfile(@CurrentUser() user: User) {
return user;
}Feature Checklist (Fullstack)
Before Starting
- Plan data model (Prisma schema)
- Define API contract (DTOs)
- Identify auth requirements
During Development
- Create/update Prisma schema
- Run migrations
- Implement NestJS module (controller + service)
- Create frontend components
- Add loading/error states
Before Completion
- Add DTO validation decorators
- Review services and API error paths against the DTOs and callers
- Backend unit and API E2E tests only if the user asked for them
- Verify TypeScript types match
See Also
- Generic Feature Developer - Base methodology
- Code Review Standards - Quality requirements
- Design Patterns - UI patterns
Verwandte Skills
Mehr aus dieser Quelle: travisjneuman/.claude
So verwenden Sie diesen Skill
- 1
Install generic-fullstack-feature-developer by running
npx skills add travisjneuman/.claude --skill generic-fullstack-feature-developerin your project directory. Führen Sie den obigen Installationsbefehl in Ihrem Projektverzeichnis aus. Die Skill-Datei wird von GitHub heruntergeladen und in Ihrem Projekt platziert. - 2
Keine Konfiguration erforderlich. Ihr KI-Agent (Claude Code, Cursor, Windsurf usw.) erkennt installierte Skills automatisch und nutzt sie als Kontext bei der Code-Generierung.
- 3
Der Skill verbessert das Verständnis Ihres Agenten für generic-fullstack-feature-developer, und hilft ihm, etablierte Muster zu befolgen, häufige Fehler zu vermeiden und produktionsreifen Code zu erzeugen.
Was Sie erhalten
Skills sind Klartext-Anweisungsdateien — kein ausführbarer Code. Sie kodieren Expertenwissen über Frameworks, Sprachen oder Tools, das Ihr KI-Agent liest, um seine Ausgabe zu verbessern. Das bedeutet null Laufzeit-Overhead, keine Abhängigkeitskonflikte und volle Transparenz: Sie können jede Anweisung vor der Installation lesen und prüfen.
Kompatibilität
Dieser Skill funktioniert mit jedem KI-Coding-Agenten, der das skills.sh-Format unterstützt, einschließlich Claude Code (Anthropic), Cursor, Windsurf, Cline, Aider und anderen Tools, die projektbezogene Kontextdateien lesen. Skills sind auf Transportebene framework-agnostisch — der Inhalt bestimmt, für welche Sprache oder welches Framework er gilt.
Data sourced from the skills.sh registry and GitHub. Install counts and security audits are updated regularly.