quarto-simulator

Teach Quarto inside Quarto

quarto-simulator is a Quarto extension for teaching the basics of Quarto and markdown inside a Quarto lesson. It turns a block in the lesson into an editor and a live preview that simulate quarto render, with optional graded exercises. Everything runs in the learner’s browser: there is nothing to install and no server to run.

Try it. Change the text on the left, then press ▶ Render (or Ctrl/Cmd + Shift + K):

ImportantA simulation, not Quarto

The markdown-to-HTML step is real: Quarto 1.10’s own reader, Lua filters and template run in a WebAssembly build of pandoc. The rest is reimplemented for the browser: reading the YAML, running R (webR) and Python (Pyodide), and part of Quarto’s HTML post-processing. Only HTML output is supported. How it works has the details.

Install

quarto add ryjohnson09/quarto-simulator

Then add the filter to a lesson and write a quarto-simulator block, with more backticks than any fence inside it:

---
title: "My lesson"
engine: markdown
filters:
  - quarto-simulator
---

````{quarto-simulator}
---
title: "Hello"
---

Some **markdown** to start from.
````

engine: markdown stops knitr or Jupyter from running the code cells inside playgrounds when the lesson itself renders.

What it can do

  • Real Quarto output. Callouts, cross-references, figures, tabsets, equations and the table of contents come from Quarto’s own filters.
  • R and Python. R cells run in webR and Python cells in Pyodide, with plots, tables, cell options and inline code.
  • Exercises. Hints, solutions and checks written in a few lines of JavaScript, with feedback in the learner’s words.
  • Helpful errors. YAML mistakes point to the line, unknown options get “did you mean” suggestions, and failed cells say which cell failed.
  • A familiar editor. Syntax highlighting modelled on Positron, shaded code cells and the RStudio render shortcut. Edits are saved in the browser.

What it can’t do

  • Formats other than HTML. A format: pdf document previews as HTML, with a notice saying so.
  • Themes. theme has no effect; the preview uses Quarto’s default.
  • Projects and files. Each playground is a single document: no multi-file projects, local images or data files, bibliographies or include shortcodes.
  • Other engines and extensions. Julia, OJS and third-party Quarto extensions don’t run.
  • Everything R and Python can do. Cells can’t read local files, some packages and widgets aren’t available, and an infinite loop in R can’t be stopped without reloading the page.

How it works has the full list, and R code and Python code cover each language.

Vignettes

Get started
Install the extension, write a playground, and choose its options.
Exercises
Add hints, solutions and checks that grade the learner’s document.
R code
What R cells can do in the browser, and how they differ from knitr.
Python code
Python cells with IPython in Pyodide: packages, plots, tables and inline code.
Example lesson
A complete lesson with four graded exercises.
How it works
What is real Quarto and what is simulated, performance, and hosting notes.