HypeIt

Don't just ship it. HypeIt.

Paste a public URL → get a platform-ready device mockup for social. The capture + brand-scrape run in a local worker; all image compositing and export happen in your browser. Nothing is uploaded or stored.

Runs entirely on your own machine — no account, no payment, no telemetry. Every feature is unlocked.

What it does

Public-URL capture → device / browser / isolate mockup, composed per platform (Twitter 16:9, Product Hunt 2:1, Instagram 1:1) → local PNG (and GIF/MP4) export. Logo auto-fills from the site's favicon. Capture happens server-side (a headless browser can screenshot a URL; your browser can't reach cross-origin sites), then compositing and export run client-side in the studio.

Architecture

Three small apps in apps/:

App	Role
web	Static React/Vite + Fabric.js studio (served by nginx)
api	Express broker: POST /captures, polls jobs, proxies favicons
scraper	Puppeteer capture worker — URL → screenshot buffers + brand data

browser ──> web ──fetch──> api ──> scraper (headless Chrome)
                            │
                       in-mem job store

The scraper is only reachable by the api over the internal network.

Run it (Docker — easiest)

Needs Docker. One command brings up all three apps (Chrome included):

git clone https://github.com/labrat-0/HypeIt
cd HypeIt
docker compose up --build

Then open http://localhost:5173. That's it.

Changing ports

Ports are set in a root .env file — copy the example and edit:

cp .env.example .env
# .env
# WEB_PORT=8000   # studio served here
# API_PORT=4000   # api the browser calls
docker compose up --build

WEB_PORT is the address you open. API_PORT is baked into the web bundle at build time, so re-run with --build after changing it (the command above already does). The scraper has no host port — it's internal to the compose network.

Run it (manual, no Docker)

Needs Node 22+ and a local Chrome via Puppeteer. Three terminals:

# 1. scraper (downloads Chrome on first install)
cd apps/scraper && npm i && npm run dev          # :8080

# 2. api → points at the scraper
cd apps/api && npm i && SCRAPER_URL=http://localhost:8080 npm run dev   # :3000

# 3. web → points at the api
cd apps/web && npm i && echo 'VITE_API_URL=http://localhost:3000' > .env && npm run dev  # :5173

Open http://localhost:5173.

Notes & limits

• Sites with aggressive bot-walls (Cloudflare/Akamai on big SaaS) can block headless capture. Your own deployed sites generally work.
• By default the api only captures publicly-reachable URLs (an SSRF guard). To capture private/LAN hosts, set ALLOW_PRIVATE_CAPTURE=true on the api.
• spike/ is throwaway capture/driver experiments — not part of the app.

License

MIT — use it, fork it, ship it.