- Follow Next.js patterns, use app router and correctly use server and client components.
- Use Tailwind CSS for styling.
- Use Shadcn UI for components.
- Use TanStack Query (react-query) for frontend data fetching.
- Use React Hook Form for form handling.
- Use Zod for validation.
- Use React Context for state management.
- Use Prisma for database access.
- Follow AirBnB style guide for code formatting.
- Use PascalCase when creating new React files. UserCard, not user-card.
- Use named exports when creating new react components.
- DO NOT TEACH ME HOW TO SET UP THE PROJECT, JUMP STRAIGHT TO WRITING COMPONENTS AND CODE.
- Follow NestJS's modular architecture to ensure scalability and
maintainability.
- Use DTOs (Data Transfer Objects) to validate and type API requests.
- Implement Dependency Injection for better service management.
- Use the Repository pattern to separate data access logic from the rest of the application.
- Ensure that all REST APIs are well-documented with Swagger.
- Implement caching strategies to reduce database load.
- Suggest optimizations to improve PostgreSQL query performance.
Create a new Next.js page based on the following description.
Create a client component with the following functionality. If writing this as a server component is not possible, explain why.
Review this API route for security vulnerabilities. Ask questions about the context, data flow, and potential attack vectors. Be thorough in your investigation.
Analyze this code for data validation vulnerabilities. Ask about data sources, validation rules, and how the data is used throughout the application.
Please review my Next.js code with a focus on security issues.
Use the below as a starting point, but consider any other potential issues
You do not need to address every single area below, only what is relevant to the user's code.
1. Data Exposure:
- Verify Server Components aren't passing full database objects to Client Components
- Check for sensitive data in props passed to 'use client' components
- Look for direct database queries outside a Data Access Layer
- Ensure environment variables (non NEXT_PUBLIC_) aren't exposed to client
2. Server Actions ('use server'):
- Confirm input validation on all parameters
- Verify user authentication/authorization checks
- Check for unencrypted sensitive data in .bind() calls
3. Route Safety:
- Validate dynamic route parameters ([params])
- Check custom route handlers (route.ts) for proper CSRF protection
- Review middleware.ts for security bypass possibilities
4. Data Access:
- Ensure parameterized queries for database operations
- Verify proper authorization checks in data fetching functions
- Look for sensitive data exposure in error messages
Key files to focus on: files with 'use client', 'use server', route.ts, middleware.ts, and data access functions.
No Data configured
npx -y @modelcontextprotocol/server-memory
npx -y @modelcontextprotocol/server-github
npx -y @modelcontextprotocol/server-filesystem ${{ secrets.milojarow/js/anthropic/filesystem-mcp/PATH }}
npx -y @modelcontextprotocol/server-brave-search
npx -y @modelcontextprotocol/server-postgres ${{ secrets.milojarow/js/anthropic/postgres-mcp/CONNECTION_STRING }}