Pre-Launch Review
Run a comprehensive code-level audit on a web app before it goes live.
Argument: $ARGUMENTS is the project path or name (e.g., ~/projects/my-app). If not provided, ask.
Process
1. Identify the project
- Resolve the project path from the argument
- Read
package.json to understand the stack (Next.js, Vite, etc.)
- Identify the main entry point and page components
2. Run the build
cd [project-path]
npm run build 2>&1
- Capture and report any build errors or warnings
- Note bundle size warnings if present
3. Audit these 8 categories
Scan all page/component files and check each category. Use Glob and Grep to find issues efficiently. Be specific — reference exact files and line numbers.
A. Accessibility
- Images missing
alt attributes
- Interactive elements missing labels or
aria-* attributes
- Missing focus styles (check for
outline: none without replacement)
- Color contrast issues (flag hardcoded light-on-light or dark-on-dark text)
- Missing
lang attribute on <html>
- Form inputs without associated labels
- Heading hierarchy skips (h1 → h3)
B. Responsive & Mobile
- Missing
<meta name="viewport"> tag
- Fixed pixel widths that would break on mobile (look for
width: [large number]px without max-width)
- Text too small for mobile (font-size below 14px on body text)
- Touch targets too small (buttons/links smaller than 44x44px)
- Horizontal overflow risks (wide tables, code blocks, images without max-width)
- Missing responsive breakpoints for key layouts
C. Error & Loading States
- API calls / data fetching without error handling
- Missing loading indicators for async operations
- Empty state handling (what shows when there's no data?)
- Form submission without disabled state or feedback
- Missing 404 / error page
D. SEO & Meta
- Missing or generic
<title> tag
- Missing
<meta name="description">
- Missing OG tags (
og:title, og:description, og:image)
- Missing favicon
- Missing canonical URL
- Broken or placeholder text in meta tags ("Lorem ipsum", "TODO", "My App")
E. Links & Assets
- Broken internal links (references to routes/pages that don't exist)
- Dead imports (importing from files that don't exist)
- Hardcoded
localhost or development URLs
- Placeholder content still in the code ("lorem", "test", "TODO", "FIXME")
- Console.log statements left in production code
- Commented-out code blocks that should be cleaned up
F. Performance
- Unoptimized images (large PNGs/JPGs without lazy loading or sizing)
- Missing
loading="lazy" on below-fold images
- Large dependencies that could be lighter (check bundle if available)
- Missing font
display: swap for custom fonts
- Render-blocking resources
G. Interface Polish
- Missing
text-wrap: balance on headings (prevents orphaned words)
- Nested elements with mismatched border radius (outer should = inner + padding)
- Missing
-webkit-font-smoothing: antialiased on body/layout
- Numbers that shift on update — missing
font-variant-numeric: tabular-nums
- Interactive animations using keyframes instead of CSS transitions (breaks interruptibility)
- Entry animations that move as one block — should split & stagger (80-100ms delay per element)
- Exit animations as prominent as entry — exits should be subtler (smaller translateY)
- Geometric centering that looks off — check optical alignment (especially icon buttons, play icons)
- Solid borders where layered box-shadows would add better depth
- Images without subtle outline (
outline: 1px solid rgba(0,0,0,0.1) + negative offset)
H. Security & Best Practices
- Exposed API keys or secrets in client-side code
- Missing
rel="noopener noreferrer" on external target="_blank" links
- Forms without CSRF protection (if applicable)
- Missing HTTPS references (hardcoded
http:// URLs)
dangerouslySetInnerHTML or equivalent without sanitization
4. Output format
Present results as a scored checklist. Group by category.
## Pre-Launch Review: [Project Name]
### Summary
[X/8 categories passed] — [one-line verdict: Ready to ship / Needs fixes / Needs work]
### A. Accessibility — [Pass ✓ / Warning ⚠ / Fail ✗]
- ✓ All images have alt text
- ⚠ `src/components/Button.tsx:14` — missing focus style
- ✗ `src/pages/index.tsx:1` — missing lang attribute on html
### B. Responsive & Mobile — [Pass ✓ / Warning ⚠ / Fail ✗]
...
[continue for all 8 categories]
### Priority Fixes
1. [Most critical issue — file:line — what to change]
2. [Second most critical — file:line — what to change]
3. [Third — file:line — what to change]
Scoring:
- Pass ✓ = No issues found in this category
- Warning ⚠ = Minor issues that won't block launch but should be fixed
- Fail ✗ = Issues that should be fixed before going live
Rules
- Be specific: always include file paths and line numbers
- Don't flag framework-handled things (e.g., Next.js handles viewport meta automatically)
- Don't flag things that are clearly intentional design choices
- Lead with the issues that would block launch; fold repeats of the same defect into one item with a count
- If screenshots are provided, review them visually too (mobile readability, visual bugs, layout issues)
- Stack-aware: adjust checks based on the framework (Next.js, Vite, Astro, etc.)
1---2name: prelaunch3description: Pre-launch review for web apps. Code-level audit covering accessibility, responsive design, SEO, error states, performance, and common issues. Run before deploying.4---56# Pre-Launch Review78Run a comprehensive code-level audit on a web app before it goes live.910**Argument**: `$ARGUMENTS` is the project path or name (e.g., `~/projects/my-app`). If not provided, ask.1112## Process1314### 1. Identify the project15- Resolve the project path from the argument16- Read `package.json` to understand the stack (Next.js, Vite, etc.)17- Identify the main entry point and page components1819### 2. Run the build20```bash21cd [project-path]22npm run build 2>&123```24- Capture and report any build errors or warnings25- Note bundle size warnings if present2627### 3. Audit these 8 categories2829Scan all page/component files and check each category. Use Glob and Grep to find issues efficiently. Be specific — reference exact files and line numbers.3031#### A. Accessibility32- Images missing `alt` attributes33- Interactive elements missing labels or `aria-*` attributes34- Missing focus styles (check for `outline: none` without replacement)35- Color contrast issues (flag hardcoded light-on-light or dark-on-dark text)36- Missing `lang` attribute on `<html>`37- Form inputs without associated labels38- Heading hierarchy skips (h1 → h3)3940#### B. Responsive & Mobile41- Missing `<meta name="viewport">` tag42- Fixed pixel widths that would break on mobile (look for `width: [large number]px` without max-width)43- Text too small for mobile (font-size below 14px on body text)44- Touch targets too small (buttons/links smaller than 44x44px)45- Horizontal overflow risks (wide tables, code blocks, images without max-width)46- Missing responsive breakpoints for key layouts4748#### C. Error & Loading States49- API calls / data fetching without error handling50- Missing loading indicators for async operations51- Empty state handling (what shows when there's no data?)52- Form submission without disabled state or feedback53- Missing 404 / error page5455#### D. SEO & Meta56- Missing or generic `<title>` tag57- Missing `<meta name="description">`58- Missing OG tags (`og:title`, `og:description`, `og:image`)59- Missing favicon60- Missing canonical URL61- Broken or placeholder text in meta tags ("Lorem ipsum", "TODO", "My App")6263#### E. Links & Assets64- Broken internal links (references to routes/pages that don't exist)65- Dead imports (importing from files that don't exist)66- Hardcoded `localhost` or development URLs67- Placeholder content still in the code ("lorem", "test", "TODO", "FIXME")68- Console.log statements left in production code69- Commented-out code blocks that should be cleaned up7071#### F. Performance72- Unoptimized images (large PNGs/JPGs without lazy loading or sizing)73- Missing `loading="lazy"` on below-fold images74- Large dependencies that could be lighter (check bundle if available)75- Missing font `display: swap` for custom fonts76- Render-blocking resources7778#### G. Interface Polish79- Missing `text-wrap: balance` on headings (prevents orphaned words)80- Nested elements with mismatched border radius (outer should = inner + padding)81- Missing `-webkit-font-smoothing: antialiased` on body/layout82- Numbers that shift on update — missing `font-variant-numeric: tabular-nums`83- Interactive animations using keyframes instead of CSS transitions (breaks interruptibility)84- Entry animations that move as one block — should split & stagger (80-100ms delay per element)85- Exit animations as prominent as entry — exits should be subtler (smaller translateY)86- Geometric centering that looks off — check optical alignment (especially icon buttons, play icons)87- Solid borders where layered box-shadows would add better depth88- Images without subtle outline (`outline: 1px solid rgba(0,0,0,0.1)` + negative offset)8990#### H. Security & Best Practices91- Exposed API keys or secrets in client-side code92- Missing `rel="noopener noreferrer"` on external `target="_blank"` links93- Forms without CSRF protection (if applicable)94- Missing HTTPS references (hardcoded `http://` URLs)95- `dangerouslySetInnerHTML` or equivalent without sanitization9697### 4. Output format9899Present results as a scored checklist. Group by category.100101```102## Pre-Launch Review: [Project Name]103104### Summary105[X/8 categories passed] — [one-line verdict: Ready to ship / Needs fixes / Needs work]106107### A. Accessibility — [Pass ✓ / Warning ⚠ / Fail ✗]108- ✓ All images have alt text109- ⚠ `src/components/Button.tsx:14` — missing focus style110- ✗ `src/pages/index.tsx:1` — missing lang attribute on html111112### B. Responsive & Mobile — [Pass ✓ / Warning ⚠ / Fail ✗]113...114115[continue for all 8 categories]116117### Priority Fixes1181. [Most critical issue — file:line — what to change]1192. [Second most critical — file:line — what to change]1203. [Third — file:line — what to change]121```122123**Scoring:**124- **Pass ✓** = No issues found in this category125- **Warning ⚠** = Minor issues that won't block launch but should be fixed126- **Fail ✗** = Issues that should be fixed before going live127128## Rules129- Be specific: always include file paths and line numbers130- Don't flag framework-handled things (e.g., Next.js handles viewport meta automatically)131- Don't flag things that are clearly intentional design choices132- Lead with the issues that would block launch; fold repeats of the same defect into one item with a count133- If screenshots are provided, review them visually too (mobile readability, visual bugs, layout issues)134- Stack-aware: adjust checks based on the framework (Next.js, Vite, Astro, etc.)
beckyisj