Creación de presentaciones y libros con R Markdown

.title[
# Creación de presentaciones y libros con R Markdown
]
.author[
### Joselyn Chávez 01 de agosto de 2022
]

---

## Este material posee una licencia tipo Creative Commons Attribution-ShareAlike 4.0 International License. 
## Para conocer más sobre esta licencia, visite http://creativecommons.org/licenses/by-sa/4.0/

---
class: middle, center

## Material disponible en: 
### https://comunidadbioinfo.github.io/cdsb2022

## Basado en 
["R Markdown: The Definitive Guide"](https://bookdown.org/yihui/rmarkdown/)

["bookdown: Authoring Books and Technical Documents with R Markdown"](https://bookdown.org/yihui/bookdown)

---

# Creación de presentaciones con xaringan

---
# El paquete xaringan

.left-column[ 
<img src="data:image/png;base64,#img/xaringan.png" width="100%" style="display: block; margin: auto;" />
]

```r
install.packages("xaringan")
```

- Creación de una nueva presentación:

File > New file > R Markdown > From Template > Ninja Presentation
]

---
# Previsualización de las diapositivas

```r
infinite_moon_reader()

xaringan::inf_mr()
```
]

.pull-right[ 
<img src="data:image/png;base64,#img/viewer.png" width="100%" style="display: block; margin: auto;" />
]

---
# La diapositiva de título

---
# Modificando la diapositiva de título

.pull-left[
<img src="data:image/png;base64,#img/rladies_theme1.png" width="100%" style="display: block; margin: auto;" />
]

.pull-right[
<img src="data:image/png;base64,#img/rladies_theme2.png" width="100%" style="display: block; margin: auto;" />
]

Otros temas: chocolate, duke, fc, hygge, ki, lucy, metropolis, middlebury, nhsr, robot, uio, useR, uwm, wic.

---
# Diapositivas de contenido

---
# Ejecutando código

.pull-left[ 
<img src="data:image/png;base64,#img/code_1.png" width="70%" style="display: block; margin: auto;" />
]

.pull-right[
<img src="data:image/png;base64,#img/code_2.png" width="100%" style="display: block; margin: auto;" />
]

---
# Incluyendo imágenes

- El tamaño de la imagen se puede modificar usando las opciones out.width, out.height, fig.width, fig.height.

- Las dimensiones se indican como porcentaje o como número de pixeles.

---
# Alineación del contenido

- Afectando todo el contenido de la diapositiva

```r
class: center
class: middle
```

- Afectando contenido específico

```r
.center[]
.pull-left[]
.pull-right[]
```

---
# Compartiendo la presentación

## Como página web

Generar el archivo html usando Knit > Publicar usando **GitHub pages**

---

.pull-left[
<img src="data:image/png;base64,#img/settings_2.png" width="80%" style="display: block; margin: auto;" />
]

.pull-right[ 
<img src="data:image/png;base64,#img/settings_3.png" width="80%" style="display: block; margin: auto;" />
]

---
# Compartiendo la presentación

## Como pdf

Generar el archivo html usando Knit > Convertir a pdf usando **pagedown**

```r
pagedown::chrome_print("presentacion.html")
```

Nota: Es necesario mantener el ratio original de las diapositivas.

---
# Información adicional

---
class: chapter-slide

# Creación de libros con bookdown

---
# El paquete bookdown

.left-column[ 
<img src="data:image/png;base64,#img/bookdown_logo.png" width="100%" style="display: block; margin: auto;" />
]

```r
install.packages("bookdown")
```

- Descargar alguno de los ejemplos:

https://github.com/yihui/bookdown-minimal

https://github.com/rstudio/bookdown-demo
]

---
# Templado

---
# Agregando contenido

- Cada archivo Rmd representa un capítulo
- Los capítulos van ordenados/numerados
- No se deben renderizar los Rmd
- Las imágenes llamadas dentro de los capítulos se colocan en img
- Para incluir las imáges se usa: knitr::include_graphics("img/imagen.png")
- Los archivos html llamados dentro de los capítulos se colocan en docs

---
# Publicando el libro

Renderizado > Publicación con GitHub pages

```r
bookdown::render_book()
```

Los html correspondientes a los capítulos se renderizan de manera automática en **docs**

El libro quedará disponible en https://comunidadbioinfo.github.io/templado_bookdown/

---
# Configuración del repositorio

---
# Información adicional

---

.pull-right[ 
<img src="data:image/png;base64,#css/xolo.png" width="80%" style="display: block; margin: auto;" />

]