Quarto is an open-source technical publishing system built on Pandoc. It can create documents, websites, blogs, books, and slides, and supports authoring in Markdown-like .qmd files. It also supports executable content from Python, R, Julia, and JavaScript through Jupyter, Knitr, and Observable integrations. (GitHub) For presentations, Quarto officially supports revealjs, pptx, and beamer; Quarto’s own docs say revealjs is the most capable presentation format unless you specifically need Office or LaTeX output. (Quarto)

1. What you are going to build

For your course-slide automation system, the model should be:

course-topic.qmd
      ↓
quarto render / quarto preview
      ↓
HTML reveal.js slides
PDF
PPTX
website
handouts

For your current folder:

cd ~/slides
ls

You already have:

Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd
Introduction_to_Red_Hat_OpenShift_DevOpsSchool.marp.md
Code language: CSS (css)

For Quarto, we will mainly work with:

Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd
Code language: CSS (css)

2. Install Quarto on macOS

Option A: Install using Homebrew

This is the easiest on your Mac:

brew install --cask quarto

Check version:

quarto --version

Check location:

which quarto

Run Quarto health check:

quarto check

Quarto’s getting-started page directs users to install Quarto first and then choose an authoring tool such as VS Code, Jupyter, RStudio, Positron, Neovim, or a normal text editor. (Quarto)

Option B: Install manually

Download the macOS installer from the official Quarto download page and install it like a normal .pkg application.

After install:

quarto --version
quarto check

Option C: Install Homebrew first, then Quarto

If Homebrew itself is not installed:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
Code language: JavaScript (javascript)

Then:

brew install --cask quarto
quarto --version

Homebrew describes itself as a package manager for macOS, Linux, and WSL. (Homebrew)

3. Install Quarto on Windows

Preferred method: use the official Windows installer from Quarto’s download page.

After install, open PowerShell and run:

quarto --version
quarto check

Optional Winget method:

winget search Quarto
winget install Posit.Quarto
Code language: CSS (css)

Then close and reopen PowerShell:

quarto --version

If Windows says quarto is not recognized, restart the terminal or check whether Quarto’s install directory was added to PATH.

4. Install Quarto on Linux

For Ubuntu/Debian, use the official .deb package.

Common latest-download style:

wget https://quarto.org/download/latest/quarto-linux-amd64.deb
sudo apt install ./quarto-linux-amd64.deb
quarto --version
quarto check
Code language: JavaScript (javascript)

For Red Hat/CentOS/Fedora style systems, use the .rpm package from the Quarto download page.

Quarto also provides Linux tarball installation for single-user setups. (Quarto)

5. Install recommended editor support

VS Code

Install VS Code extension:

code --install-extension quarto.quarto
Code language: CSS (css)

Or open VS Code:

Extensions → Search “Quarto” → Install

Then open your folder:

cd ~/slides
code .

Recommended VS Code extensions for your workflow:

Quarto
Markdown All in One
YAML
Mermaid Markdown Syntax Highlighting
GitLens

6. First Quarto commands to run

Go to your slides folder:

cd ~/slides

Check Quarto:

quarto --version
quarto check

Preview your slide deck:

quarto preview Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd
Code language: CSS (css)

Render your slide deck:

quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd
Code language: CSS (css)

Render specifically to reveal.js HTML slides:

quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to revealjs
Code language: CSS (css)

Render to PowerPoint:

quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to pptx
Code language: CSS (css)

Render to PDF:

quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to pdf
Code language: CSS (css)

The official CLI docs describe quarto render as the command for rendering files or projects to different document types, with options like --to, --output, --output-dir, --metadata, --execute, and --execute-param. (Quarto)

7. Most important Quarto commands

Command	Purpose
`quarto --version`	Show installed Quarto version
`quarto check`	Verify Quarto installation
`quarto tools`	Show installed dependencies/tools
`quarto render file.qmd`	Render one file
`quarto preview file.qmd`	Preview with live reload
`quarto render`	Render current project
`quarto create project`	Create a project
`quarto install tinytex`	Install TinyTeX for LaTeX PDF output
`quarto install chrome-headless-shell`	Install headless browser dependency
`quarto publish`	Publish document/project
`quarto inspect`	Inspect project/input configuration
`quarto add`	Add extension
`quarto remove`	Remove extension
`quarto update`	Update extension or dependency
`quarto pandoc`	Run bundled Pandoc
`quarto typst`	Run bundled Typst

The Quarto CLI reference lists the main commands, including render, preview, create, use, add, update, remove, convert, pandoc, typst, run, install, uninstall, tools, publish, capabilities, inspect, and check. (Quarto)

8. Create your first simple Quarto slide file

Create a test folder:

mkdir -p ~/slides/quarto-test/images
cd ~/slides/quarto-test
Code language: JavaScript (javascript)

Create a file:

cat > openshift-intro.qmd <<'EOF'
---
title: "Introduction to Red Hat OpenShift"
subtitle: "DevOpsSchool Training"
author: "Rajesh Kumar"
format:
  revealjs:
    theme: simple
    slide-number: true
    transition: slide
---

# Introduction

## What is OpenShift?

Red Hat OpenShift is an enterprise Kubernetes platform.

---

## Why OpenShift?

- Enterprise Kubernetes
- Built-in security
- Developer experience
- Integrated CI/CD
- Operators
- Monitoring

---

## Example Command

```bash
oc get projects
oc get pods -A
oc get routes -A
Code language: PHP (php)

Summary

OpenShift is built on Kubernetes
It adds enterprise features
It improves developer and operations workflows
EOF


Preview:

```bash
quarto preview openshift-intro.qmd
Code language: JavaScript (javascript)

Render:

quarto render openshift-intro.qmd
Code language: CSS (css)

Render to specific formats:

quarto render openshift-intro.qmd --to revealjs
quarto render openshift-intro.qmd --to pptx
quarto render openshift-intro.qmd --to pdf
Code language: CSS (css)

9. Basic Quarto file structure

A Quarto file has two major parts:

YAML front matter
Markdown content

Example:

---
title: "My Course"
author: "Rajesh Kumar"
format: revealjs
---

## Slide 1

Content here.

---

## Slide 2

More content here.
Code language: PHP (php)

The YAML front matter controls:

title
author
format
theme
slide numbers
logo
footer
execution settings
output format

The Markdown content controls:

headings
slides
bullets
tables
images
code blocks
speaker notes

10. How slides are created in Quarto

For revealjs, slides are usually created using headings.

Example:

## Slide One

This is slide one.

## Slide Two

This is slide two.
Code language: PHP (php)

You can also create section slides with level-1 headings:

# Section 1

## Topic 1

Content.

## Topic 2

Content.
Code language: PHP (php)

You can also separate slides using horizontal rules:

First slide content.

---

Second slide content.

Quarto’s reveal.js docs explain that slides are delineated using headings, and horizontal rules can also be used for slides without titles. (Quarto)

11. Reveal.js slide deck example for educators

Create:

cat > kubernetes-basics.qmd <<'EOF'
---
title: "Kubernetes Basics"
subtitle: "Instructor-Led Training"
author: "Rajesh Kumar"
format:
  revealjs:
    theme: simple
    slide-number: true
    transition: fade
    incremental: false
---

# Kubernetes Basics

## Learning Objectives

By the end of this session, you will understand:

- What Kubernetes is
- Why Kubernetes is used
- Key Kubernetes resources
- Basic kubectl commands

---

## What is Kubernetes?

Kubernetes is a container orchestration platform.

It helps automate:

- Deployment
- Scaling
- Networking
- Self-healing
- Rollouts and rollbacks

---

## Why Kubernetes?

:::: {.columns}

::: {.column width="50%"}
### Before Kubernetes

- Manual deployments
- Hard scaling
- No standard scheduling
- Complex recovery
:::

::: {.column width="50%"}
### With Kubernetes

- Automated scheduling
- Declarative deployment
- Self-healing
- Easy scaling
:::

::::

---

## Common Commands

```bash
kubectl get nodes
kubectl get pods -A
kubectl get deployments -A
kubectl get svc -A
Code language: PHP (php)

Speaker Notes Example

This slide is visible to students.

::: {.notes}
Explain that Kubernetes is not just a container runner.
It is a platform for managing containerized workloads across a cluster.
:::

Summary

Kubernetes manages containers
Pods are the smallest deployable unit
Deployments manage application rollout
Services expose applications
EOF


Preview:

```bash
quarto preview kubernetes-basics.qmd
Code language: JavaScript (javascript)

Render:

quarto render kubernetes-basics.qmd --to revealjs
Code language: CSS (css)

Quarto reveal.js supports incremental lists, multiple columns, speaker notes, footers/logos, line highlighting, executable code, tabsets, and slide backgrounds. (Quarto)

12. Add images in Quarto slides

Create an images folder:

mkdir -p images

Put images inside:

images/
├── openshift-architecture.png
├── kubernetes-architecture.png
└── devopsschool-logo.png

Use image:

## OpenShift Architecture

![](images/openshift-architecture.png)
Code language: PHP (php)

Image with alt text:

![OpenShift Architecture Diagram](images/openshift-architecture.png)

Image with width:

![](images/openshift-architecture.png){width="80%"}
Code language: JavaScript (javascript)

Image centered:

::: {.center}
![](images/openshift-architecture.png){width="75%"}
:::
Code language: JavaScript (javascript)

13. Add logo and footer

Use this in YAML:

---
title: "OpenShift Training"
format:
  revealjs:
    theme: simple
    slide-number: true
    logo: images/devopsschool-logo.png
    footer: "DevOpsSchool"
---
Code language: JavaScript (javascript)

Quarto reveal.js supports logo and footer options. (Quarto)

14. Add background images

Example:

## OpenShift Platform {background-image="images/openshift-bg.png"}

- Enterprise Kubernetes
- Built-in security
- Developer experience
Code language: PHP (php)

Background color:

## Important Concept {background-color="#f5f5f5"}

This slide has a background color.
Code language: PHP (php)

Title slide background:

---
title: "OpenShift Training"
format:
  revealjs:
    theme: simple
title-slide-attributes:
  data-background-image: images/title-bg.png
  data-background-size: cover
  data-background-opacity: "0.5"
---
Code language: JavaScript (javascript)

Quarto reveal.js supports background color, gradient, image, video, and iframe backgrounds. (Quarto)

15. Incremental bullets

Globally enable incremental bullets:

---
format:
  revealjs:
    incremental: true
---
Code language: JavaScript (javascript)

Only one list incremental:

::: {.incremental}
- First point
- Second point
- Third point
:::

Force non-incremental:

::: {.nonincremental}
- Show all at once
- No step-by-step reveal
:::

Pause inside slide:

## Step-by-step Flow

Step 1: Developer pushes code.

. . .

Step 2: CI pipeline builds image.

. . .

Step 3: Kubernetes deploys app.
Code language: PHP (php)

16. Two-column layout

## Kubernetes vs OpenShift

:::: {.columns}

::: {.column width="50%"}
### Kubernetes

- Open-source orchestration
- Flexible
- Requires integrations
:::

::: {.column width="50%"}
### OpenShift

- Enterprise Kubernetes
- Built-in tools
- Opinionated security
:::

::::
Code language: PHP (php)

17. Tables

## Kubernetes vs OpenShift

| Area | Kubernetes | OpenShift |
|---|---|---|
| Type | Container orchestration | Enterprise Kubernetes platform |
| Security | Configurable | Strong defaults |
| Developer tools | External | Built-in |
| Registry | External | Integrated |
| Routes | Not native | Built-in |
Code language: PHP (php)

18. Code blocks

Static code block:

```bash
kubectl get pods -A
oc get routes -A
```
Code language: JavaScript (javascript)

YAML code block:

```yaml
apiVersion: v1
kind: Pod
metadata:
  name: nginx
spec:
  containers:
    - name: nginx
      image: nginx
```
Code language: JavaScript (javascript)

Line numbers:

```{.yaml code-line-numbers="1-4"}
apiVersion: v1
kind: Pod
metadata:
  name: nginx
```
Code language: JavaScript (javascript)

Progressive line highlighting:

```{.yaml code-line-numbers="|1|2|3-4"}
apiVersion: v1
kind: Pod
metadata:
  name: nginx
```
Code language: JavaScript (javascript)

Quarto reveal.js supports line highlighting for code blocks, including progressive highlighting. (Quarto)

19. Speaker notes

## What is OpenShift?

OpenShift is Red Hat’s enterprise Kubernetes platform.

::: {.notes}
Explain that OpenShift is Kubernetes plus enterprise capabilities:
security, operators, registry, routes, monitoring, and developer tools.
:::
Code language: PHP (php)

Presenter view:

Press S during reveal.js presentation
Code language: CSS (css)

Basic reveal.js navigation includes arrow keys, space, N, P, and fullscreen with F; Quarto’s presenting docs also describe speaker view, navigation menu, overview mode, printing to PDF, drawing/chalkboard, and multiplex presentation features. (Quarto)

20. Render command examples

Render based on YAML format

quarto render course.qmd
Code language: CSS (css)

Render to reveal.js

quarto render course.qmd --to revealjs
Code language: CSS (css)

Render to HTML document

quarto render course.qmd --to html
Code language: CSS (css)

Render to PowerPoint

quarto render course.qmd --to pptx
Code language: CSS (css)

Render to Word

quarto render course.qmd --to docx
Code language: CSS (css)

Render to PDF

quarto render course.qmd --to pdf
Code language: CSS (css)

Render to Beamer PDF slides

quarto render course.qmd --to beamer
Code language: CSS (css)

Render to Typst PDF document

quarto render course.qmd --to typst
Code language: CSS (css)

Render with output name

quarto render course.qmd --to revealjs --output openshift-training.html
Code language: CSS (css)

Render to output directory

quarto render course.qmd --to revealjs --output-dir output/html
quarto render course.qmd --to pptx --output-dir output/pptx
quarto render course.qmd --to pdf --output-dir output/pdf

21. Preview command examples

Preview file:

quarto preview course.qmd
Code language: CSS (css)

Preview on specific port:

quarto preview course.qmd --port 7777
Code language: CSS (css)

Preview without opening browser:

quarto preview course.qmd --no-browser
Code language: CSS (css)

Preview without watching input changes:

quarto preview course.qmd --no-watch-inputs
Code language: CSS (css)

Preview and bind to all interfaces:

quarto preview course.qmd --host 0.0.0.0 --port 7777
Code language: CSS (css)

Preview a project:

quarto preview

The preview command renders and previews a document or website project, automatically reloading the browser when input files or resources like CSS change. (Quarto)

22. Create a Quarto project

For one-off slides, you can use a single .qmd file.

For course automation, use a project.

Create website project:

quarto create project website openshift-course
cd openshift-course

Create book project:

quarto create project book openshift-book
cd openshift-book

Create default project interactively:

quarto create project

Quarto websites are designed for publishing groups of documents with shared navigation, rendering options, and visual style; they can be published to GitHub Pages, Netlify, Posit Connect, or other static hosting/intranet options. (Quarto)

23. Recommended course project structure

For your training/course business:

openshift-course/
├── _quarto.yml
├── slides/
│   ├── 01-introduction.qmd
│   ├── 02-architecture.qmd
│   ├── 03-installation.qmd
│   └── 04-lifecycle.qmd
├── notes/
│   ├── 01-introduction.qmd
│   └── 02-architecture.qmd
├── labs/
│   ├── lab-01-login-cli.qmd
│   └── lab-02-deploy-app.qmd
├── images/
│   ├── devopsschool-logo.png
│   ├── openshift-architecture.png
│   └── lifecycle.png
├── css/
│   └── reveal.scss
├── templates/
│   └── devopsschool-reference.pptx
├── output/
│   ├── html/
│   ├── pdf/
│   └── pptx/
└── build.sh

24. `_quarto.yml` project config for slides

Create _quarto.yml:

project:
  title: "OpenShift Course"
  output-dir: output

format:
  revealjs:
    theme: [simple, css/reveal.scss]
    slide-number: true
    transition: slide
    logo: images/devopsschool-logo.png
    footer: "DevOpsSchool"
    code-line-numbers: true

execute:
  freeze: auto
Code language: JavaScript (javascript)

Then render project:

quarto render

Preview project:

quarto preview

25. Create custom CSS for reveal.js

Create:

mkdir -p css
cat > css/reveal.scss <<'EOF'
/*-- scss:defaults --*/

$presentation-heading-color: #1f2937;
$presentation-font-size-root: 32px;

/*-- scss:rules --*/

.reveal .slide-logo {
  max-height: 48px !important;
}

.reveal h1,
.reveal h2 {
  font-weight: 700;
}

.reveal code {
  font-size: 0.85em;
}
EOF
Code language: PHP (php)

Use in YAML:

format:
  revealjs:
    theme: [simple, css/reveal.scss]
Code language: CSS (css)

26. Build script for your current two files

For your ~/slides folder:

cd ~/slides
cat > build-quarto.sh <<'EOF'
#!/usr/bin/env bash
set -euo pipefail

QMD="Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd"

mkdir -p output/quarto/html output/quarto/pptx output/quarto/pdf

echo "Checking Quarto..."
quarto --version
quarto check

echo "Rendering reveal.js HTML..."
quarto render "$QMD" --to revealjs --output-dir output/quarto/html

echo "Rendering PowerPoint..."
quarto render "$QMD" --to pptx --output-dir output/quarto/pptx

echo "Rendering PDF..."
quarto render "$QMD" --to pdf --output-dir output/quarto/pdf

echo "Done."
find output/quarto -maxdepth 3 -type f -print
EOF

chmod +x build-quarto.sh
./build-quarto.sh
Code language: PHP (php)

27. Build script for multiple `.qmd` files

cat > build-all-quarto.sh <<'EOF'
#!/usr/bin/env bash
set -euo pipefail

mkdir -p output/html output/pptx output/pdf

for QMD in *.qmd; do
  echo "Building $QMD"

  echo "HTML reveal.js..."
  quarto render "$QMD" --to revealjs --output-dir output/html

  echo "PPTX..."
  quarto render "$QMD" --to pptx --output-dir output/pptx

  echo "PDF..."
  quarto render "$QMD" --to pdf --output-dir output/pdf
done

echo "All Quarto files built."
find output -type f -print
EOF

chmod +x build-all-quarto.sh
./build-all-quarto.sh
Code language: PHP (php)

28. Install dependencies for PDF and browser export

Install TinyTeX for LaTeX-based PDF:

quarto install tinytex

Install Chrome Headless Shell:

quarto install chrome-headless-shell

Install Chromium legacy option:

quarto install chromium

Install VeraPDF for PDF standards/accessibility validation:

quarto install verapdf

List tools:

quarto tools

The quarto install command installs global dependencies such as TinyTeX, Chromium, Chrome Headless Shell, and VeraPDF. (Quarto)

29. Working with PowerPoint output

Create a PowerPoint output:

quarto render course.qmd --to pptx
Code language: CSS (css)

Use a custom PowerPoint template:

format:
  pptx:
    reference-doc: templates/devopsschool-reference.pptx

Then:

quarto render course.qmd --to pptx
Code language: CSS (css)

Recommended PPTX workflow:

Create clean PPTX reference template
Use it in Quarto
Generate PPTX
Open in PowerPoint
Do final polish only if required
Code language: PHP (php)

30. Working with PDF output

Option A: LaTeX PDF

Install TinyTeX:

quarto install tinytex

YAML:

format: pdf
Code language: HTTP (http)

Render:

quarto render course.qmd --to pdf
Code language: CSS (css)

Option B: Typst PDF

YAML:

format: typst
Code language: HTTP (http)

Render:

quarto render course.qmd --to typst
Code language: CSS (css)

Option C: reveal.js print-to-PDF

Render reveal.js:

quarto render course.qmd --to revealjs
Code language: CSS (css)

Open the HTML presentation in browser and use print/PDF mode.

For reveal.js presentations, Quarto docs note that reveal.js slides can be presented as HTML or printed to PDF for easier distribution. (Quarto)

31. Share HTML slides properly

When Quarto creates reveal.js slides, output may include supporting files.

So instead of sharing only one .html file, share the whole output folder unless you configure embedded resources.

Recommended:

quarto render course.qmd --to revealjs --output-dir output/html

Then share:

output/html/

For website publishing, publish the full site/project output.

32. Create self-contained HTML

Try this YAML for standalone HTML-style sharing:

format:
  revealjs:
    embed-resources: true
Code language: JavaScript (javascript)

Then:

quarto render course.qmd --to revealjs
Code language: CSS (css)

For large courses with images/videos, I still prefer sharing the full output folder or hosting the slides online.

33. Publish Quarto project

Interactive publish:

quarto publish

Publish a document:

quarto publish course.qmd
Code language: CSS (css)

Publish to GitHub Pages:

quarto publish gh-pages

Publish to Netlify:

quarto publish netlify

Publish to Quarto Pub:

quarto publish quarto-pub

Publish without rendering again:

quarto publish gh-pages --no-render

Quarto publish supports providers including Quarto Pub, GitHub Pages, Posit Connect, Posit Connect Cloud, Netlify, Confluence, and Hugging Face Spaces. (Quarto)

34. Create a Quarto website for courses

Create project:

quarto create project website devopsschool-slides
cd devopsschool-slides

Example _quarto.yml:

project:
  type: website
  output-dir: _site

website:
  title: "DevOpsSchool Course Slides"
  navbar:
    left:
      - href: index.qmd
        text: Home
      - href: openshift.qmd
        text: OpenShift
      - href: kubernetes.qmd
        text: Kubernetes
      - href: terraform.qmd
        text: Terraform

format:
  html:
    theme: cosmo
    toc: true
Code language: CSS (css)

Create homepage:

cat > index.qmd <<'EOF'
---
title: "DevOpsSchool Course Slides"
---

# Welcome

This site contains automated training slides, notes, and course handouts.

## Courses

- OpenShift
- Kubernetes
- Docker
- Terraform
- Ansible
EOF
Code language: PHP (php)

Preview:

quarto preview

Render:

quarto render

35. Create course notes/handouts

Create:

cat > openshift-notes.qmd <<'EOF'
---
title: "OpenShift Training Notes"
author: "Rajesh Kumar"
format:
  html:
    toc: true
  pdf:
    toc: true
---

# Introduction

OpenShift is Red Hat's enterprise Kubernetes platform.

# Key Concepts

## Project

A project is OpenShift's enhanced namespace concept.

## Route

A route exposes a service externally.

# Commands

```bash
oc login
oc get projects
oc new-project demo

EOF


Render HTML:

```bash
quarto render openshift-notes.qmd --to html
Code language: JavaScript (javascript)

Render PDF:

quarto render openshift-notes.qmd --to pdf
Code language: CSS (css)

36. Use code execution with Python

Install Jupyter support:

python3 -m pip install jupyter matplotlib pandas plotly

Create:

cat > python-demo.qmd <<'EOF'
---
title: "Python Demo in Quarto"
format: html
execute:
  echo: true
---

# Python Example

```{python}
import pandas as pd

df = pd.DataFrame({
    "Tool": ["Quarto", "Marp", "PowerPoint"],
    "Automation": ["High", "Medium", "Low"]
})

df
Code language: PHP (php)

EOF


Render:

```bash
quarto render python-demo.qmd
Code language: JavaScript (javascript)

Quarto supports embedding code/output from Python, R, Julia, and JavaScript. (GitHub)

37. Use code execution options

In YAML:

execute:
  echo: true
  warning: false
  message: false
Code language: PHP (php)

Per code cell:

```{python}
#| echo: true
#| warning: false
#| message: false

print("Hello Quarto")
```
Code language: PHP (php)

Render without executing code:

quarto render python-demo.qmd --no-execute
Code language: CSS (css)

Render and execute code:

quarto render python-demo.qmd --execute
Code language: CSS (css)

Pass execution parameter:

quarto render report.qmd -P environment:prod
Code language: CSS (css)

38. Use parameters

Create:

cat > param-demo.qmd <<'EOF'
---
title: "Parameterized Course"
format: html
params:
  course_name: "OpenShift"
  instructor: "Rajesh Kumar"
---

# Course: `r params$course_name`

Instructor: `r params$instructor`
EOF
Code language: PHP (php)

For Python/Jupyter style parameter use, parameter workflows depend on engine. For practical slide decks, I usually recommend using YAML variables or template generation from shell/Python.

Render with metadata:

quarto render param-demo.qmd -M title:"OpenShift Course"
Code language: CSS (css)

39. Project profiles

Use profiles for different outputs/environments.

Example files:

_quarto.yml
_quarto-dev.yml
_quarto-prod.yml
Code language: CSS (css)

Render with profile:

quarto render --profile dev
quarto render --profile prod

Good for:

student version
instructor version
client version
public version
internal version
Code language: PHP (php)

40. Useful `quarto inspect`

Inspect a file:

quarto inspect course.qmd
Code language: CSS (css)

Inspect project:

quarto inspect

Use this when:

YAML output not behaving
format not applied
project config not loaded
wrong output directory

41. Useful `quarto tools`

quarto tools

Use it to see installed dependencies/tools.

42. Useful `quarto check`

quarto check

Use it after install or troubleshooting.

43. Useful `quarto pandoc`

Check bundled Pandoc:

quarto pandoc --version

Convert Markdown using bundled Pandoc:

quarto pandoc input.md -o output.html
Code language: CSS (css)

44. Useful `quarto typst`

Check Typst:

quarto typst --version

45. Extensions

Add extension:

quarto add extension-name

Remove extension:

quarto remove extension-name

Update extension:

quarto update extension-name

List:

quarto list
Code language: PHP (php)

46. Recommended DevOpsSchool slide template

Create:

mkdir -p ~/slides/quarto-template/images ~/slides/quarto-template/css
cd ~/slides/quarto-template
Code language: JavaScript (javascript)

Create CSS:

cat > css/devopsschool.scss <<'EOF'
/*-- scss:defaults --*/
$presentation-heading-color: #1f2937;
$presentation-font-size-root: 32px;

/*-- scss:rules --*/
.reveal h1 {
  font-weight: 800;
}

.reveal h2 {
  border-bottom: 2px solid #e5e7eb;
  padding-bottom: 0.2em;
}

.reveal code {
  font-size: 0.85em;
}
EOF
Code language: PHP (php)

Create slide:

cat > course-template.qmd <<'EOF'
---
title: "Course Title"
subtitle: "DevOpsSchool Training"
author: "Rajesh Kumar"
format:
  revealjs:
    theme: [simple, css/devopsschool.scss]
    slide-number: true
    transition: slide
    footer: "DevOpsSchool"
---

# Course Title

## Learning Objectives

- Understand the topic
- Learn architecture
- Practice commands
- Troubleshoot issues

---

# What, Why, Where, When, How

## What is this?

Short definition.

## Why is it needed?

- Reason 1
- Reason 2
- Reason 3

---

## Architecture

![](images/architecture.png){width="80%"}

---

## Hands-on Commands

```bash
command-1
command-2
command-3
Code language: PHP (php)

Troubleshooting

Issue	Cause	Fix
Error 1	Reason	Solution
Error 2	Reason	Solution

Summary

Key point 1
Key point 2
Key point 3
EOF


Preview:

```bash
quarto preview course-template.qmd
Code language: JavaScript (javascript)

47. Full command cheat sheet

# Version and health
quarto --version
quarto check
quarto tools

# Render
quarto render file.qmd
quarto render file.qmd --to html
quarto render file.qmd --to revealjs
quarto render file.qmd --to pptx
quarto render file.qmd --to pdf
quarto render file.qmd --to docx
quarto render file.qmd --output custom-name.html
quarto render file.qmd --output-dir output/html

# Preview
quarto preview file.qmd
quarto preview file.qmd --port 7777
quarto preview file.qmd --no-browser
quarto preview file.qmd --host 0.0.0.0
quarto preview file.qmd --no-watch-inputs

# Project
quarto create project
quarto create project website mysite
quarto create project book mybook
quarto render
quarto preview

# Dependencies
quarto install tinytex
quarto install chrome-headless-shell
quarto install chromium
quarto install verapdf

# Publish
quarto publish
quarto publish gh-pages
quarto publish netlify
quarto publish quarto-pub
quarto publish file.qmd

# Debug/inspect
quarto inspect
quarto inspect file.qmd
quarto pandoc --version
quarto typst --version

# Extensions
quarto add extension-name
quarto remove extension-name
quarto update extension-name
quarto list
Code language: PHP (php)

48. Your exact commands now

Run this on your Mac:

cd ~/slides

# Install Quarto if not installed
brew install --cask quarto

# Verify
quarto --version
quarto check

# Preview your existing Quarto file
quarto preview Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd

# Render HTML reveal.js slides
quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to revealjs

# Render PPTX
quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to pptx

# Install PDF dependency if needed
quarto install tinytex

# Render PDF
quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to pdf

# Check generated files
ls -lh
find . -maxdepth 3 -type f \( -name "*.html" -o -name "*.pptx" -o -name "*.pdf" \) -print
Code language: PHP (php)

49. Best folder structure for your current testing

cd ~/slides

mkdir -p images css output/html output/pdf output/pptx templates

ls -lh

Recommended:

slides/
├── Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd
├── images/
├── css/
├── templates/
└── output/
    ├── html/
    ├── pdf/
    └── pptx/

50. Best build script for your current file

cd ~/slides

cat > build.sh <<'EOF'
#!/usr/bin/env bash
set -euo pipefail

QMD="Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd"

mkdir -p output/html output/pptx output/pdf

echo "Quarto version:"
quarto --version

echo "Rendering HTML reveal.js..."
quarto render "$QMD" --to revealjs --output-dir output/html

echo "Rendering PPTX..."
quarto render "$QMD" --to pptx --output-dir output/pptx

echo "Rendering PDF..."
quarto render "$QMD" --to pdf --output-dir output/pdf

echo "Generated files:"
find output -type f -print
EOF

chmod +x build.sh
./build.sh
Code language: PHP (php)

51. Troubleshooting

Problem: `quarto: command not found`

macOS:

which quarto
echo $PATH
brew reinstall --cask quarto
quarto --version
Code language: PHP (php)

Try a new terminal window.

Windows:

where.exe quarto
quarto --version
Code language: CSS (css)

Restart PowerShell after installation.

Linux:

which quarto
quarto --version

Problem: PDF fails

Install TinyTeX:

quarto install tinytex

Then:

quarto render file.qmd --to pdf
Code language: CSS (css)

Problem: reveal.js PDF does not match HTML

Use browser print mode from reveal.js HTML, or simplify slide-specific effects.

Problem: images do not show

Check:

pwd
ls -lh images/

Use relative path:

![](images/my-image.png)

Avoid absolute path:

![](/Users/rajesh/Desktop/my-image.png)
Code language: JavaScript (javascript)

Problem: YAML error

YAML is indentation-sensitive.

Bad:

format:
revealjs:
theme: simple

Good:

format:
  revealjs:
    theme: simple

Problem: preview port busy

Use another port:

quarto preview file.qmd --port 7777
Code language: CSS (css)

Problem: browser does not open

quarto preview file.qmd --no-browser
Code language: CSS (css)

Then copy the local preview URL from terminal.

Problem: PPTX output looks different

That is normal. HTML/reveal.js and PPTX are different formats.

Fixes:

Use simpler layouts
Avoid complex reveal.js-only features
Use a PowerPoint reference template
Test PPTX early
Use standard fonts
Code language: CSS (css)

Problem: code execution fails

Check Python/Jupyter:

python3 --version
python3 -m pip install jupyter

Check Quarto:

quarto check

52. Best practice for educator automation

Use this rule:

One source file: .qmd
Local images: images/
Branding: css/ and templates/
Automation: build.sh
Outputs: html/pdf/pptx
Version control: git

Recommended daily workflow:

cd ~/slides

# edit file
code Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd

# preview while editing
quarto preview Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd

# build all outputs
./build.sh

# check output
find output -type f -print
Code language: PHP (php)

53. Final recommended command sequence for you

Run this first:

cd ~/slides
brew install --cask quarto
quarto --version
quarto check
quarto preview Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd

Then generate all outputs:

mkdir -p output/html output/pptx output/pdf

quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to revealjs --output-dir output/html
quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to pptx --output-dir output/pptx

quarto install tinytex
quarto render Introduction_to_Red_Hat_OpenShift_DevOpsSchool.qmd --to pdf --output-dir output/pdf

find output -type f -print
Code language: PHP (php)

For your long-term course automation, use:

Quarto as master system
.qmd as source
reveal.js as main slide output
PDF as student handout
PPTX as client/trainer output
build.sh for automation
Git for version control
Code language: JavaScript (javascript)

That is the cleanest Quarto workflow for you.

Rajesh Kumar

I’m a DevOps/SRE/DevSecOps/Cloud Expert passionate about sharing knowledge and experiences. I have worked at Cotocus. I share tech blog at DevOps School, travel stories at Holiday Landmark, stock market tips at Stocks Mantra, health and fitness guidance at My Medic Plus, product reviews at TrueReviewNow , and SEO strategies at Wizbrand.

Do you want to learn Quantum Computing?

Please find my social handles as below;

Rajesh Kumar Personal Website
Rajesh Kumar at YOUTUBE
Rajesh Kumar at INSTAGRAM
Rajesh Kumar at X
Rajesh Kumar at FACEBOOK
Rajesh Kumar at LINKEDIN
Rajesh Kumar at WIZBRAND

Rajesh Kumar DailyLogs

Find Trusted Cardiac Hospitals

Compare heart hospitals by city and services — all in one place.

Explore Hospitals

Find the Best Cosmetic Hospitals

1. What you are going to build

2. Install Quarto on macOS

Option A: Install using Homebrew

Option B: Install manually

Option C: Install Homebrew first, then Quarto

3. Install Quarto on Windows

4. Install Quarto on Linux

5. Install recommended editor support

VS Code

6. First Quarto commands to run

7. Most important Quarto commands

8. Create your first simple Quarto slide file

Summary

9. Basic Quarto file structure

10. How slides are created in Quarto

11. Reveal.js slide deck example for educators

Speaker Notes Example

Summary

12. Add images in Quarto slides

13. Add logo and footer

14. Add background images

15. Incremental bullets

16. Two-column layout

17. Tables

18. Code blocks

19. Speaker notes

20. Render command examples

Render based on YAML format

Render to reveal.js

Render to HTML document

Render to PowerPoint

Render to Word

Render to PDF

Render to Beamer PDF slides

Render to Typst PDF document

Render with output name

Render to output directory

21. Preview command examples

22. Create a Quarto project

23. Recommended course project structure

24. _quarto.yml project config for slides

25. Create custom CSS for reveal.js

26. Build script for your current two files

27. Build script for multiple .qmd files

28. Install dependencies for PDF and browser export

29. Working with PowerPoint output

30. Working with PDF output

Option A: LaTeX PDF

Option B: Typst PDF

Option C: reveal.js print-to-PDF

31. Share HTML slides properly

32. Create self-contained HTML

33. Publish Quarto project

34. Create a Quarto website for courses

35. Create course notes/handouts

36. Use code execution with Python

37. Use code execution options

38. Use parameters

39. Project profiles

40. Useful quarto inspect

41. Useful quarto tools

42. Useful quarto check

43. Useful quarto pandoc

44. Useful quarto typst

45. Extensions

46. Recommended DevOpsSchool slide template

Troubleshooting

Summary

47. Full command cheat sheet

48. Your exact commands now

49. Best folder structure for your current testing

50. Best build script for your current file

51. Troubleshooting

Problem: quarto: command not found

Problem: PDF fails

Problem: reveal.js PDF does not match HTML

Problem: images do not show

Problem: YAML error

Problem: preview port busy

24. `_quarto.yml` project config for slides

27. Build script for multiple `.qmd` files

40. Useful `quarto inspect`

41. Useful `quarto tools`

42. Useful `quarto check`

43. Useful `quarto pandoc`

44. Useful `quarto typst`

Problem: `quarto: command not found`