Build Urlbox

YESreplaces $19/mosaves $228/yrback to the verdict

0%0 of 18 items done

Saved on this device only. Tick prerequisites first, then work the phases in order · do not start one until the checks above it pass.

A screenshot API with Playwright: render any URL to PNG or PDF with viewport, full-page and device-scale options, refuse private addresses, sign requests, cache results, queue concurrency, and keep a browser fleet of one healthy.

estimated effort one sittingthe files for this build are in the project pack

BrowserPlaywright with ChromiumRuntimeNode 22, node:http, sharpHostingA VPS with 2 GB of RAM

Before step 1

Everything below is assumed from the first step. Tick each one when you actually have it, not when you plan to.

installfree
Why Everything in this build runs on it: the server, the scripts, the tests.
Get it Download the LTS installer from nodejs.org, or install with your package manager (brew install node, or nvm install 22). Restart the terminal afterwards. open ↗
Verify node --version prints v22 or higher
installfree
Why Every step below is a command you type or a file you edit.
Get it VS Code (code.visualstudio.com), Cursor or Zed. Open a folder for the project and use the editor's built-in terminal. open ↗
Verify You can open a folder and run a command in its terminal
installfree
Why History for your code, and the way most hosts deploy.
Get it Install from git-scm.com or with your package manager, then run git init in the project folder once it exists. open ↗
Verify git --version prints a version
accountabout $6 a month
Why Chromium needs it.
Get it Hetzner CX22 or similar. open ↗
installfree, a few hundred MB
Why The renderer.
Get it npm install playwright && npx playwright install --with-deps chromium open ↗
Verify npx playwright --version prints
decidefree
Why Signed requests only.
Get it openssl rand -hex 32.
accountroughly $10 a year, or free on an existing domain
Why A public address you own, so links you share never break when a provider changes.
Get it Register at Cloudflare Registrar, Porkbun or Namecheap, or use a subdomain of one you already own. You add one DNS record in the deploy phase. open ↗
installfree
Why Automatic HTTPS in front of the Node process. Without TLS the browser features this relies on (and your visitors' trust) do not work.
Get it On the VPS: follow the install steps at caddyserver.com/docs/install for Ubuntu. One Caddyfile with your domain and a reverse_proxy line is the whole config. open ↗
Verify caddy version prints a version on the server

Environment variables

These go in a .env file the app reads at startup. The pack's .env.example is this table as a file · copy it, never commit the filled-in version.

Variable	Needed	Example	Where the value comes from
`PORT`	required	`3000`	Any free port.
`SIGN_KEY`secret	required	`hex`	openssl rand -hex 32.
`CACHE_DIR`	required	`./renders`	Cache.
`MAX_CONCURRENCY`	optional	`3`	Pages rendering at once.
`RENDER_TIMEOUT_MS`	optional	`20000`	Hard timeout per render.

The build, in order

1
Render one URL
PNG, JPEG or PDF with a timeout and no leaked contexts.
1. terminal
  mkdir shotapi && cd shotapi && git init && npm init -y && npm pkg set type=module && npm install playwright@1 sharp@0.35.3 mkdir -p renders && cp .env.example .env
done when · tick each as it passes
next phase
2
Safety
Never fetch private or internal addresses.
done when · tick each as it passes
next phase
3
Endpoint and cache
Signed, cached, queued.
done when · tick each as it passes
next phase
4
Cleaner pages
Hide selectors, inject CSS, block trackers, dismiss banners.
done when · tick each as it passes
next phase
5
Operate
Eviction, browser restart on leaks, memory limit.
2. Files README.md
done when · tick each as it passes
next phase
6
Operate it like a productproduct builder
Only for the product-builder path: know when the renderer is down, never lose the database, and keep the server patched.
1. Answer 200 with the build id and a quick database read. Point a free uptime monitor (or your own, from the Healthchecks entry on this site) at it so an outage is noticed before a user notices.
2. One JSON line per request: method, path, status, duration, no raw IPs. Rotate weekly with logrotate, keep eight.
3. SQLite's .backup command makes a consistent copy while the app runs. Copy it to object storage or a second machine; then, once, restore it into a fresh checkout and confirm the app reads it.
  terminal
  sqlite3 data/app.db ".backup '/tmp/app-$(date +%F).db'" rclone copy /tmp/app-$(date +%F).db remote:backups/
4. Firewall allowing only 22, 80 and 443; unattended security updates on; the app running as an unprivileged user under systemd with Restart=on-failure.
done when · tick each as it passes

what this build does not replace

Web-scale reliability against every banner and anti-bot wall.
reliable cookie-banner and ad blocking across the web
scale and concurrency without managing browsers
the CDN and retina rendering polish
the SLA

after v1, if you want it

Webhook delivery of finished renders
Scheduled recurring captures

Need the files? The project pack on the verdict page hands your agent the whole brief · more screenshots.