Clase 6: Shiny

class: center, middle, inverse, title-slide

<h1 class = "celeste-ish" style="line-height: 90px; margin-top: -50px;">
 Clase 6:
 Shiny
</h1>

&nbsp;

<h3 class = "celeste-ish" style = "position: absolute; bottom: 80px;">
 Autor: Lucio Cornejo
</h3>

---
class: middle

## Shiny

El paquete **Shiny** nos permite crear aplicaciones web empleando **R** 
(o **R Markdown** ), sin necesidad de conocer los lenguajes HTML, CSS y JavaScript
de desarrollo web.

Sin emmbargo, es posible emplear aquellos tres lenguajes junto a **Shiny**,
para crear aplicaciones más complejas o para personalizar el diseño de las
aplicaciones.

&nbsp;

## Ejemplos

- [Memory Hex game](https://dreamrs.shinyapps.io/memory-hex/?_ga=2.118371084.487097544.1645368539-1789728895.1639621429)
- [Genome viewer](https://gallery.shinyapps.io/genome_browser/?_ga=2.118371084.487097544.1645368539-1789728895.1639621429)
- [Movie explorer](https://shiny.rstudio.com/gallery/movie-explorer.html)

---
class: middle

## Instalación

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

&nbsp;

## Primer ejemplo

&nbsp;

En un nuevo archivo **.R**, insertemos el siguiente código:

```r
library(shiny)
runExample("01_hello")
```

&nbsp;

## Versión alternativa del primer ejemplo

&nbsp;

Analicemos rápidamente 
[este archivo](https://github.com/lucio-cornejo/taller-r-markdown/blob/main/_material/clase-6/ejemplo-shiny-01.Rmd)
.

---
class: middle

## Más ejemplos

Pueden ejecutar los siguientes comandos en **R** para ver modelos de
aplicaciones donde se explican algunas de las funcionalidades básicas de
**Shiny**:

```r
runExample("01_hello")       # un histograma
runExample("02_text")        # tablas y data frames
runExample("03_reactivity")  # una expresión reactiva
runExample("04_mpg")         # variables globales
runExample("05_sliders")     # barras deslizantes
runExample("06_tabsets")     # paneles (tabsets)
runExample("07_widgets")     # botones y texto de ayuda
runExample("08_html")        # aplicación Shiny construida desde HTML
runExample("09_upload")      # botón para cargar archivos
runExample("10_download")    # botón para descargar archivos
runExample("11_timer")       # mostrar la hora actual
```

???

Ver rápidamente los ejemplos 5, 7, 9 y 10.

---

## Control widgets

&nbsp;

Un widget es un elemento web con el cual los usuarios pueden interactuar.

&nbsp;

![Basic Shiny widgets](images-and-gifs/basic-widgets.png)

[Galería](https://shiny.rstudio.com/gallery/widget-gallery.html)
con el código de los widgets disponibles vía **Shiny**.

???

Explorar rápidamente el archivo **ejemplo-shiny-02.Rmd** .
---

## Creación reactiva de elementos web

&nbsp;

---

## Reportes parametrizados: Parte II

Volveremos a trabajar con el primer reporte parametrizado
que se creó en este taller, el de temperaturas mensuales
promedio en Nottingham.

&nbsp;

.pull-left[

### Versión 1

Modificaremos el reporte previo con el fin
que en la página web donde se visualiza tal reporte sea
posible modificar el **año de interés** y que se actualice 
la data y gráficos relevantes del reporte.

[Modelo](https://github.com/lucio-cornejo/taller-r-markdown/blob/main/_material/clase-6/ejemplo-shiny-03_1.Rmd)

]

.pull-right[

### Versión 2

Crearemos una aplicación web donde se pueda fijar el 
**año de interés** para el reporte y descargar la versión
parametrizada del reporte (_respecto al año fijado_)
vía un simple click de un botón.

[Modelo](https://github.com/lucio-cornejo/taller-r-markdown/blob/main/_material/clase-6/ejemplo-shiny-03_2.Rmd)

]

---

## Dashboards reactivos

Ahora, emplearemos **Shiny** en conjunto al paquete
**Flexdashboard** que utilizamos en la sesión pasada.

Esto, con la finalidad de crear un dashboard cuyos
gráficos y/o elementos se actualizan a medida que
el usuario interactúe con ciertos elementos que 
incluiremos en el sitio web.

---
class: middle

## Referencias

- [Tutorial básico de Shiny](https://shiny.rstudio.com/tutorial/written-tutorial/lesson1/)

- [Libro esencial de Shiny](https://mastering-shiny.org/)

- [Generar reportes descargables](https://shiny.rstudio.com/articles/generating-reports.html)