DEV Community

Cover image for I built an AI Landing Page Roaster with Next.js + GPT-4o Vision
Сергей Савкин
Сергей Савкин

Posted on

I built an AI Landing Page Roaster with Next.js + GPT-4o Vision

Show off: Built a landing page analyzer with GPT-4o Vision + Next.js in a weekend

Tech stack:

  • Next.js 14 (App Router)
  • GPT-4o Vision for screenshot analysis
  • GPT-4o-mini for free tier
  • Tailwind CSS + Framer Motion
  • Vercel deployment
  • Crypto payments (USDT/Polygon)

The AI takes a screenshot of any URL, extracts the HTML text, and sends both to GPT-4o for a full conversion analysis.

Interesting technical challenges:

  • Had to convert screenshots to base64 (OpenAI can't fetch external URLs reliably)
  • Two-tier model approach saves ~90% on API costs for free users

Live: https://roastpage-ai.com
Source: https://github.com/sergiologino/roastpage-ai

Would love technical feedback!

Top comments (0)