Text Prompt
Master Full-Stack Developer Portfolio Website Architecture Prompt
Comprehensive master prompt for generating a modern Next.js 15, Tailwind CSS, and Framer Motion developer portfolio.
Act as a Principal Frontend Architect and Creative Director. Build a world-class, interactive developer portfolio website using Next.js 15 (App Router), TypeScript, Tailwind CSS, Framer Motion, and Lucide Icons. ### Architectural Requirements: 1. Hero Section: - Impactful hook: "Engineering scalable web applications & high-performance AI tools" - Subtle interactive canvas or gradient grid glow with floating tech stack badges (React, Node, Next.js, PostgreSQL, Docker) - Primary high-converting CTA: "View Selected Work" (smooth scroll) and "Book a Strategy Call" (opens modal) - Real-time availability indicator badge: "🟢 Available for Q2 contracts" 2. Projects Showcase: - Bento-grid layout with live preview cards - Filter tabs: All, Full-Stack, AI / ML, Open Source - Each project card includes: Tech stack pills, interactive hover tilt effect, GitHub repo link, and live demo external link 3. Interactive Experience / Skills Matrix: - Timeline of engineering roles with key measurable achievements (e.g., "Reduced latency by 42%") - Interactive skill proficiency radar with categorized chips (Frontend, Backend, DevOps, AI APIs) 4. Testimonials & Social Proof: - Carousel of client and founder endorsements with verified avatar and company logo 5. Contact Section & Interactive Footer: - Instant form with client-side validation (Name, Email, Project Scope, Budget tier selector) - Cal.com / Calendly embed option or direct copy-to-clipboard email button with instant toast notification - Responsive dark-mode first design with accessible WCAG AAA contrast ratios Deliver complete, production-ready code organized into modular components with clean TypeScript interfaces.
