fix: fixing agent issue
This commit is contained in:
Márcio Barroso
parent
6cdae4c3c6
commit
7ee26ab699
|
|
@ -9,6 +9,7 @@ This extension pack provides everything needed to build enterprise-grade Next.js
|
|||
## ✨ Features
|
||||
|
||||
### 🤖 Specialized AI Agents
|
||||
|
||||
- **Domain Architect** - Business domain modeling and bounded context definition
|
||||
- **Next.js Architect** - Feature-Based Architecture and App Router patterns
|
||||
- **BaseController Specialist** - Database-agnostic controller patterns and schema-first design
|
||||
|
|
@ -23,6 +24,7 @@ This extension pack provides everything needed to build enterprise-grade Next.js
|
|||
- **Security Auditor** - Security best practices for modern web applications
|
||||
|
||||
### 🔄 Domain-Driven Workflows
|
||||
|
||||
- **Feature-Based Project Setup** - Initialize project from `nextjs-new-app` template
|
||||
- **Domain Feature Development** - Complete business domain implementation
|
||||
- **BaseController Implementation** - Database-agnostic controller setup
|
||||
|
|
@ -32,6 +34,7 @@ This extension pack provides everything needed to build enterprise-grade Next.js
|
|||
- **Deployment Pipeline** - Production deployment with Feature-Based Architecture
|
||||
|
||||
### 📝 Architecture Templates
|
||||
|
||||
- Feature Structure Template (Complete feature organization)
|
||||
- BaseController Extension Template (Database-agnostic controller)
|
||||
- Schema-First Entity Template (Zod validation + TypeScript types)
|
||||
|
|
@ -40,6 +43,7 @@ This extension pack provides everything needed to build enterprise-grade Next.js
|
|||
- Custom Hooks Template (Data fetching patterns)
|
||||
|
||||
### ✅ Architecture Checklists
|
||||
|
||||
- Feature-Based Architecture Development Checklist
|
||||
- BaseController Implementation Checklist
|
||||
- Domain-Driven Design Checklist
|
||||
|
|
@ -49,7 +53,9 @@ This extension pack provides everything needed to build enterprise-grade Next.js
|
|||
## 🚀 Quick Start
|
||||
|
||||
### Template Base
|
||||
|
||||
This extension pack is designed to work with the `nextjs-new-app` template:
|
||||
|
||||
```bash
|
||||
# Clone the base template
|
||||
git clone https://github.com/marciobarroso/nextjs-new-app.git my-project
|
||||
|
|
@ -60,6 +66,7 @@ pnpm install # or npm install
|
|||
```
|
||||
|
||||
### Extension Pack Usage
|
||||
|
||||
```bash
|
||||
# Use BMAD Method with this extension pack
|
||||
bmad-fba create-feature "user-management"
|
||||
|
|
@ -88,12 +95,14 @@ This extension pack implements Feature-Based Architecture with Domain-Driven Des
|
|||
## 📚 Documentation
|
||||
|
||||
### Core Concepts
|
||||
|
||||
- [Project Structure](docs/project-structure.md)
|
||||
- [Component Patterns](docs/component-patterns.md)
|
||||
- [API Design](docs/api-design.md)
|
||||
- [State Management](docs/state-management.md)
|
||||
|
||||
### Guides
|
||||
|
||||
- [Getting Started](docs/getting-started.md)
|
||||
- [Development Workflow](docs/development-workflow.md)
|
||||
- [Testing Strategy](docs/testing-strategy.md)
|
||||
|
|
@ -102,6 +111,7 @@ This extension pack implements Feature-Based Architecture with Domain-Driven Des
|
|||
## 🛠️ Technology Stack
|
||||
|
||||
### Core Technologies (from nextjs-new-app template)
|
||||
|
||||
- **Next.js 15.5.3** - React framework with App Router
|
||||
- **React 19.1.0** - Latest React with modern features
|
||||
- **TypeScript 5** - Strict type safety
|
||||
|
|
@ -110,12 +120,14 @@ This extension pack implements Feature-Based Architecture with Domain-Driven Des
|
|||
- **pnpm** - Efficient package management
|
||||
|
||||
### Development Tools (pre-configured)
|
||||
|
||||
- **ESLint 9** - Code linting with Next.js integration
|
||||
- **Prettier 3.6.2** - Code formatting with import sorting
|
||||
- **Husky 9.1.7** - Git hooks for code quality
|
||||
- **Jest** - Testing framework (configured, ready for implementation)
|
||||
|
||||
### Feature-Based Architecture Additions
|
||||
|
||||
- **Zod** - Schema validation and type generation
|
||||
- **BaseController Pattern** - Database-agnostic CRUD operations
|
||||
- **Domain-Driven Design** - Business domain organization
|
||||
|
|
@ -124,6 +136,7 @@ This extension pack implements Feature-Based Architecture with Domain-Driven Des
|
|||
## 🎯 Best Practices
|
||||
|
||||
### Code Quality
|
||||
|
||||
- Strict TypeScript configuration
|
||||
- Comprehensive ESLint rules
|
||||
- Automatic code formatting with Prettier
|
||||
|
|
@ -131,6 +144,7 @@ This extension pack implements Feature-Based Architecture with Domain-Driven Des
|
|||
- API-first design approach
|
||||
|
||||
### Performance
|
||||
|
||||
- Server Components by default
|
||||
- Client Components only when needed
|
||||
- Image optimization with Next.js Image
|
||||
|
|
@ -138,6 +152,7 @@ This extension pack implements Feature-Based Architecture with Domain-Driven Des
|
|||
- Core Web Vitals monitoring
|
||||
|
||||
### Security
|
||||
|
||||
- Input validation with Zod
|
||||
- CSRF protection
|
||||
- Secure headers middleware
|
||||
|
|
@ -195,6 +210,7 @@ This extension pack is part of the BMAD Method project and follows the same MIT
|
|||
**Current Version:** 1.0.0
|
||||
|
||||
**Compatibility:**
|
||||
|
||||
- Next.js 14+
|
||||
- Node.js 18+
|
||||
- TypeScript 5+
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
# BaseController Implementation Checklist
|
||||
|
||||
## Abstract Class Setup
|
||||
|
||||
- [ ] BaseController abstract class created in `shared/core/`
|
||||
- [ ] Generic type parameter `<T>` properly defined
|
||||
- [ ] Database client abstraction implemented
|
||||
|
|
@ -8,6 +9,7 @@
|
|||
- [ ] Constructor properly initializes dependencies
|
||||
|
||||
## CRUD Operations Implementation
|
||||
|
||||
- [ ] `getAll` method implemented with pagination
|
||||
- [ ] `getById` method implemented with proper error handling
|
||||
- [ ] `create` method implemented with validation
|
||||
|
|
@ -16,6 +18,7 @@
|
|||
- [ ] All methods return proper HTTP responses
|
||||
|
||||
## Search & Filtering
|
||||
|
||||
- [ ] Abstract `buildSearchFilter` method defined
|
||||
- [ ] Search parameter extraction implemented
|
||||
- [ ] Database-agnostic filter pattern established
|
||||
|
|
@ -24,6 +27,7 @@
|
|||
- [ ] Search performance considered
|
||||
|
||||
## Validation & Schema Integration
|
||||
|
||||
- [ ] Zod schema validation on all inputs
|
||||
- [ ] Create schema validation implemented
|
||||
- [ ] Update schema validation implemented
|
||||
|
|
@ -32,6 +36,7 @@
|
|||
- [ ] Validation error messages are user-friendly
|
||||
|
||||
## Error Handling
|
||||
|
||||
- [ ] Consistent error response format
|
||||
- [ ] HTTP status codes properly used
|
||||
- [ ] Validation errors properly formatted
|
||||
|
|
@ -40,6 +45,7 @@
|
|||
- [ ] Error messages don't expose sensitive data
|
||||
|
||||
## Database Abstraction
|
||||
|
||||
- [ ] Database client interface defined
|
||||
- [ ] Connection management abstracted
|
||||
- [ ] Database-specific operations isolated
|
||||
|
|
@ -48,6 +54,7 @@
|
|||
- [ ] Connection pooling handled
|
||||
|
||||
## Response Formatting
|
||||
|
||||
- [ ] Consistent API response structure
|
||||
- [ ] Success responses properly formatted
|
||||
- [ ] Error responses standardized
|
||||
|
|
@ -56,6 +63,7 @@
|
|||
- [ ] Content-Type headers set correctly
|
||||
|
||||
## Feature Controller Extension
|
||||
|
||||
- [ ] Feature controller extends BaseController
|
||||
- [ ] Entity-specific `buildSearchFilter` implemented
|
||||
- [ ] Custom business logic methods added
|
||||
|
|
@ -64,6 +72,7 @@
|
|||
- [ ] Controller singleton pattern implemented (if needed)
|
||||
|
||||
## Type Safety
|
||||
|
||||
- [ ] Generic types properly constrained
|
||||
- [ ] Entity model interfaces defined
|
||||
- [ ] API response types defined
|
||||
|
|
@ -72,6 +81,7 @@
|
|||
- [ ] Return types explicitly defined
|
||||
|
||||
## Performance Optimization
|
||||
|
||||
- [ ] Database queries optimized
|
||||
- [ ] Proper indexing strategy planned
|
||||
- [ ] Pagination limits enforced
|
||||
|
|
@ -80,6 +90,7 @@
|
|||
- [ ] Database connection reuse implemented
|
||||
|
||||
## Testing
|
||||
|
||||
- [ ] Unit tests for BaseController methods
|
||||
- [ ] Mock database client created
|
||||
- [ ] Test data fixtures defined
|
||||
|
|
@ -88,6 +99,7 @@
|
|||
- [ ] Performance tests implemented
|
||||
|
||||
## Documentation
|
||||
|
||||
- [ ] BaseController usage documented
|
||||
- [ ] Extension patterns documented
|
||||
- [ ] Database integration examples provided
|
||||
|
|
@ -96,6 +108,7 @@
|
|||
- [ ] Performance considerations documented
|
||||
|
||||
## Logging & Monitoring
|
||||
|
||||
- [ ] Request/response logging implemented
|
||||
- [ ] Error logging with stack traces
|
||||
- [ ] Performance metrics captured
|
||||
|
|
@ -104,6 +117,7 @@
|
|||
- [ ] Audit trail for data changes
|
||||
|
||||
## Security Considerations
|
||||
|
||||
- [ ] Input sanitization implemented
|
||||
- [ ] SQL injection prevention (for SQL databases)
|
||||
- [ ] NoSQL injection prevention (for NoSQL databases)
|
||||
|
|
@ -112,7 +126,9 @@
|
|||
- [ ] Sensitive data handling
|
||||
|
||||
## Database-Specific Implementations
|
||||
|
||||
### For SQL Databases (Prisma/TypeORM)
|
||||
|
||||
- [ ] Proper WHERE clause generation
|
||||
- [ ] JOIN operations handled
|
||||
- [ ] Transaction support implemented
|
||||
|
|
@ -120,6 +136,7 @@
|
|||
- [ ] Relationship loading optimized
|
||||
|
||||
### For MongoDB (Mongoose)
|
||||
|
||||
- [ ] Query object generation
|
||||
- [ ] Aggregation pipeline support
|
||||
- [ ] Index utilization optimized
|
||||
|
|
@ -127,6 +144,7 @@
|
|||
- [ ] Connection string security
|
||||
|
||||
### For Serverless Databases
|
||||
|
||||
- [ ] Connection pooling optimized
|
||||
- [ ] Cold start mitigation
|
||||
- [ ] Query timeout handling
|
||||
|
|
@ -134,6 +152,7 @@
|
|||
- [ ] Cost optimization considered
|
||||
|
||||
## Integration Points
|
||||
|
||||
- [ ] Authentication middleware integration
|
||||
- [ ] Authorization checks implemented
|
||||
- [ ] Audit logging integrated
|
||||
|
|
@ -142,6 +161,7 @@
|
|||
- [ ] External API integration patterns
|
||||
|
||||
## Production Readiness
|
||||
|
||||
- [ ] Environment variable configuration
|
||||
- [ ] Production database connection
|
||||
- [ ] Error monitoring integration
|
||||
|
|
|
|||
|
|
@ -1,12 +1,14 @@
|
|||
# React Component Development Checklist
|
||||
|
||||
## Pre-Development
|
||||
|
||||
- [ ] Component purpose and requirements clearly defined
|
||||
- [ ] Component interface (props) designed
|
||||
- [ ] Accessibility requirements identified
|
||||
- [ ] Design mockup/wireframe available
|
||||
|
||||
## Development
|
||||
|
||||
- [ ] TypeScript interface defined for all props
|
||||
- [ ] Component follows naming conventions (PascalCase)
|
||||
- [ ] Proper file structure and organization
|
||||
|
|
@ -14,6 +16,7 @@
|
|||
- [ ] Error boundaries implemented for critical components
|
||||
|
||||
## Styling
|
||||
|
||||
- [ ] Tailwind CSS classes used consistently
|
||||
- [ ] Responsive design implemented
|
||||
- [ ] Dark mode support (if applicable)
|
||||
|
|
@ -21,6 +24,7 @@
|
|||
- [ ] CSS class conflicts avoided
|
||||
|
||||
## Accessibility (a11y)
|
||||
|
||||
- [ ] Semantic HTML elements used
|
||||
- [ ] ARIA labels added where needed
|
||||
- [ ] Keyboard navigation supported
|
||||
|
|
@ -29,6 +33,7 @@
|
|||
- [ ] Color contrast meets WCAG guidelines
|
||||
|
||||
## Performance
|
||||
|
||||
- [ ] Unnecessary re-renders avoided
|
||||
- [ ] React.memo used where appropriate
|
||||
- [ ] Heavy computations memoized with useMemo
|
||||
|
|
@ -36,6 +41,7 @@
|
|||
- [ ] Large lists virtualized (if applicable)
|
||||
|
||||
## Testing
|
||||
|
||||
- [ ] Unit tests written and passing
|
||||
- [ ] Component renders without crashing
|
||||
- [ ] Props validation tested
|
||||
|
|
@ -44,6 +50,7 @@
|
|||
- [ ] Accessibility testing performed
|
||||
|
||||
## Code Quality
|
||||
|
||||
- [ ] TypeScript types are strict and accurate
|
||||
- [ ] ESLint rules pass
|
||||
- [ ] Prettier formatting applied
|
||||
|
|
@ -52,6 +59,7 @@
|
|||
- [ ] Comments added for complex logic
|
||||
|
||||
## Integration
|
||||
|
||||
- [ ] Component integrates well with parent components
|
||||
- [ ] State management working correctly
|
||||
- [ ] API calls handled properly (if applicable)
|
||||
|
|
@ -59,12 +67,14 @@
|
|||
- [ ] Loading states implemented
|
||||
|
||||
## Documentation
|
||||
|
||||
- [ ] Component documented with JSDoc comments
|
||||
- [ ] Props interface documented
|
||||
- [ ] Usage examples provided
|
||||
- [ ] Storybook story created (if using Storybook)
|
||||
|
||||
## Review
|
||||
|
||||
- [ ] Code review completed
|
||||
- [ ] Design review completed
|
||||
- [ ] Performance review completed
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
# Feature-Based Architecture Development Checklist
|
||||
|
||||
## Domain Analysis & Planning
|
||||
|
||||
- [ ] Business domain clearly identified and defined
|
||||
- [ ] Bounded context boundaries established
|
||||
- [ ] Domain entities and relationships mapped
|
||||
|
|
@ -9,6 +10,7 @@
|
|||
- [ ] Business requirements thoroughly documented
|
||||
|
||||
## Project Structure
|
||||
|
||||
- [ ] Feature organized in `(features)/({feature-name})/` route group
|
||||
- [ ] API layer structured in `api/{entity-name}/` directory
|
||||
- [ ] Components organized in `components/` directory within feature
|
||||
|
|
@ -17,6 +19,7 @@
|
|||
- [ ] Feature pages organized in appropriate subdirectories
|
||||
|
||||
## Schema-First Development
|
||||
|
||||
- [ ] Zod schema defined for entity validation
|
||||
- [ ] TypeScript interfaces derived from Zod schemas
|
||||
- [ ] Create, Update, and Search schemas properly defined
|
||||
|
|
@ -25,6 +28,7 @@
|
|||
- [ ] Schema validation covers all business rules
|
||||
|
||||
## BaseController Implementation
|
||||
|
||||
- [ ] Entity controller extends BaseController abstract class
|
||||
- [ ] Database-agnostic design maintained
|
||||
- [ ] `buildSearchFilter` method implemented for entity-specific search
|
||||
|
|
@ -33,6 +37,7 @@
|
|||
- [ ] Controller uses Zod schema for validation
|
||||
|
||||
## API Routes Development
|
||||
|
||||
- [ ] Collection routes (`/api/{entity}`) implemented
|
||||
- [ ] Individual entity routes (`/api/{entity}/[id]`) implemented
|
||||
- [ ] HTTP methods properly implemented (GET, POST, PUT, DELETE)
|
||||
|
|
@ -41,6 +46,7 @@
|
|||
- [ ] Database connection properly managed
|
||||
|
||||
## Custom Hooks Implementation
|
||||
|
||||
- [ ] Data fetching hooks follow naming convention (`use{Entities}`)
|
||||
- [ ] Mutation hooks follow naming convention (`use{Entity}Mutations`)
|
||||
- [ ] Single entity hooks follow naming convention (`use{Entity}`)
|
||||
|
|
@ -50,6 +56,7 @@
|
|||
- [ ] Search functionality integrated
|
||||
|
||||
## React Components
|
||||
|
||||
- [ ] Components follow PascalCase naming convention
|
||||
- [ ] Form components implemented (`{Entity}Form`)
|
||||
- [ ] List components implemented (`{Entity}List`)
|
||||
|
|
@ -60,6 +67,7 @@
|
|||
- [ ] Components follow accessibility guidelines
|
||||
|
||||
## Next.js Pages
|
||||
|
||||
- [ ] Feature index page implemented (`page.tsx`)
|
||||
- [ ] Entity detail pages implemented (`[id]/page.tsx`)
|
||||
- [ ] Create new entity page implemented (`new/page.tsx`)
|
||||
|
|
@ -69,6 +77,7 @@
|
|||
- [ ] Proper layouts and navigation implemented
|
||||
|
||||
## Type Safety
|
||||
|
||||
- [ ] Strict TypeScript configuration enforced
|
||||
- [ ] No `any` types used
|
||||
- [ ] End-to-end type safety from database to UI
|
||||
|
|
@ -77,6 +86,7 @@
|
|||
- [ ] Generic types used appropriately
|
||||
|
||||
## Code Quality
|
||||
|
||||
- [ ] ESLint rules passing without warnings
|
||||
- [ ] Prettier formatting applied consistently
|
||||
- [ ] No console statements in production code
|
||||
|
|
@ -85,6 +95,7 @@
|
|||
- [ ] Code follows established conventions
|
||||
|
||||
## Testing
|
||||
|
||||
- [ ] Unit tests for controller logic
|
||||
- [ ] API route integration tests
|
||||
- [ ] React component tests
|
||||
|
|
@ -93,6 +104,7 @@
|
|||
- [ ] Test data and mocks properly implemented
|
||||
|
||||
## Database Integration
|
||||
|
||||
- [ ] Database connection abstracted properly
|
||||
- [ ] ORM/ODM integration follows patterns
|
||||
- [ ] Migration strategy considered
|
||||
|
|
@ -101,6 +113,7 @@
|
|||
- [ ] Data relationships properly modeled
|
||||
|
||||
## Performance Considerations
|
||||
|
||||
- [ ] Server Components used for data fetching
|
||||
- [ ] Client Components minimized
|
||||
- [ ] Database queries optimized
|
||||
|
|
@ -109,6 +122,7 @@
|
|||
- [ ] Bundle size impact assessed
|
||||
|
||||
## Security
|
||||
|
||||
- [ ] Input validation on all API endpoints
|
||||
- [ ] Authentication/authorization considered
|
||||
- [ ] SQL injection prevention (if using SQL database)
|
||||
|
|
@ -117,6 +131,7 @@
|
|||
- [ ] Error messages don't leak sensitive information
|
||||
|
||||
## Documentation
|
||||
|
||||
- [ ] Feature purpose and scope documented
|
||||
- [ ] API endpoints documented
|
||||
- [ ] Component usage examples provided
|
||||
|
|
@ -125,6 +140,7 @@
|
|||
- [ ] Database schema documented
|
||||
|
||||
## Integration & Dependencies
|
||||
|
||||
- [ ] Shared infrastructure properly utilized
|
||||
- [ ] Cross-feature dependencies minimized
|
||||
- [ ] Integration points well-defined
|
||||
|
|
@ -133,6 +149,7 @@
|
|||
- [ ] Feature can be tested in isolation
|
||||
|
||||
## Deployment Readiness
|
||||
|
||||
- [ ] Environment variables properly configured
|
||||
- [ ] Production build successful
|
||||
- [ ] Database migrations ready (if needed)
|
||||
|
|
@ -141,6 +158,7 @@
|
|||
- [ ] Health checks implemented
|
||||
|
||||
## Review & Quality Assurance
|
||||
|
||||
- [ ] Code review completed
|
||||
- [ ] Architecture review completed
|
||||
- [ ] Business logic verified
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
# Create API Endpoint
|
||||
|
||||
## Task Overview
|
||||
|
||||
Create a new API endpoint in Next.js with proper TypeScript typing, validation, and error handling.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- Next.js project with App Router
|
||||
- TypeScript configured
|
||||
- Understanding of HTTP methods and status codes
|
||||
|
|
@ -11,9 +13,11 @@ Create a new API endpoint in Next.js with proper TypeScript typing, validation,
|
|||
## Steps
|
||||
|
||||
### 1. Create API Route File
|
||||
|
||||
Create `src/app/api/{endpoint}/route.ts`:
|
||||
|
||||
```typescript
|
||||
import { NextRequest, NextResponse } from 'next/server'
|
||||
import { NextRequest, NextResponse } from 'next/server';
|
||||
|
||||
// Define request/response types
|
||||
interface RequestBody {
|
||||
|
|
@ -29,72 +33,65 @@ export async function GET(request: NextRequest) {
|
|||
// Handle GET request logic
|
||||
const data: ResponseData = {
|
||||
// Your response data
|
||||
}
|
||||
};
|
||||
|
||||
return NextResponse.json(data, { status: 200 })
|
||||
return NextResponse.json(data, { status: 200 });
|
||||
} catch (error) {
|
||||
console.error('API Error:', error)
|
||||
return NextResponse.json(
|
||||
{ error: 'Internal server error' },
|
||||
{ status: 500 }
|
||||
)
|
||||
console.error('API Error:', error);
|
||||
return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
|
||||
export async function POST(request: NextRequest) {
|
||||
try {
|
||||
const body: RequestBody = await request.json()
|
||||
const body: RequestBody = await request.json();
|
||||
|
||||
// Validate request body
|
||||
if (!body) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Request body is required' },
|
||||
{ status: 400 }
|
||||
)
|
||||
return NextResponse.json({ error: 'Request body is required' }, { status: 400 });
|
||||
}
|
||||
|
||||
// Handle POST request logic
|
||||
const data: ResponseData = {
|
||||
// Your response data
|
||||
}
|
||||
};
|
||||
|
||||
return NextResponse.json(data, { status: 201 })
|
||||
return NextResponse.json(data, { status: 201 });
|
||||
} catch (error) {
|
||||
console.error('API Error:', error)
|
||||
return NextResponse.json(
|
||||
{ error: 'Internal server error' },
|
||||
{ status: 500 }
|
||||
)
|
||||
console.error('API Error:', error);
|
||||
return NextResponse.json({ error: 'Internal server error' }, { status: 500 });
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 2. Add Request Validation (Optional)
|
||||
|
||||
Install and use Zod for validation:
|
||||
|
||||
```bash
|
||||
npm install zod
|
||||
```
|
||||
|
||||
```typescript
|
||||
import { z } from 'zod'
|
||||
import { z } from 'zod';
|
||||
|
||||
const requestSchema = z.object({
|
||||
name: z.string().min(1),
|
||||
email: z.string().email(),
|
||||
})
|
||||
});
|
||||
|
||||
export async function POST(request: NextRequest) {
|
||||
try {
|
||||
const body = await request.json()
|
||||
const validatedData = requestSchema.parse(body)
|
||||
const body = await request.json();
|
||||
const validatedData = requestSchema.parse(body);
|
||||
|
||||
// Use validatedData safely
|
||||
} catch (error) {
|
||||
if (error instanceof z.ZodError) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Invalid request data', details: error.errors },
|
||||
{ status: 400 }
|
||||
)
|
||||
{ status: 400 },
|
||||
);
|
||||
}
|
||||
// Handle other errors
|
||||
}
|
||||
|
|
@ -102,36 +99,39 @@ export async function POST(request: NextRequest) {
|
|||
```
|
||||
|
||||
### 3. Create API Client Helper
|
||||
|
||||
Create `src/lib/api-client.ts`:
|
||||
|
||||
```typescript
|
||||
class ApiError extends Error {
|
||||
constructor(public status: number, message: string) {
|
||||
super(message)
|
||||
this.name = 'ApiError'
|
||||
constructor(
|
||||
public status: number,
|
||||
message: string,
|
||||
) {
|
||||
super(message);
|
||||
this.name = 'ApiError';
|
||||
}
|
||||
}
|
||||
|
||||
export async function apiCall<T>(
|
||||
url: string,
|
||||
options?: RequestInit
|
||||
): Promise<T> {
|
||||
export async function apiCall<T>(url: string, options?: RequestInit): Promise<T> {
|
||||
const response = await fetch(url, {
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...options?.headers,
|
||||
},
|
||||
...options,
|
||||
})
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new ApiError(response.status, `HTTP error! status: ${response.status}`)
|
||||
throw new ApiError(response.status, `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
|
||||
return response.json()
|
||||
return response.json();
|
||||
}
|
||||
```
|
||||
|
||||
### 4. Use in Components
|
||||
|
||||
```typescript
|
||||
'use client'
|
||||
|
||||
|
|
@ -164,6 +164,7 @@ export function ExampleComponent() {
|
|||
```
|
||||
|
||||
## Validation Checklist
|
||||
|
||||
- [ ] API route file created in correct location
|
||||
- [ ] Proper TypeScript types defined
|
||||
- [ ] Error handling implemented
|
||||
|
|
@ -173,6 +174,7 @@ export function ExampleComponent() {
|
|||
- [ ] Error cases handled gracefully
|
||||
|
||||
## Best Practices
|
||||
|
||||
- Use proper HTTP status codes
|
||||
- Implement consistent error response format
|
||||
- Add request validation for security
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
# Setup Project from nextjs-new-app Template
|
||||
|
||||
## Task Overview
|
||||
|
||||
Initialize a new Feature-Based Architecture project using the pre-configured `nextjs-new-app` template with Next.js 15+, TypeScript, Tailwind CSS 4.x, and development tooling.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- Node.js 20.10.0+ installed
|
||||
- pnpm (recommended) or npm package manager
|
||||
- Git for version control
|
||||
|
|
@ -12,6 +14,7 @@ Initialize a new Feature-Based Architecture project using the pre-configured `ne
|
|||
## Steps
|
||||
|
||||
### 1. Clone Template Repository
|
||||
|
||||
```bash
|
||||
# Clone the nextjs-new-app template
|
||||
git clone https://github.com/marciobarroso/nextjs-new-app.git {project_name}
|
||||
|
|
@ -25,6 +28,7 @@ git commit -m "Initial commit from nextjs-new-app template"
|
|||
```
|
||||
|
||||
### 2. Install Dependencies
|
||||
|
||||
```bash
|
||||
# Install using pnpm (recommended by template)
|
||||
pnpm install
|
||||
|
|
@ -34,7 +38,9 @@ pnpm install
|
|||
```
|
||||
|
||||
### 3. Configure Project Details
|
||||
|
||||
Update `package.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "{project_name}",
|
||||
|
|
@ -45,6 +51,7 @@ Update `package.json`:
|
|||
```
|
||||
|
||||
### 4. Set Up Feature-Based Architecture Structure
|
||||
|
||||
```bash
|
||||
# Create the Feature-Based Architecture directories
|
||||
mkdir -p app/\(features\)
|
||||
|
|
@ -60,122 +67,134 @@ mkdir -p app/shared/lib
|
|||
```
|
||||
|
||||
### 5. Implement BaseController Foundation
|
||||
|
||||
Create `app/shared/core/base-controller.ts`:
|
||||
|
||||
```typescript
|
||||
import { z } from 'zod'
|
||||
import { NextRequest, NextResponse } from 'next/server'
|
||||
import { z } from 'zod';
|
||||
import { NextRequest, NextResponse } from 'next/server';
|
||||
|
||||
export abstract class BaseController<T> {
|
||||
protected dbClient: any
|
||||
protected schema?: z.ZodSchema
|
||||
protected dbClient: any;
|
||||
protected schema?: z.ZodSchema;
|
||||
|
||||
constructor(dbClient: any, schema?: z.ZodSchema) {
|
||||
this.dbClient = dbClient
|
||||
this.schema = schema
|
||||
this.dbClient = dbClient;
|
||||
this.schema = schema;
|
||||
}
|
||||
|
||||
// Standard CRUD operations
|
||||
async getAll(request: NextRequest): Promise<NextResponse> {
|
||||
try {
|
||||
const { searchParams } = new URL(request.url)
|
||||
const query = searchParams.get('query')
|
||||
const page = parseInt(searchParams.get('page') || '1')
|
||||
const limit = parseInt(searchParams.get('limit') || '20')
|
||||
const { searchParams } = new URL(request.url);
|
||||
const query = searchParams.get('query');
|
||||
const page = parseInt(searchParams.get('page') || '1');
|
||||
const limit = parseInt(searchParams.get('limit') || '20');
|
||||
|
||||
const filter = this.buildSearchFilter(query)
|
||||
const filter = this.buildSearchFilter(query);
|
||||
// Implement database-specific query here
|
||||
|
||||
return NextResponse.json({
|
||||
data: [],
|
||||
pagination: { page, limit, total: 0, totalPages: 0 },
|
||||
success: true
|
||||
})
|
||||
success: true,
|
||||
});
|
||||
} catch (error) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Failed to fetch records', success: false },
|
||||
{ status: 500 }
|
||||
)
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async getById(request: NextRequest, { params }: { params: { id: string } }): Promise<NextResponse> {
|
||||
async getById(
|
||||
request: NextRequest,
|
||||
{ params }: { params: { id: string } },
|
||||
): Promise<NextResponse> {
|
||||
try {
|
||||
// Implement database-specific findById here
|
||||
return NextResponse.json({ data: null, success: true })
|
||||
return NextResponse.json({ data: null, success: true });
|
||||
} catch (error) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Failed to fetch record', success: false },
|
||||
{ status: 500 }
|
||||
)
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async create(request: NextRequest): Promise<NextResponse> {
|
||||
try {
|
||||
const body = await request.json()
|
||||
const body = await request.json();
|
||||
|
||||
if (this.schema) {
|
||||
const validatedData = this.schema.parse(body)
|
||||
const validatedData = this.schema.parse(body);
|
||||
// Implement database-specific create here
|
||||
}
|
||||
|
||||
return NextResponse.json({ data: null, success: true }, { status: 201 })
|
||||
return NextResponse.json({ data: null, success: true }, { status: 201 });
|
||||
} catch (error) {
|
||||
if (error instanceof z.ZodError) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Validation failed', details: error.errors, success: false },
|
||||
{ status: 400 }
|
||||
)
|
||||
{ status: 400 },
|
||||
);
|
||||
}
|
||||
return NextResponse.json(
|
||||
{ error: 'Failed to create record', success: false },
|
||||
{ status: 500 }
|
||||
)
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async update(request: NextRequest, { params }: { params: { id: string } }): Promise<NextResponse> {
|
||||
async update(
|
||||
request: NextRequest,
|
||||
{ params }: { params: { id: string } },
|
||||
): Promise<NextResponse> {
|
||||
try {
|
||||
const body = await request.json()
|
||||
const body = await request.json();
|
||||
|
||||
if (this.schema) {
|
||||
const validatedData = this.schema.partial().parse(body)
|
||||
const validatedData = this.schema.partial().parse(body);
|
||||
// Implement database-specific update here
|
||||
}
|
||||
|
||||
return NextResponse.json({ data: null, success: true })
|
||||
return NextResponse.json({ data: null, success: true });
|
||||
} catch (error) {
|
||||
if (error instanceof z.ZodError) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Validation failed', details: error.errors, success: false },
|
||||
{ status: 400 }
|
||||
)
|
||||
{ status: 400 },
|
||||
);
|
||||
}
|
||||
return NextResponse.json(
|
||||
{ error: 'Failed to update record', success: false },
|
||||
{ status: 500 }
|
||||
)
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
async delete(request: NextRequest, { params }: { params: { id: string } }): Promise<NextResponse> {
|
||||
async delete(
|
||||
request: NextRequest,
|
||||
{ params }: { params: { id: string } },
|
||||
): Promise<NextResponse> {
|
||||
try {
|
||||
// Implement database-specific delete here
|
||||
return NextResponse.json({ success: true, message: 'Record deleted successfully' })
|
||||
return NextResponse.json({ success: true, message: 'Record deleted successfully' });
|
||||
} catch (error) {
|
||||
return NextResponse.json(
|
||||
{ error: 'Failed to delete record', success: false },
|
||||
{ status: 500 }
|
||||
)
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Abstract method for search filtering
|
||||
protected abstract buildSearchFilter(query: string | null): Record<string, any>
|
||||
protected abstract buildSearchFilter(query: string | null): Record<string, any>;
|
||||
}
|
||||
```
|
||||
|
||||
### 6. Add Zod for Schema Validation
|
||||
|
||||
```bash
|
||||
# Install Zod for schema validation
|
||||
pnpm add zod
|
||||
|
|
@ -183,7 +202,9 @@ pnpm add zod
|
|||
```
|
||||
|
||||
### 7. Configure Environment Variables
|
||||
|
||||
Create `.env.local`:
|
||||
|
||||
```env
|
||||
# Database Configuration (customize based on your choice)
|
||||
DATABASE_URL="your-database-url"
|
||||
|
|
@ -196,7 +217,9 @@ NEXT_PUBLIC_APP_VERSION="1.0.0"
|
|||
```
|
||||
|
||||
### 8. Update TypeScript Configuration
|
||||
|
||||
The template already provides optimal TypeScript configuration, but you can extend `tsconfig.json` if needed:
|
||||
|
||||
```json
|
||||
{
|
||||
"compilerOptions": {
|
||||
|
|
@ -210,6 +233,7 @@ The template already provides optimal TypeScript configuration, but you can exte
|
|||
```
|
||||
|
||||
### 9. Test the Setup
|
||||
|
||||
```bash
|
||||
# Run development server
|
||||
pnpm dev
|
||||
|
|
@ -229,6 +253,7 @@ pnpm build
|
|||
```
|
||||
|
||||
### 10. Initialize Git Repository
|
||||
|
||||
```bash
|
||||
# Add remote repository (replace with your repository URL)
|
||||
git remote add origin https://github.com/yourusername/{project_name}.git
|
||||
|
|
@ -249,6 +274,7 @@ git push -u origin main
|
|||
```
|
||||
|
||||
## Validation Checklist
|
||||
|
||||
- [ ] Template repository successfully cloned
|
||||
- [ ] Dependencies installed without errors
|
||||
- [ ] Development server runs on http://localhost:3000
|
||||
|
|
@ -261,6 +287,7 @@ git push -u origin main
|
|||
- [ ] Git repository initialized and connected
|
||||
|
||||
## Template Features Already Configured
|
||||
|
||||
- ✅ Next.js 15.5.3 with App Router
|
||||
- ✅ React 19.1.0 with latest features
|
||||
- ✅ TypeScript 5 with strict configuration
|
||||
|
|
@ -274,6 +301,7 @@ git push -u origin main
|
|||
- ✅ Internationalization setup
|
||||
|
||||
## Next Steps After Setup
|
||||
|
||||
1. Plan your first business domain feature
|
||||
2. Implement your chosen database integration (Prisma, TypeORM, Mongoose, etc.)
|
||||
3. Create your first feature following Feature-Based Architecture
|
||||
|
|
@ -285,6 +313,7 @@ git push -u origin main
|
|||
## Database Integration Examples
|
||||
|
||||
### For Prisma (PostgreSQL)
|
||||
|
||||
```bash
|
||||
pnpm add prisma @prisma/client
|
||||
pnpm add -D prisma
|
||||
|
|
@ -292,6 +321,7 @@ npx prisma init
|
|||
```
|
||||
|
||||
### For TypeORM (SQL databases)
|
||||
|
||||
```bash
|
||||
pnpm add typeorm reflect-metadata
|
||||
pnpm add pg # for PostgreSQL
|
||||
|
|
@ -299,6 +329,7 @@ pnpm add pg # for PostgreSQL
|
|||
```
|
||||
|
||||
### For Mongoose (MongoDB)
|
||||
|
||||
```bash
|
||||
pnpm add mongoose
|
||||
pnpm add -D @types/mongoose
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
# Setup Next.js Project
|
||||
|
||||
## Task Overview
|
||||
|
||||
Initialize a new Next.js project with TypeScript, Tailwind CSS, ESLint, and Prettier configuration.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- Node.js 18+ installed
|
||||
- npm or yarn package manager
|
||||
- Git for version control
|
||||
|
|
@ -11,19 +13,23 @@ Initialize a new Next.js project with TypeScript, Tailwind CSS, ESLint, and Pret
|
|||
## Steps
|
||||
|
||||
### 1. Create Next.js Project
|
||||
|
||||
```bash
|
||||
npx create-next-app@latest {project_name} --typescript --tailwind --eslint --app --src-dir --import-alias "@/*"
|
||||
cd {project_name}
|
||||
```
|
||||
|
||||
### 2. Install Additional Dependencies
|
||||
|
||||
```bash
|
||||
npm install --save-dev prettier prettier-plugin-tailwindcss @types/node
|
||||
npm install lucide-react clsx tailwind-merge
|
||||
```
|
||||
|
||||
### 3. Configure Prettier
|
||||
|
||||
Create `.prettierrc.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"semi": false,
|
||||
|
|
@ -36,7 +42,9 @@ Create `.prettierrc.json`:
|
|||
```
|
||||
|
||||
### 4. Update ESLint Configuration
|
||||
|
||||
Extend `.eslintrc.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"extends": ["next/core-web-vitals", "prettier"],
|
||||
|
|
@ -48,7 +56,9 @@ Extend `.eslintrc.json`:
|
|||
```
|
||||
|
||||
### 5. Configure TypeScript
|
||||
|
||||
Update `tsconfig.json` for strict mode:
|
||||
|
||||
```json
|
||||
{
|
||||
"compilerOptions": {
|
||||
|
|
@ -61,7 +71,9 @@ Update `tsconfig.json` for strict mode:
|
|||
```
|
||||
|
||||
### 6. Set up Scripts
|
||||
|
||||
Add to `package.json`:
|
||||
|
||||
```json
|
||||
{
|
||||
"scripts": {
|
||||
|
|
@ -73,6 +85,7 @@ Add to `package.json`:
|
|||
```
|
||||
|
||||
## Validation Checklist
|
||||
|
||||
- [ ] Next.js project created with TypeScript
|
||||
- [ ] Tailwind CSS configured and working
|
||||
- [ ] ESLint and Prettier configured
|
||||
|
|
@ -81,6 +94,7 @@ Add to `package.json`:
|
|||
- [ ] Project builds without errors
|
||||
|
||||
## Next Steps
|
||||
|
||||
- Set up folder structure
|
||||
- Configure environment variables
|
||||
- Create initial components
|
||||
|
|
@ -85,4 +85,12 @@ tasks:
|
|||
- name: test_suite
|
||||
description: Comprehensive test suite for the feature
|
||||
|
||||
agents: [domain-architect, nextjs-architect, base-controller-specialist, typescript-specialist, api-developer, tailwind-designer]
|
||||
agents:
|
||||
[
|
||||
domain-architect,
|
||||
nextjs-architect,
|
||||
base-controller-specialist,
|
||||
typescript-specialist,
|
||||
api-developer,
|
||||
tailwind-designer,
|
||||
]
|
||||
|
|
|
|||
|
|
@ -53,4 +53,5 @@ tasks:
|
|||
- name: documentation
|
||||
description: Feature documentation and usage examples
|
||||
|
||||
agents: [nextjs-architect, typescript-specialist, tailwind-designer, api-developer, testing-engineer]
|
||||
agents:
|
||||
[nextjs-architect, typescript-specialist, tailwind-designer, api-developer, testing-engineer]
|
||||
|
|
|
|||
Loading…
Reference in New Issue