Lab: Create your own website!
Basic structure of Quarto document
We are going to create a website using a Quarto. Quarto documents are a mix of natural language and executed code and this pattern is called literate programming. A Quarto document usually contains:
- Text formatted in Markdown.
- Code is fenced as code chunk between
```{r}
and```
. - Metadata as YAML with the format
key: value
. You can find metadata in the header of the document fenced by---
, or in code chunks starting with#|
.
---
title: "Untitled"
format: html
---
## Quarto
Quarto enables you to weave together content and executable code into<https://quarto.org>.
a finished document. To learn more about Quarto see
```{r}
#| label: calculation
1 + 1
```
Steps
- Open your workspace: bit.ly/td-workspace.
- Create
index.qmd
. - Click the “Render” button on top.
- Download the output directory
_site
. - Open Netlify Drop: app.netlify.com/drop.
- Drag and drop the downloaded
_site
onto Netlify Drop. - Post the link to your website in the comments below or on our Padlet: bit.ly/td-padlet
Resources
- Daring Fireball: Markdown
- Interactive Commonmark Markdown tutorial
- Quarto documentation
- Get started with Quarto Workshop including the material and this video: