第3讲 rmarkdown 与 Quarto

class: center, middle, inverse, title-slide

.title[
# 量化金融与金融编程
]
.subtitle[
## L03 <code>rmarkdown</code> 与 Quarto | 课前预习
]
.author[
### <br>曾永艺
]
.institute[
### 厦门大学管理学院
]
.date[
### <br>2023-10-06
]

---

class: inverse, center, middle, hide_logo
background-image: url(imgs/logo-quarto.png)
background-size: 5.5em
background-position: 15% 50%

<div>
<style type="text/css">.xaringan-extra-logo {
width: 50px;
height: 50px;
z-index: 0;
background-image: url(imgs/logo-sm.png);
background-size: contain;
background-repeat: no-repeat;
position: absolute;
top:0.5em;right:0.5em;
}
</style>
<script>(function () {
  let tries = 0
  function addLogo () {
    if (typeof slideshow === 'undefined') {
      tries += 1
      if (tries < 10) {
        setTimeout(addLogo, 100)
      }
    } else {
      document.querySelectorAll('.remark-slide-content:not(.title-slide):not(.inverse):not(.hide_logo)')
        .forEach(function (slide) {
          const logo = document.createElement('a')
          logo.classList = 'xaringan-extra-logo'
          logo.href = 'https://qfwr2022.netlify.app'
          slide.appendChild(logo)
        })
    }
  }
  document.addEventListener('DOMContentLoaded', addLogo)
})()</script>
</div>

# 1. Quarto 概览

---
layout: true
background-image: url(imgs/logo-quarto2.png)
background-size: 7.5em
background-position: 8.5% 5%

### [{{&emsp;&emsp;&emsp;&emsp;&emsp;&nbsp;&nbsp;<sup>.font70[1.3.433]</sup>}}](https://quarto.org/)

---

> .font110.bold[_Open source tools for scientific and technical publishing_]

.font50[<br>]

.font120.bold[

- Author using [Jupyter](https://jupyter.org/) notebooks or with plain text markdown in your favorite editor.

- Create dynamic content with Python, R, Julia, and Observable.

- Publish reproducible, production quality articles, presentations, websites, blogs, and books in HTML, PDF, MS Word, ePub, and more.

- Write using [Pandoc](https://pandoc.org/) markdown, including equations, citations, crossrefs, figure panels, callouts, advanced layout, and more.

- Share knowledge and insights organization-wide by publishing to Posit Connect, Confluence, or other publishing systems.

]

---

> .font110.bold[_Open source tools for scientific and technical publishing_]

---
layout: false
class: inverse, center, middle, hide_logo
background-image: url(imgs/logo-quarto.png)
background-size: 5.5em
background-position: 15% 50%

# 2. Quarto 动态文档构成

---
layout: true

### >> YAML 文件头

---

.font110[
- YAML 文件头处于两个 `---` 之间
- [YAML](https://yaml.org/)：_YAML Ain't Markup Language_，易于读写的层次化数据
- Quarto 使用 YAML 文件头来提供 metadata 以及控制渲染和样式等方面的参数
]

.pull-left.code100[
```yaml
---
title: "Penguins, meet Quarto!"
subtitle: 企鹅遇上Quarto！💘
author: "曾永艺"
date: today
format: 
  html:
    toc: true
    code-fold: true
editor: visual
---
```
]

.pull-right.font120[

<br>

- [{{一文看懂 YAML}}](https://zhuanlan.zhihu.com/p/145173920) 🎯

- [{{Quarto HTML Options}}](https://quarto.org/docs/reference/formats/html.html)

- **RStudio**'s [{{YAML Intelligence}}](https://quarto.org/docs/tools/rstudio.html#yaml-intelligence)

]

---
layout: true

### >> Markdown 文本 .font80[&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; .red[[{{rstudio-visual-markdown-editing}}](https://rstudio.github.io/visual-markdown-editing/)] 🤩]

---

.font110[
- 用 [.bold[{{扩展的 Markdown 语法}}]](https://qfwr2023.netlify.app/readings/markdown-basics.html)  <svg aria-hidden="true" role="img" viewBox="0 0 640 512" style="height:1em;width:1.25em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:currentColor;overflow:visible;position:relative;"><path d="M593.8 59.1H46.2C20.7 59.1 0 79.8 0 105.2v301.5c0 25.5 20.7 46.2 46.2 46.2h547.7c25.5 0 46.2-20.7 46.1-46.1V105.2c0-25.4-20.7-46.1-46.2-46.1zM338.5 360.6H277v-120l-61.5 76.9-61.5-76.9v120H92.3V151.4h61.5l61.5 76.9 61.5-76.9h61.5v209.2zm135.3 3.1L381.5 256H443V151.4h61.5V256H566z"/></svg> 来写说明性文本（<svg aria-hidden="true" role="img" viewBox="0 0 640 512" style="height:1em;width:1.25em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:currentColor;overflow:visible;position:relative;"><path d="M593.8 59.1H46.2C20.7 59.1 0 79.8 0 105.2v301.5c0 25.5 20.7 46.2 46.2 46.2h547.7c25.5 0 46.2-20.7 46.1-46.1V105.2c0-25.4-20.7-46.1-46.2-46.1zM338.5 360.6H277v-120l-61.5 76.9-61.5-76.9v120H92.3V151.4h61.5l61.5 76.9 61.5-76.9h61.5v209.2zm135.3 3.1L381.5 256H443V151.4h61.5V256H566z"/></svg>是用来格式化纯文本文件的轻量级语法，其设计哲学就是使得文本既容易写又容易读）。
]

---
layout: true

### >> 代码块

---

.font100[
1. 插入代码块：使用快捷键 .kbd[Ctrl+Alt+I]（也可使用编辑器工具栏上的 Insert 按钮 或者 手工输入代码段标记符```` ```{r} ```` 和```` ``` ````）
2. 设置代码块标签名和[{{代码块选项}}](https://quarto.org/docs/reference/cells/cells-knitr.html)（也可在通过 `knitr::opts_chunk$set()` 或者 YAML 文件头设置全局选项——当同个选项多处设置时，局部设置优先），善用RStudio**智能补全**功能
3. 编写 <svg aria-hidden="true" role="img" viewBox="0 0 581 512" style="height:1em;width:1.13em;vertical-align:-0.125em;margin-left:auto;margin-right:auto;font-size:inherit;fill:currentColor;overflow:visible;position:relative;"><path d="M581 226.6C581 119.1 450.9 32 290.5 32S0 119.1 0 226.6C0 322.4 103.3 402 239.4 418.1V480h99.1v-61.5c24.3-2.7 47.6-7.4 69.4-13.9L448 480h112l-67.4-113.7c54.5-35.4 88.4-84.9 88.4-139.7zm-466.8 14.5c0-73.5 98.9-133 220.8-133s211.9 40.7 211.9 133c0 50.1-26.5 85-70.3 106.4-2.4-1.6-4.7-2.9-6.4-3.7-10.2-5.2-27.8-10.5-27.8-10.5s86.6-6.4 86.6-92.7-90.6-87.9-90.6-87.9h-199V361c-74.1-21.5-125.2-67.1-125.2-119.9zm225.1 38.3v-55.6c57.8 0 87.8-6.8 87.8 27.3 0 36.5-38.2 28.3-87.8 28.3zm-.9 72.5H365c10.8 0 18.9 11.7 24 19.2-16.1 1.9-33 2.8-50.6 2.9v-22.1z"/></svg> 代码
4. 运行代码：使用快捷键 .kbd[Ctrl+Shift+Enter] | .kbd[Ctrl+Enter] 或者 点击.green[▶]按钮
]

.font100[
- 行内代码

```r
  这份数据中包含了`r nrow(diamonds)`颗钻石的信息。其中只有`r nrow(diamonds) - nrow(smaller)`颗
钻石大于2.5克拉。其余钻石的分布如下图所示。
```
]

---
layout: false
class: inverse, center, middle, hide_logo
background-image: url(imgs/logo-quarto.png)
background-size: 5.5em
background-position: 10% 50%

# 3. Quarto 工作流

---

### >> 工作流

.pull-left.font100[

1. 创建项目文件夹

2. 打开新的 .qmd 文档：`File > New File > Quarto Document ...`

- **Document** | Presentation | Interactive
    
    - 修改 Title 和 Author，设置输出格式为 **Html**、Engine 为 **Knitr** 等

3. **存盘 ↔ 根据需要编辑修改模板文档**

4. `Render` .qmd 文档，生成目标输出文档

5. 在 RStudio 窗口中预览结果

6. 在 Background Jobs 窗口中检查文档创建过程记录

7. 使用和 .qmd 文档一并存储的目标输出文档

8. 将报告发布到网络服务器（可选步骤）
]

.pull-right[
<br>

]

---
layout: false
class: center middle
background-image: url(imgs/logo-xaringan.png)
background-size: 12%
background-position: 50% 40%

<br><br><br><br><br><br><br>
<hr color='#f00' size='2px' width='80%'>
<br>
.Large.red[_**本网页版讲义的制作由 R 包 [{{`xaringan`}}](https://github.com/yihui/xaringan) 赋能！**_]