Our review
Runs a series of automated checks on changed files before creating a pull request, covering TypeScript, React, security, performance, and accessibility.
Strengths
- Comprehensive checklist tailored to Next.js/TypeScript projects
- Catches common issues (any types, vulnerable dependencies, git conflicts)
- Outputs formatted report with file:line references
- Automates often-forgotten manual checks
Limitations
- Does not run test suites (vitest/playwright)
- Static analysis only, no dynamic execution
- Requires up-to-date main branch
Before every push to a pull request, to catch common issues in your changes.
When you need full security audit or test execution; use dedicated tools like /audit or test suites instead.
Security analysis
SafeThe skill instructs running typical dev commands (git diff, make, pnpm) for code quality checks. No destructive, exfiltrating, or obfuscated actions. It does not handle secrets or perform network operations beyond a package audit. All commands are safe in a development environment.
No concerns found
Examples
Run preflight checks on my current branch against main.Compare with main and run preflight checklist: TypeScript strict, React patterns, route structure, data fetching, validation, env vars, imports, dead code, security, dependencies, git hygiene, performance, styling, dates, accessibility, and code style.name: preflight description: Pre-PR check for common issues - run before pushing to catch problems early
Preflight
Run this before creating a PR to catch common issues in changed files.
Instructions
- Run
git diff main --name-onlyto get list of changed files - For each changed file, run the checks below
- Report issues with
file:linereferences - Group by category for readability
Checks
TypeScript Strict
- [ ] No
anytypes - find proper type or useunknown - [ ] No
@ts-ignoreor@ts-expect-errorwithout explanation - [ ] Local interfaces use
PropsnotComponentNameProps - [ ] Type check passes (use
make typesif available, elsepnpm tsc --noEmit)
# Check if 'types' target is available in make output
make 2>/dev/null | grep -q 'types' && make types || pnpm tsc --noEmit
React Patterns
- [ ]
'use client'only where actually needed (hooks, browser APIs, event handlers) - [ ] Browser-only libs use
dynamic(() => import(...), { ssr: false }) - [ ] No
console.logleft in code (use proper logging or remove)
Route Structure
- [ ] Routes have
loading.tsxwith skeleton - [ ] Routes have
error.tsxwith reset button - [ ] Page components are server components unless they need client features
Data Fetching
- [ ] Prisma queries use
selectto specify fields (not barefindMany()) - [ ] No N+1 patterns (queries inside loops)
- [ ] tRPC routers return flat structures
Validation
- [ ] Zod schemas in
validations/not inline in components
Environment Variables
- [ ] No
process.env.*outsideconstants/directory - [ ] New env vars added to
.env.example - [ ]
NEXT_PUBLIC_prefix only for client-safe values - [ ] Server-only secrets not accessed in client components
Imports
- [ ] Use
@/path alias (no../../../climbs) - [ ] Barrel exports updated when adding new files
Dead Code
- [ ] No unused imports
- [ ] No unused variables or parameters
- [ ] No unused functions or components
- [ ] No commented-out code blocks (delete or restore)
- [ ] No unreachable code after return/throw
Security
- [ ] No hardcoded secrets or API keys
- [ ] No
dangerouslySetInnerHTMLwithout sanitization - [ ] No raw SQL queries (use parameterized/Prisma)
- [ ] No sensitive data in console.log or error messages
- [ ] User input validated before use
Dependency Vulnerabilities
Quick audit check (not full analysis - use /audit for that):
pnpm audit 2>/dev/null | head -20
- [ ] No critical/high vulnerabilities in direct dependencies
- Transitive/dev-only vulnerabilities: note but don't block (run
/auditfor full analysis)
Git Hygiene
- [ ] No merge conflict markers (
<<<<<<<,=======,>>>>>>>) - [ ] No
.onlyor.skipleft in test files - [ ] No
debuggerstatements - [ ] No
.env.localor other local config committed - [ ] No large binary files that shouldn't be in git
Performance
- [ ] Large objects/arrays use
useMemoif recreated each render - [ ] Images have explicit
widthandheight(prevents layout shift) - [ ] No synchronous heavy operations in render path
- [ ] Lists over 100 items paginated or virtualized
- [ ] No
useEffectwithout dependency array
Styling
- [ ] Theme-aware colors (
text-muted-foreground) not hardcoded (text-gray-500) - [ ] Images use
<Image>fromnext/image
Dates
- [ ] Use
formatInTimeZonefromdate-fns-tz, notformatfromdate-fns - [ ] Display dates in
facilityTimezone, store in UTC
Accessibility
- [ ] Images have
altattributes - [ ] Interactive elements have proper
aria-*attributes - [ ] Form inputs have associated labels
Code Style
- [ ] No semicolons
- [ ] Files end with single newline
- [ ] Empty lines have no whitespace
- [ ] No trailing whitespace
Output Format
## Preflight Report
> Note: Not running test suites (vitest/playwright) - assuming you've run them or will before pushing. CI is the backstop.
### TypeScript (2 issues)
- app/users/page.tsx:15 - `any` type used, consider `User[]`
- components/modal.tsx:8 - uses `UserModalProps` instead of `Props`
### Route Structure (1 issue)
- app/bookings/ - missing loading.tsx
### Imports (1 issue)
- lib/utils.ts:3 - relative import `../../components`, use `@/components`
### Passed
- React Patterns
- Data Fetching
- Validation
- Styling
- Dates
- Accessibility
- Code Style
Severity
Report issues but don't block. Developer decides what to fix. Some checks are style preferences, others are bugs waiting to happen.
Must fix: Security issues, merge conflict markers, hardcoded secrets, .only/.skip in tests
Should fix: any types, missing error boundaries, N+1 queries, timezone bugs, unused code, performance issues
Nice to fix: Naming conventions, import style, semicolons
Next.js App Router Expert
Development
A skill that turns Claude into a Next.js App Router expert.
README Generator
Development
Creates professional and comprehensive README.md files for your projects.
API Documentation Writer
Development
Generates comprehensive API documentation in OpenAPI/Swagger format.