What a code-heavy post looks like

Use this post to tweak the theme. Inline code looks like bun run dev, and code blocks are highlighted at build time by Shiki, with no JavaScript shipped to the reader.

Table of contents

Code blocks

AstroPaper adds file names, line highlights and diffs through Shiki transformers:

export function readingTime(markdown = "") {
  const words = markdown.trim().split(/\s+/).filter(Boolean).length; 
  return Math.max(1, Math.round(words / 220));
}src/utils/readingTime.ts

const posts = await getCollection("posts"); 
const posts = await getCollection("posts", ({ data }) => !data.draft); 

Callouts

A table, because tech posts love tables

Drafts and scheduled posts

Add draft: true to the frontmatter to keep a post unpublished. A pubDatetime in the future schedules it: it appears on the first build after that date.