Shows the pain point your product solves.Edit:/components/Problem.tsx
<h2>Tired of spending weeks on boilerplate?</h2><p>Most developers waste time setting up auth, payments, and basic features instead of building their actual product.</p>
Keep it relatable. Describe a frustration your audience feels daily.
Side-by-side comparison of life before/after your product.Edit:/components/WithWithout.tsx
const withoutProduct = [ "Weeks setting up auth", "Days configuring Stripe", "Hours on email templates",]const withProduct = [ "Auth working in 5 minutes", "Payments ready out of the box", "Professional emails included",]
Step-by-step process to use your product.Edit:/components/HowItWorks.tsx
const steps = [ { number: "1", title: "Clone the repo", description: "Get the code and install dependencies in 2 minutes", }, { number: "2", title: "Configure your brand", description: "Update colors, logo, and copy in one config file", }, { number: "3", title: "Deploy and launch", description: "Push to production and start getting customers", },]
Final push to convert visitors.Edit:/components/Cta.tsx
<h2>Ready to ship your product?</h2><p>Join hundreds of developers who launched faster with ShipFast.</p><ButtonCheckout priceId={config.stripe.plans[0].priceId} />
Simple and action-focused. No more than 2 sentences.
Personal intro from the creator. Builds trust.Edit:/components/MakerIntro.tsx
<img src="/maker-photo.jpg" alt="Your name" /><h3>Built by [Your Name]</h3><p>I'm a solo developer who got tired of rebuilding the same features for every project...</p>
Keep it honest and personal. Explain why you built this.