-
Notifications
You must be signed in to change notification settings - Fork 2
/
slides.qmd
873 lines (579 loc) · 28.6 KB
/
slides.qmd
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
---
format:
revealjs:
# include-in-header: preview.html
hash-type: number
transition: fade
auto-stretch: false
# embed-resources: true
height: 900
width: 1600
logo: https://www.rstudio.com/assets/img/posit-logo-fullcolor-TM.svg
footer: <a href="https://thomasmock.quarto.pub/python/">thomasmock.quarto.pub/python</a> by [@thomas_mock](https://twitter.com/thomas_mock)
slide-number: c/t
theme: [styles.scss]
jupyter: python3
execute:
freeze: true
---
## {#TitleSlide data-menu-title="TitleSlide" background-color="#303436" background-image="images/hamlet-quarto.jpeg" background-position="left" background-size="contain"}
::: {style="position: absolute; left: 480px; top: 200px; height: 525px; width: 1200px; background-color: #447099; padding: 20px; padding-left: 50px; box-shadow: 15px 15px 0px 0px #EE6331; border-radius: 5px;"}
[Reproducible Publications w/ Python and Quarto]{style="font-size: 80px; font-weight: bold; line-height: 1em; margin: 0px"}
<br>
<div><div style="vertical-align: top; display: inline-block; font-size: 60px; font-weight: bold;">Tom Mock, </div><img src="https://www.rstudio.com/assets/img/posit-logo-white-TM.svg" width=225px style="vertical-align: top; display: inline-block;"></img></div>
{{< fa link >}}</a> <a href="https://thomasmock.quarto.pub/python/" style="font-size: 50px; font-weight: light; font-color: white; color: #f5f5f5;">thomasmock.quarto.pub/python</a>
[2022-12-03]{style="font-size: 50px;font-weight: light;"}
:::
::: footer
[You are sneaky!]{style="color: transparent;"}
:::
## What is Quarto?
<https://quarto.org>
::: {.incremental}
Quarto is an open-source scientific and technical publishing system that builds on standard markdown with features essential for scientific communication.
* Computations: Python, R, Julia, Observable JS
* Markdown: Pandoc flavored markdown with many enhancements
* Output: Documents, presentations, websites, books, blogs
:::
. . .
Literate programming system in the tradition of Org-Mode, Weave.jl, R Markdown, iPyPublish, Jupyter Book, etc.
## Origins
::: {.incremental}
* Open Source project sponsored by Posit, PBC (formerly known as RStudio, PBC)
* 10 years of experience with R Markdown, a similar system that was R-specific, convinced us that the core ideas were sound
* The number of languages and runtimes used for scientific discourse is broad
* Quarto is a ground-up re-imagining of R Markdown that is fundamentally multi-language and multi-engine
* Quarto gets inspiration from both R Markdown and Jupyter, and provides a plain-text option or the use of native Jupyter notebooks
:::
## Goal: Computation document
* Documents that include source code for their production
* Notebook AND plain-text flavors
* Programmatic automation and reproducibility
## Goal: Scientific Markdown
![](images/document-complexity.png){fig-align="center"}
## Goal: Single Source Publishing
![](images/single-source-publish.png){.r-stretch fig-align="center"}
## Simple Example
:::: {.columns}
::: {.column width=50%}
````markdown
---
title: "matplotlib demo"
format:
html:
code-fold: true
jupyter: python3
---
For a demonstration of a line plot on a polar
axis, see @fig-polar.
````
````markdown
```{{python}}
#| label: fig-polar
#| fig-cap: "A line plot on a polar axis"
import numpy as np
import matplotlib.pyplot as plt
r = np.arange(0, 2, 0.01)
theta = 2 * np.pi * r
fig, ax = plt.subplots(
subplot_kw = {'projection': 'polar'}
)
ax.plot(theta, r)
ax.set_rticks([0.5, 1, 1.5, 2])
ax.grid(True)
plt.show()
```
````
:::
::: {.column width=50%}
![](https://quarto.org/images/hello-jupyter.png)
:::
::::
. . .
::: {style="position: absolute; top: 92px; left: 10px; width: 700px; height: 195px; background-color: #44709950; z-index: -1; border-radius: 5px;"}
:::
. . .
::: {style="position: absolute; top: 315px; left: 10px; width: 700px; height: 60px; background-color: #72994E50; z-index: -1; border-radius: 5px;"}
:::
. . .
::: {style="position: absolute; top: 380px; left: 10px; width: 700px; height: 475px; background-color: #EE633150; z-index: -1; border-radius: 5px;"}
:::
## Simple Example, multi-format
<br>
Can be rendered to dozens of output formats with Quarto (via Pandoc):
. . .
::: {style="font-size: 70px;"}
```bash
$ quarto render hello.qmd --to html
$ quarto render hello.qmd --to pdf
$ quarto render hello.qmd --to docx
$ quarto render hello.qmd --to epub
$ quarto render hello.qmd --to pptx
$ quarto render hello.qmd --to revealjs
```
:::
##
:::: {.columns style="margin-top=-20px;"}
::: {.column .fragment style="font-size:30px;"}
+-----------------+----------------------------------------------------------------------------------------------------------+------------------------------------------------------------------------------------+
| Feature | R Markdown | Quarto |
+=================+==========================================================================================================+====================================================================================+
| Basic Formats | - [html_document](https://pkgs.rstudio.com/rmarkdown/reference/html_document.html) | - [html](https://quarto.org/docs/output-formats/html-basics.html) |
| | | |
| | - [pdf_document](https://pkgs.rstudio.com/rmarkdown/reference/pdf_document.html) | - [pdf](https://quarto.org/docs/output-formats/pdf-basics.html) |
| | | |
| | - [word_document](https://pkgs.rstudio.com/rmarkdown/reference/word_document.html) | - [docx](https://quarto.org/docs/output-formats/ms-word.html) |
+-----------------+----------------------------------------------------------------------------------------------------------+------------------------------------------------------------------------------------+
| Beamer | - [beamer_presentation](https://pkgs.rstudio.com/rmarkdown/reference/beamer_presentation.html) | - [beamer](https://quarto.org/docs/presentations/beamer.html) |
+-----------------+----------------------------------------------------------------------------------------------------------+------------------------------------------------------------------------------------+
| PowerPoint | - [powerpoint_presentation](https://pkgs.rstudio.com/rmarkdown/reference/powerpoint_presentation.html) | - [pptx](https://quarto.org/docs/presentations/powerpoint.html) |
+-----------------+----------------------------------------------------------------------------------------------------------+------------------------------------------------------------------------------------+
| HTML Slides | - [xaringan](https://bookdown.org/yihui/rmarkdown/xaringan.html) | - [revealjs](https://quarto.org/docs/presentations/revealjs/) |
| | | |
| | - [revealjs](https://bookdown.org/yihui/rmarkdown/revealjs.html) | |
+-----------------+----------------------------------------------------------------------------------------------------------+------------------------------------------------------------------------------------+
| Advanced Layout | - [tufte](https://bookdown.org/yihui/rmarkdown/tufte-handouts.html) | - [Quarto Article Layout](https://quarto.org/docs/authoring/article-layout.html) |
| | | |
| | - [distill](https://rstudio.github.io/distill/figures.html) | |
+-----------------+----------------------------------------------------------------------------------------------------------+------------------------------------------------------------------------------------+
:::
<!-- ## Many Quarto formats -->
::: {.column .fragment style="font-size:30px;"}
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Feature | R Markdown | Quarto |
+==================+==================================================================================+=================================================================================+
| Cross References | - [html_document2](https://bookdown.org/yihui/bookdown/a-single-document.html) | - [Quarto Crossrefs](https://quarto.org/docs/authoring/cross-references.html) |
| | | |
| | - [pdf_document2](https://bookdown.org/yihui/bookdown/a-single-document.html) | |
| | | |
| | - [word_document2](https://bookdown.org/yihui/bookdown/a-single-document.html) | |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Websites & Blogs | - [blogdown](https://pkgs.rstudio.com/blogdown/) | - [Quarto Websites](https://quarto.org/docs/websites/) |
| | | |
| | - [distill](https://pkgs.rstudio.com/distill/) | - [Quarto Blogs](https://quarto.org/docs/websites/website-blog.html) |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Books | - [bookdown](https://pkgs.rstudio.com/bookdown/) | - [Quarto Books](https://quarto.org/docs/books/) |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Interactivity | [Shiny Documents](https://bookdown.org/yihui/rmarkdown/shiny-documents.html) | [Quarto Interactive Documents](https://quarto.org/docs/interactive/shiny/) |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Paged HTML | [pagedown](https://github.com/rstudio/pagedown) | Coming soon! |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Journal Articles | [rticles](https://pkgs.rstudio.com/rticles/) | Out and more coming! |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
| Dashboards | [flexdashboard](https://pkgs.rstudio.com/flexdashboard/) | Coming soon! |
+------------------+----------------------------------------------------------------------------------+---------------------------------------------------------------------------------+
:::
::::
## So what is Quarto?
> Quarto® is an open-source scientific and technical publishing system built on Pandoc.
. . .
- `quarto` is a language agnostic command line interface (CLI)
::: {style="font-size: 70px;"}
```bash
thomasmock$ quarto --help
```
:::
. . .
::: {style="font-size: 70px;"}
```{python}
#| eval: false
#| echo: true
#| code-line-numbers: "|5|6|7"
Usage: quarto
Version: 1.2.269
Commands:
render [input] [args...] - Render input file(s) to various document types.
preview [file] [args...] - Render and preview a document or website project.
publish [provider] [path] - Publish a document or project.
```
:::
## Basic Workflow
Rendering (execute and write to disk):
```bash
# plain text qmd
$ quarto render python.qmd
$ quarto render python.qmd --to pdf
# ipynb notebook
$ quarto render python.ipynb
$ quarto render python.ipynb --execute
```
. . .
Preview (execute, write to disk, and maintain a LIVE preview of content):
```bash
# plain text qmd
$ quarto preview python.qmd
$ quarto preview python.qmd --to pdf
# ipynb notebook
$ quarto preview python.ipynb
$ quarto preview python.ipynb --execute
```
## IPython
For execution of R, Quarto uses `knitr` as the engine, but for Python Quarto natively executes Python with Jupyter kernels such as IPython.
::: {.incremental}
* The indicated or default Python Jupyter kernel is bound automatically when `{python}` executable cells are present. You can set a specific kernel via the YAML:
::: {.fragment style="font-size: 70px;"}
```yaml
---
title: "My doc"
date: today
jupyter: python3
---
```
:::
* IPython executes Python code and transforms it to plain text, graphics, markdown, HTML, etc.
* For interactive sessions, Quarto keeps the Jupyter Kernel resident as a daemon to mitigate startup times.
:::
## Stored/frozen computation and reproducibility
1. Jupyter natively approaches this as storing the source code, output file, and cache the resulting computation in a single document (`.ipynb` which is JSON)
. . .
2. [Jupyter Cache](https://jupyter-cache.readthedocs.io/en/latest/) provides transient caching of cell outputs for a doc (if any cells in doc change, then all of the cells will be re-executed)
. . .
3. Quarto's [Freeze](https://quarto.org/docs/projects/code-execution.html) feature uses a multi-file approach:
- Source code input (plain text `.qmd` and/or `.ipynb`)
- Complete output file (some format like `.html` or `.pdf`)
- Frozen computation stored separately by directory and file as `.json`, allows for permanately saving and re-use of computational outputs across _entire project_.
## A `.qmd` is a plain text file
. . .
**Metadata (YAML)**
:::: {.columns style="font-size: 60px;"}
::: {.column width="55%"}
``` yaml
format: html
jupyter: python3
```
:::
::: {.column width="44%"}
``` yaml
format: html
engine: knitr
```
:::
::::
. . .
**Code**
:::: {.columns style="font-size: 60px;"}
::: {.column width="55%"}
````code
```{{python}}
from siuba import *
(mtcars
>> group_by(_.cyl)
>> summarize(avg_mpg = _.mpg.mean()))
```
````
:::
:::: {.column width="44%"}
````code
```{{r}}
library(dplyr)
mtcars |>
group_by(cyl) |>
summarize(mean = mean(mpg))
```
````
:::
::::
. . .
**Text**
::: {style="font-size: 70px;"}
``` markdown
# Heading 1
This is a sentence with some **bold text**, some *italic text* and an
![image](image.png){fig-alt="Alt text for this image"}.
```
:::
## But Quarto doesn't _have_ to be plain-text
![](images/jupyter-quarto-preview.png)
## Rendering pipeline
. . .
**Plain text workflow** (`.qmd` uses Jupyter kernel to execute cells):
![](images/qmd-jupyter-pipeline.png)
. . .
**Notebook workflow** (defaults to using existing stored computation):
![](images/jupyter-pipeline.png)
## What to do with my existing `.ipynb`?
. . .
You can keep using them! [You get to choose whether to use the stored computation OR re-execute the document from top to bottom.]{.fragment}
<br>
. . .
::: {style="font-size:75px;"}
``` bash
# --execute flag is optional - forces re-execution
quarto render my-favorite.ipynb --to html --execute
```
:::
. . .
<br>
Quarto can help convert back and forth between plain text `.qmd` and `.ipynb` - kind of like `jupytext` but specific to Quarto:
::: {style="font-size:50px;"}
```bash
quarto convert --help
Usage: quarto convert <input>
Description:
Convert documents to alternate representations.
Convert notebook to markdown: quarto convert doc.ipynb
Convert markdown to notebook: quarto convert doc.qmd
Convert notebook to markdown, write to file: quarto convert doc.ipynb --output doc.qmd
```
:::
## nbdev + Quarto = super powers
![](images/jeremy-howard-quarto.jpg){style="position: absolute; top: 100px; left: 20px; width: 800;" fig-alt="A tweet by Jeremy Howard, FYI nbdev will be moving to Quarto and Fastdoc probably too"}
. . .
![](images/hamel-quarto.jpg){style="position: absolute; top: 100px; left: 20px; width: 800px;" fig-alt="A tweet by Hamel Husain, 'I'm going to be announcing an epic new version of nbdev in tihs talk! The next version of nbdev is going to be built on top of Quarto'"}
## [fast.ai - nbdev+Quarto: A new secret weapon for productivity](https://www.fast.ai/posts/2022-07-28-nbdev2.html#enter-quarto-a-pandoc-super-processor)
:::: {.columns}
::: {.column}
![](images/nbdev-quarto.png)
:::
::: {.column}
![](images/nbdev-diagram.png)
:::
::::
## Comfort of your own workspace
::: r-stack
![](https://quarto.org/docs/tools/images/jupyterlab-preview.png){.fragment width="1700px" fig-alt="A screenshot of a Quarto document rendered inside JupyterLab"}
![](https://quarto.org/docs/computations/images/python-vscode.png){.fragment width="1700px" fig-alt="A screenshot of a Quarto document rendered inside VSCode"}
![](https://quarto.org/docs/tools/images/rstudio-preview.png){.fragment width="1700px" fig-alt="A screenshot of a Quarto document rendered inside RStudio"}
:::
## Auto-completion in RStudio + VSCode
<br>
Both RStudio and [VSCode with the Quarto extension](https://quarto.org/docs/tools/vscode.html) have rich auto-completion
:::: {.columns}
::: {.column width="50%" .fragment}
### YAML
![](images/yaml-autocomplete.gif){fig-alt="A gif of auto-completion and search for YAML options inside RStudio"}
:::
::: {.column width="50%" .fragment}
### Chunk option
![](images/chunk-autocomplete.gif){fig-alt="A gif of auto-completion of a R chunk inside RStudio"}
:::
::::
## Quarto, unified document layout
::: {style="font-size: 95px;"}
```bash
quarto render boston-terrier.qmd --to html
```
:::
. . .
::: {style="font-size: 95px;"}
```bash
quarto render boston-terrier.qmd --to pdf
```
:::
##
:::: {.columns style="margin-top: -50px;"}
::: {.column width="45%"}
![HTML](images/boston-history-html.jpeg){fig-alt="A screenshot of a HTML article about Boston Terriers, the document has an image in the right hard margin, a floating table of contents, and different sections split up by headers"}
:::
::: {.column .fragment width="50%"}
![PDF](images/boston-history-pdf.jpeg){fig-alt="A screenshot of a PDF article about Boston Terriers, the document has an image in the right hard margin, a floating table of contents, and different sections split up by headers"}
:::
::::
## Quarto, unified syntax across markdown and code
:::: {.columns}
::: {.column width="40%" .fragment}
Add two images on disk to a two column layout.
```markdown
::: {layout-ncol=2}
![Surus](surus.png)
![Hanno](hanno.png)
:::
```
![](https://quarto.org/docs/authoring/images/elephant-figures-no-subcaption.png)
:::
::: {.column width="60%" .fragment}
Generate two plots from code, and layout in two columns.
```{python}
#| echo: fenced
#| layout-ncol: 2
#| fig-cap: ["Scatter", "Boxplot"]
from plotnine import ggplot, geom_point, geom_boxplot, aes, stat_smooth, facet_wrap, theme
from plotnine.data import mtcars
# plot 1 in column 1
plot1 = (ggplot(mtcars, aes('wt', 'mpg', color='factor(gear)'))
+ geom_point() + stat_smooth(method='lm')
+ facet_wrap('~gear')).draw(show=True)
# plot 2 in column 2
plot2 = (ggplot(mtcars, aes('cyl', 'mpg', color='factor(cyl)'))
+ geom_boxplot()
).draw(show=True)
```
:::
::::
## Built-in vs custom
One goal of Quarto is to provide a markdown-centric format-agnostic syntax as shown in previous slides.
. . .
* Quarto bundles Bootstrap CSS and themes, and respects SASS variables for robust styling of HTML content (HTML documents, websites, books, slides, etc).
* Quarto includes LaTeX templates for specific journals as well as good defaults for PDF outputs in general.
* Quarto respects docx and pptx templates, again allowing for robust styling.
. . .
* You shouldn't HAVE to escape out to writing raw LaTeX, HTML, Jinja templates, etc
* In vast majority of situations, can rely purely on Markdown syntax
. . .
* BUT you can always include raw content such as LaTeX, CSS, HTML, JavaScript to further customize and optimize for a specific format.
## Extending Quarto with `extensions`
:::: {.columns}
::: {.column width="50%"}
::: {.fragment}
### Shortcodes
- Replace inline "short codes" with output.
``` {.markdown shortcodes="false"}
{{< fa thumbs-up >}}
```
{{< fa thumbs-up size=2xl >}}
:::
<br>
::: {.fragment}
### Filters
- Affect rendering of specific items
![](https://user-images.githubusercontent.com/104391/178159800-e3b74510-97e7-469c-87cf-b49cac8602f9.png){width=800 fig-alt="A screenshot of a code chunk"}
:::
:::
::: {.column width="50%"}
::: {.fragment}
### Formats
- Add entirely custom new formats
```yaml
---
title: "Cool Company 2022 Presentation"
format: coolco-revealjs
---
```
:::
:::
::::
## Interactivity, Jupyter Widgets
```{python}
#| eval: true
#| echo: true
import plotly.express as px
import plotly.io as pio
df = px.data.iris()
fig = px.scatter(df, x="sepal_width", y="sepal_length",
color="species",
marginal_y="violin", marginal_x="box",
trendline="ols", template="simple_white")
fig.show()
```
## Interactivity, Observable
Quarto also includes native support for [Observable JS](https://observablehq.com/@observablehq/observables-not-javascript), a set of enhancements to vanilla JavaScript created by Mike Bostock (also the author of D3)
. . .
```{ojs}
//| panel: input
viewof bill_length_min = Inputs.range(
[32, 50],
{value: 35, step: 1, label: "Bill length (min):"}
)
viewof islands = Inputs.checkbox(
["Torgersen", "Biscoe", "Dream"],
{ value: ["Torgersen", "Biscoe"],
label: "Islands:"
}
)
```
::: {.panel-tabset}
## Plot
```{ojs}
Plot.rectY(filtered,
Plot.binX(
{y: "count"},
{x: "body_mass", fill: "species", thresholds: 20}
))
.plot({
facet: {
data: filtered,
x: "sex",
y: "species",
marginRight: 80
},
marks: [
Plot.frame(),
]
}
)
```
## Data
```{ojs}
Inputs.table(filtered)
```
:::
```{ojs}
data = FileAttachment("palmer-penguins.csv").csv({ typed: true })
```
```{ojs}
filtered = data.filter(function(penguin) {
return bill_length_min < penguin.bill_length &&
islands.includes(penguin.island);
})
```
## Interactivity, on the fly Observable "widgets"
Quarto including Observable means you can create new "widgets" or allow the user to modify portions of the doc on the fly.
. . .
<br>
```{ojs}
viewof temp = Inputs.range([0, 100], {step: 1, value: 34, label: htl.html`Temp ℃`})
```
Converting temperature from ℃ to ℉ <br>
Celsius = ${d3.format(".0f")(temp)}℃ and Fahrenheit = ${d3.format(".1f")(temp * 9/5 + 32)}℉.
. . .
````code
```{{ojs}}
viewof temp = Inputs.range([0, 100], {step: 1, value: 34, label: htl.html`Temp ℃`})
```
Converting temperature from ℃ to ℉ <br>
Celsius = ${d3.format(".0f")(temp)}℃ and Fahrenheit = ${d3.format(".1f")(temp * 9/5 + 32)}℉.
````
## Quarto Publish
::: {style="font-size: 50px;"}
```bash
quarto publish --help
Usage: quarto publish [provider] [path]
Version: 1.2.269
Description:
Publish a document or project. Available providers include:
- Quarto Pub (quarto-pub)
- GitHub Pages (gh-pages)
- Posit Connect (connect)
- Netlify (netlify)
```
:::
. . .
![](images/quartopub.jpeg){fig-align=center style="width: 1200px;" fig-alt="Screenshot of the quartopub.com website"}
## Quarto, crafted with love and care
> Development of Quarto is sponsored by Posit, PBC (formerly known as RStudio, PBC). The same core team works on both Quarto and R Markdown:
- Carlos Scheidegger ([\@cscheid](https://github.com/cscheid))
- Charles Teague ([\@dragonstyle](https://github.com/dragonstyle))
- Christophe Dervieux ([\@cderv](https://github.com/cderv))
- J.J. Allaire ([\@jjallaire](https://github.com/jjallaire/))
- Yihui Xie ([\@yihui](https://github.com/yihui))
Here is the [full contributors list](https://github.com/quarto-dev/quarto-cli/graphs/contributors). Quarto is open source and we welcome contributions in our github repository as well! <https://github.com/quarto-dev/quarto-cli>.
## Quarto
- Batteries included, shared syntax across output types and languages
- Single source publishing across document types, with raw customization allowed
- Choose your own editor for plain text .qmd or Jupyter notebooks
- Quarto projects + freeze for managing stored computation
Follow [\@quarto_pub](https://twitter.com/quarto_pub) [#QuartoPub]{style="color: #447099;"} or me [\@thomas_mock](https://twitter.com/thomas_mock) on Twitter/Fosstodon.org to stay up to date!
. . .
### Web resources
:::{style="font-size: 40px;"}
- [Quarto.org](https://quarto.org/) for documentation or the [Quarto FAQ](https://quarto.org/docs/faq/)
- [Get Started with Quarto + Python](https://quarto.org/docs/get-started/)
![](images/get-started.png){.absolute left=20 bottom=-15}
:::
## Quarto resources
- [Quarto for the Curious - 20 min video](https://www.rstudio.com/conference/2022/talks/quarto-for-rmarkdown-users/)
- ['Welcome to Quarto' workshop - 120 min video](https://www.youtube.com/watch?v=yvi5uXQMvu4)
### General Quarto
- [Hello Quarto - RStudio::Conf Keynote, 60 min](https://www.rstudio.com/conference/2022/keynotes/collaborate-with-quarto/)
- [Literate Programming With Jupyter Notebooks and Quarto - 20 min](https://www.rstudio.com/conference/2022/talks/literate-programming-quarto/)
- [Quarto FAQ](https://quarto.org/docs/faq/)
## Why the name "Quarto"?[^1]
[^1]: [Why Quarto?](https://quarto.org/docs/faq/#why-the-name-quarto) We wanted to use a name that had meaning in the history of publishing and landed on Quarto, which is the format of a book or pamphlet produced from full sheets printed with eight pages of text, four to a side, then folded twice to produce four leaves. The earliest known European printed book is a Quarto, the [Sibyllenbuch](https://en.wikipedia.org/wiki/Sibyllenbuch_fragment), believed to have been printed by [Johannes Gutenberg](https://en.wikipedia.org/wiki/Johannes_Gutenberg) in 1452–53.
::: columns
::: {.column width="50%"}
![](images/quarto-hamlet-1.jpeg){alt-text="A quarto folded book, where each of the pages can be folded to align the text." width="450px"}
:::
::: {.column width="50%"}
![](images/quarto-hamlet-2.jpeg){alt-text="A quarto folded book, where each of the pages can be folded to align the text." width="450px"}
:::
:::