[bryantgillespie]

Tutorial cards were composed on every request by /docs/api/tutorialimg with sharp. That's native code, which blocks moving docs to Cloudflare Workers, and it rebuilt the same ~50 images over and over.

What changed

• scripts/tutorial-cards.ts bakes one card per tutorial's first technology into public/img/tutorials/cards/<tech>.jpg. It uses the same layout as the old route and the same Directus fallback when a logo is missing. Cards are 960px wide JPGs (the old route served 1920px); 53 cards total 476 KB.
• TutorialCard.vue points at the static file.
• Deleted server/api/tutorialimg.ts. sharp moves to devDependencies (only the script uses it).
• pnpm tutorial-cards:check runs in Docs Checks. It fails if a tutorial uses a technology that has no card, and tells you to run pnpm tutorial-cards.

Adding a tutorial with a new technology

1. Optionally add public/img/tutorials/<tech>.png. Without it, the card uses the Directus logo.
2. Run pnpm tutorial-cards and commit the new card.

Notes

These technologies have no logo, so they fall back to Directus, same as before: supabase, framer, airbyte, clay, render.

Three logos were misnamed, so their tutorials always showed the Directus logo. They're renamed here and now get their own cards: springboot.png to spring-boot.png, 11ty.png to eleventy.png, inggest.png to inngest.png.

Screenshot

/docs/tutorials with the baked cards:

Verified

• Compared the nuxt card against the live route output: same layout.
• Ran a dev server: /docs/tutorials renders the static cards, and every card URL returns 200.
• pnpm typecheck:scripts, ESLint on the changed files, and pnpm tutorial-cards:check pass.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
docs	Ready	Preview	Oct 28, 2026 9:16pm UTC