finds.dev

steven-tey/og

Display headlines directly inside your news article's OG images.

View on GitHubHomepage ↗

★ 204TypeScriptupdated Oct 2023

// the take

A demo (not a library) showing how to inject a real headline into the OG image of a news article by rewriting the URL and serving a bot-only preview via @vercel/og. It's for developers curious about dynamic OG image generation on Edge Functions, not for production use as-is since it only supports three hardcoded publications.

Middleware-based bot detection (redirect humans, serve OG image to crawlers) is a clean, reusable pattern worth stealing even if you don't want the rest of the app. Each publication's OG route is a small, isolated Vercel Edge Function (nyt.tsx, wired.tsx, tc.tsx), so it's easy to read end-to-end in a few minutes. Uses @vercel/og directly rather than wrapping it in abstraction, so you see exactly how the image generation API is called.

Hardcoded to exactly three publications (NYT, Wired, TechCrunch) with no plugin or config system — adding a fourth means copy-pasting a new route and writing custom scraping/parsing logic per site. No tests, and headline extraction from each publication's HTML almost certainly breaks the moment any of those sites changes markup, with nothing to catch it. Last pushed October 2023 and already depends on scraping third-party page structure, so it's likely stale or broken now. No license file and no real docs beyond a README demo — this is a weekend project, not something to build on.

We read the README, the directory tree and a key source file in October 2026. Nobody pays to be listed. How we judge →

search the same ground:

// at a glance

Stars
204
Forks
15
Language
TypeScript
Last commit
6 Oct 2023

// nearby

If og isn't quite it.

All repos →