Welcome to the Blog
Hello#
This is the first real post. If you can read this in the browser, the markdown pipeline works on Cloudflare Workers.
Rendered inline from inside the markdown via safe-mdx — no runtime eval, no
new Function, deploys cleanly to workerd.
Buttons and badges#
Plain markdown still works for bold, italic, lists, code blocks, etc.
You can drop shadcn primitives anywhere:
Card layout inside the article#
Cards are useful for highlighting a feature or a call-out without breaking the article flow.
Accordion for inline FAQ#
Callout variants#
Five semantic colors for different message types:
Heads up
Info callout — use for neutral context the reader should be aware of.
Pro tip
Tip callout — short actionable advice that improves the reader's outcome.
Caution
Warning callout — something could go wrong if ignored.
Worked
Success callout — confirm an outcome the reader is looking for.
Stop
Danger callout — destructive or irreversible action ahead.
Tabs inside an article#
bun add safe-mdx @content-collections/coreReddit embed#
Embed external content#
YouTube videos:
Tweets from X:
And images with captions:
Code blocks too#
Inline code works with backticks. Fenced blocks support language tags:
import { allBlogPosts } from "content-collections";
const recent = allBlogPosts
.filter((p) => p.locale === "en" && !p.draft)
.sort((a, b) => b.publishedAt.localeCompare(a.publishedAt))
.slice(0, 5);
console.log(`Latest ${recent.length} posts`);# Deploy to Cloudflare Workers
pnpm build
pnpm run deployLinkCard for see-also#
Related
Our Product vs Competitor Example
A side-by-side comparison page with embedded PricingTable.
External
See the source on GitHub
External link example — opens in a new tab with rel=noopener.
CodeTabs — multi-language switcher#
import { Resend } from "resend";
const resend = new Resend(process.env.RESEND_API_KEY);
await resend.emails.send({
from: "hi@example.com",
to: "you@example.com",
subject: "Hi",
html: "<p>Hello from TS</p>",
});Subscribe to product updates#
Get product updates
New features, deep dives, occasional tips. No spam, unsubscribe anytime.
Footnotes work too#
Markdown footnotes follow the GFM spec [1] and render at the end of the article as a numbered list [2].
safe-mdx walks the mdast tree directly, so any node type that remark-gfm produces survives the render path.
↩What's next#
More posts
Real comparisons under
/vsUse-case walkthroughs under
/use-cases
Was this helpful?
Acknowledgments