✨ Visual Editor

close

palette Canvas & Background

Gradient:arrow_forward
Text Color:
135Β°

style Card Style

40px
16px

text_fields Typography

16px
Alex Prompter
@alex_prompter
vibe coding isn't the future.

vibe coding with the right prompts is.
most people never find out the difference.

Here are 5 prompts that changed how I buildπŸ‘‡

(Save for later)
Thread image
Alex Prompter
@alex_prompter
--------------------------------------
1/ UI/UX DEVELOPMENT PLAN
--------------------------------------

#ROLE:
Senior full-stack engineer and UX architect who ships production-grade responsive web apps.

#TASK:
Generate a complete, actionable build plan for my web app covering design system, performance, responsiveness, UX patterns, and tech stack.

#STEPS:
1. Define responsive strategy β€” mobile-first breakpoints (320/768/1024/1440px), fluid type, safe areas, dvh/svh, touch targets
2. Set performance targets β€” LCP <2.5s, INP <100ms, CLS <0.1, 60fps β€” with lazy load, code split, GPU composite approach
3. Build design system β€” 8px token scale, color/type/motion/shadow, light/dark mode
4. Map UX patterns β€” F/Z layouts, skeletons, micro-interactions, WCAG 2.1 AA, inline validation, reduced-motion
5. Recommend stack β€” one framework with rationale, atomic component structure, CSS strategy, testing plan

#RULES:
- Give concrete values for every recommendation
- Name the top pitfall per section
- Pick one option, never list alternatives

#INFORMATION ABOUT ME:
- App type: [SAAS / E-COMMERCE / PORTFOLIO / OTHER]
- Target users: [NON-TECHNICAL / ENTERPRISE / MOBILE-FIRST]
- Current stack: [STACK OR NONE]

#OUTPUT:
Executive Summary β†’ Responsive Strategy β†’ Performance Blueprint β†’ Design System β†’ UX Patterns β†’ Architecture β†’ Phased Rollout β†’ Pre-launch Checklist
Alex Prompter
@alex_prompter
-----------------------------------
2/ CODE REVIEW ASSISTANT
-----------------------------------

#ROLE:
Staff engineer reviewing code before a production deploy.

#TASK:
Conduct a full code review across five dimensions and deliver line-specific, fix-ready findings.

#STEPS:
1. Bugs β€” edge cases, null handling, logic errors
2. Security β€” injection vulnerabilities, input validation, auth patterns
3. Performance β€” bottlenecks, memory leaks, unnecessary queries
4. Code quality β€” naming, structure, anti-patterns
5. Best practices β€” error handling, test coverage gaps

#RULES:
- Cite exact line for every issue
- Explain why it's a problem, not just what it is
- Show the fix in code, never in description only

#INFORMATION ABOUT ME:
- Code: [PASTE]
- Language/framework: [LANGUAGE + FRAMEWORK]
- What this code does: [ONE SENTENCE]

#OUTPUT:
Findings grouped by dimension β€” each with line ref + problem + fixed snippet. End with health score (1-10) and top 3 priority fixes.
Alex Prompter
@alex_prompter
--------------------------------
3/ DEAD CODE SURGEON
--------------------------------

#ROLE:
Senior software architect who eliminates technical debt without killing live code.

#TASK:
Conduct a surgical dead-code audit across the entire codebase β€” discover, verify, and triage every dead element.

#STEPS:
1. Discover β€” unreachable declarations (functions, variables, types, files), dead control flow (branches, hardcoded flags), phantom dependencies (unused imports, unused packages)
2. Verify β€” rule out reflection, DI containers, ORM targets, metaprogramming, test utilities, public API exports, framework hooks, config-driven behavior
3. Triage β€” assign risk: πŸ”΄ HIGH = delete now | 🟑 MEDIUM = verify first | 🟒 LOW = human review

#RULES:
- If a verification exemption applies, lower confidence and state the reason
- Never mark something HIGH without ruling out all exemptions
- Refactor order must prevent cascading errors

#INFORMATION ABOUT ME:
- Codebase: [PASTE OR DESCRIBE]
- Language/framework: [LANGUAGE + FRAMEWORK]
- Known dynamic patterns: [E.G. REFLECTION FOR DI / NONE]

#OUTPUT:
1. Findings table: File | Lines | Symbol | Category | Risk | Confidence | Action
2. Cleanup roadmap: 3 batches by risk, LOC estimate, refactor order
3. Summary table + codebase health paragraph + top 3 highest-impact actions
Alex Prompter
@alex_prompter
---------------------------------
4/ LANDING PAGE EXPERT
---------------------------------

#ROLE:
Vibe coding expert who builds landing pages that feel like a brand, not just represent it.

#TASK:
Generate a complete, responsive, single-file landing page where every design decision serves the brand's emotional identity.

#STEPS:
1. Lock color and typography to brand palette and personality
2. Build layout that moves the eye from hook to CTA without friction
3. Implement one interactive feature that earns attention
4. Apply mobile-first responsive behavior across all devices
5. Wire navigation flow β€” intuitive, zero confusion

#RULES:
- No filler sections
- No generic hero copy
- Every element serves the vibe or gets cut

#INFORMATION ABOUT ME:
- Brand vibe: [E.G. BOLD TECH / CALM WELLNESS / LUXURY MINIMAL]
- Brand colors: [PRIMARY + ACCENT]
- Interactive feature: [SEARCH / QUIZ / CALCULATOR / SCROLL ANIMATION]

#OUTPUT:
Single-file HTML with embedded CSS + JS. No external frameworks unless they serve the build.
Alex Prompter
@alex_prompter
------------------------------------------------------
5/ CODE BASE DISCOVERY & ONBOARDING
------------------------------------------------------

#ROLE:
Senior engineering lead who maps codebases so new developers become productive in one sitting.

#TASK:
Analyze the entire codebase and generate a structured Markdown onboarding guide covering architecture, flows, components, and tech stack.

#STEPS:
1. Summarize README β€” setup, conventions, contribution rules
2. Map tech stack β€” languages, frameworks, DBs, cloud, build tools (link config files)
3. Define system purpose β€” what it does, who uses it, business domain
4. Document structure β€” entry points, folder logic, critical configs, reading order
5. Identify key components β€” top modules/services with responsibilities, dependencies, code snippets
6. Trace execution flows β€” 3 critical user journeys, data flow, persistence points
7. List integrations β€” external libs, third-party APIs, communication patterns
8. Generate diagrams β€” component, data flow, deployment (Mermaid syntax)
9. Cover testing β€” frameworks, file locations, how to run locally, CI/CD
10. Document error handling, logging, and security mechanisms

#RULES:
- Every file mentioned gets a direct link
- Every key component gets a code snippet
- Diagrams stay high-level β€” no exhaustive detail

#INFORMATION ABOUT ME:
- Codebase: [PASTE / WORKSPACE / DESCRIBE]
- My role: [NEW DEV / LEAD TAKING OVER / AUDITOR]

#OUTPUT:
Markdown document. File name: YYYY-MM-DD-[project-name]-dev-discovery.md
Alex Prompter
@alex_prompter
Your premium AI bundle to 10x your business

β†’ Prompts for marketing & business
β†’ Unlimited custom prompts
β†’ n8n automations
β†’ Weekly updates

Start your free trialπŸ‘‡
godofprompt.ai/complete-ai-bu…
Generated by Thread Navigator
100%
view_carousel Carousel Studio NEW
Press ⌘ + S to quick-export