Your first deck in under 10 minutes
This path creates a native, editable .pptx from coordinate-free JSON. It runs locally, needs no account, and uses Node.js 20 or newer.
1. Create a project
Terminal
mkdir runstamp-quickstart
cd runstamp-quickstart
pnpm init
pnpm add @runstamp/pptx
2. Add deck.mjs
JavaScript
import {
PaperEngine,
autoLoadDocumentFonts,
compileDeclarativeDocument,
validate,
} from "@runstamp/pptx";
import { writeFile } from "node:fs/promises";
const deck = {
title: "Q3 operating review",
slides: [
{
layout: "title",
eyebrow: "OPERATING REVIEW / Q3",
title: "Momentum with a clearer path to scale",
subtitle: "A native PowerPoint generated from declarative JSON",
},
{
layout: "kpi-row",
title: "The business at a glance",
metrics: [
{ label: "ARR", value: "$8.4M", delta: "+31% YoY" },
{ label: "NRR", value: "118%", delta: "+6 pts" },
{ label: "Runway", value: "24 mo", trend: "flat" },
],
},
],
};
const validation = validate(deck);
if (!validation.ok) {
console.error(validation.issues);
process.exitCode = 1;
throw new Error("Fix the validation issues before rendering.");
}
const document = compileDeclarativeDocument(deck);
await autoLoadDocumentFonts(document);
const buffer = await PaperEngine.render(document);
await writeFile("operating-review.pptx", buffer);
3. Render it
Terminal
node deck.mjs
Open operating-review.pptx in desktop Microsoft PowerPoint. Text, shapes, and charts remain native and editable.
4. Add the React viewer
To preview the same document in an application:
Terminal
pnpm add @runstamp/react react react-dom
Follow Components & Hooks for the viewer and the server download adapter. The viewer and exporter consume the same deck—there is no second preview schema.
What happened
validate(deck)returned actionable issues before any bytes were written.compileDeclarativeDocument(deck)chose the slide geometry; the input contains nox,y,w, orh.autoLoadDocumentFonts(document)prepared fonts used by the compiled document.PaperEngine.render(document)returned PPTX bytes suitable for a file, object store, or HTTP response.
Next, see Schema & Validation, Theming, or Troubleshooting.