deploying-to-production
Deploying to Production
Use this workflow when a user says "deploy this website/app" or similar. Follow the checklist in order and do not skip steps.
Deployment Workflow
- Step 1: Run build and verify no errors
- Step 2: Create GitHub repository
- Step 3: Push code to GitHub
- Step 4: Deploy to Vercel
- Step 5: Verify deployment
Step 1: Run build
Run:
npm run build
If build fails, read the errors, fix issues, and run again. Only proceed when build succeeds.
Step 2: Create GitHub repository
Create a new GitHub repository for the project. If the repo already exists, confirm whether to reuse or create a new one.
Step 3: Push code to GitHub
Initialize git if needed, add remote, and push the default branch. Confirm the repository contains the expected code.
Step 4: Deploy to Vercel
Deploy the GitHub repo to Vercel. Capture the deployment URL.
Step 5: Verify deployment
Verify the live deployment by opening the URL or checking a response. If verification fails, diagnose and redeploy.
More from zhanlincui/ultimate-agent-skills-collection
chat-compactor
Generate structured session summaries optimized for future AI agent consumption. Use when (1) ending a coding/debugging session, (2) user says "compact", "summarize session", "save context", or "wrap up", (3) context window is getting long and continuity matters, (4) before switching tasks or taking a break. Produces machine-readable handoff documents that let the next session start fluently without re-explaining.
45web-performance-seo
Fix PageSpeed Insights/Lighthouse accessibility "!" errors caused by contrast audit failures (CSS filters, OKLCH/OKLAB, low opacity, gradient text, image backgrounds). Use for accessibility-driven SEO/performance debugging and remediation.
37ui-ux-pro-max
UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples.
27obsidian-helper
|
21google-official-seo-guide
Official Google SEO guide covering search optimization, best practices, Search Console, crawling, indexing, and improving website search visibility based on official Google documentation
20obsidian-bases
Create and edit Obsidian Bases (.base files) with views, filters, formulas, and summaries. Use when working with .base files, creating database-like views of notes, or when the user mentions Bases, table views, card views, filters, or formulas in Obsidian.
18