at SQLBits

Objective

Learn what the heck shiny is and how you use it!

Logistics

  • Approx 55 mins talk + 20 mins adventure (liberally sprinkled)
  • Links going out during talk on twitter (@SteffLocke)
  • Ask your questions throughout
  • I'll do some whistlestop R but see my Intro to R or for more in-depth my SQLSaturday pre-con
  • Please give feedback & thanks to the organisers of @SQLBits

FundaRmentals

# variable assignment
a <- 1
a
## [1] 1
# functions
paste0(c("SQL","Super"),c("Bits","Heroes"))
## [1] "SQLBits"     "SuperHeroes"

What's Shiny?

  • An interactive report framework
  • An R package that is available free (as is the server edition)
  • Uses "modern web standards" like bootstrap under the hood

Quick example

## 
## Attaching package: 'shiny'
## The following objects are masked from 'package:DT':
## 
##     dataTableOutput, renderDataTable

Shiny structure

Contents

Typical

A shiny application report consists of two functions:

  • shinyServer()
  • shinyUI()

One says what to execute and the other states how to present it. Do all data manipulation, chart production in shinyServer()

Contents

"Lite"

defaultdisplay<-list(width="100%", height="75%")

shinyApp(
    ui      = fluidPage(),
  , server  = function(input, output) {}
  , options = defaultdisplay
)

Files

You typically split into two files:

  • server.R containing shinyServer()
  • ui.R containing shinyUI()

This can then be run with runApp()

You can do a single file example app.R which contains both functions but this is typically better for very short apps.

Front-end layout

Use these just inside shinyUI() to produce a layout

##          Page Types
## 1:        basicPage
## 2:    bootstrapPage
## 3:         fillPage
## 4:        fixedPage
## 5:        fluidPage
## 6:       navbarPage
## 7: updateNavbarPage

Typical Inputs

Dates

shinyApp(
  ui = fluidPage(dateInput("datePicker", "Pick a date:", 
                           format="dd/mm/yy"),
                 dateRangeInput("dateRange", "Pick dates:", 
                                start=Sys.Date(), 
                                end=Sys.Date() ) ),
  server = function(input, output) {}
  ,options = defaultdisplay
)

Values

Simple

shinyApp(
  ui = fluidPage(numericInput("vals", "Insert a number:", 
                              value=15, min=10)  ),
  server = function(input, output) {}
  ,options = defaultdisplay
)

Values

Sliders

shinyApp(
  ui = fluidPage(sliderInput("vals", "Insert a number:", 
                             min=0, max=50, value=15)  ),
  server = function(input, output) {}
  ,options = defaultdisplay
)

Text

Single line

shinyApp(
  ui = fluidPage(textInput("char", "Insert text:")  ),
  server = function(input, output) {}
  ,options = defaultdisplay
)

Text

Paragraph

shinyApp(
  ui = fluidPage(tags$textarea(id="charbox", rows=3, 
                               cols=40, "Default value")  ),
  server = function(input, output) {}
  ,options = defaultdisplay
)

Selectors

shinyApp(
  ui = fluidPage(selectInput("multiselect", "Pick favourites:",
                             c("Green","Red","Blue"),
                             multiple=TRUE)  ),
  server = function(input, output) {}
  ,options = defaultdisplay
)

List of input types

##               Input controls
##  1:       checkboxGroupInput
##  2:            checkboxInput
##  3:                dateInput
##  4:           dateRangeInput
##  5:                fileInput
##  6:             numericInput
##  7:            passwordInput
##  8:     registerInputHandler
##  9:       removeInputHandler
## 10:             restoreInput
## 11:              selectInput
## 12:           selectizeInput
## 13:              sliderInput
## 14:            textAreaInput
## 15:                textInput
## 16: updateCheckboxGroupInput
## 17:      updateCheckboxInput
## 18:          updateDateInput
## 19:     updateDateRangeInput
## 20:       updateNumericInput
## 21:        updateSelectInput
## 22:     updateSelectizeInput
## 23:        updateSliderInput
## 24:      updateTextAreaInput
## 25:          updateTextInput
##               Input controls

Typical Outputs

Input values

shinyApp(
  ui = fluidPage(textInput("char", "Insert text:") ,
                 textOutput("text")  ),
  server = function(input, output) {
    output$text <- renderText(input$char)
  }  ,options = defaultdisplay
)

Basic tables

shinyApp(
  ui = fluidPage(tableOutput("basictable")  ),
  server = function(input, output) {
    output$basictable <- renderTable(head(iris,5))
  }  ,options = defaultdisplay
)

Interactive tables

shinyApp(
  ui = fluidPage(dataTableOutput("datatable")  ),
  server = function(input, output) {
    output$datatable <- renderDataTable(head(iris,5))
  }  ,options = defaultdisplay
)

Charts

shinyApp(
  ui = fluidPage(plotOutput("chart")  ),
  server = function(input, output) {
    output$chart <- renderPlot(pairs(iris))
  }  ,options = defaultdisplay
)

Reactivity

Not covered in-depth

Simple reactivity

  • Make functions that process inputs only when they change
a <- reactive({input$a})
a
  • Use these reactive functions in downstream server items for DRY & to reduce processing effort

An Example

shinyApp(
  ui = fluidPage(textInput("char", "Insert text:") ,
                 textOutput("textA"),textOutput("textB") ),
  server = function(input, output) {
    char<-reactive({rep(input$char,5)})
    output$textA <- renderText(paste(char(),collapse="+"))
    output$textB <- renderText(paste(char(),collapse="-"))
  }
  ,options = defaultdisplay
)

Styling

shinythemes

  • Get a different look and feel with the package shinythemes
  • Uses a number of bootstrap based themes
  • Good-looking quickly, but of course not company branded
  • View themes at bootswatch.com

CSS

  • Shiny outputs html so you can write CSS that works with it
  • Full list of CSS items doesn't exist, use F12 on chrome or check out selectorgadget via rvest
  • Simple stuff like body, h1 will all work

shinydashboards

Infrastructure

Ad-hoc shiny

  • Rstudio (easiest) or just run directly
  • Use shiny::runApp()
  • Great for "expert" use

Cloud

  • shinyApps.io
  • Deploy with shinyApps package
  • Free for light use
  • Extra management features at increased costs
  • Great for hands-off management

Central server

  • shiny-server
  • Runs on linux
  • Free community edition
  • Extra management features & LDAP auth in Pro Edition (but can roll your own)
  • Great for sensitive and/or db-driven appplications

Let's put it all together!

Q & A

Recommended reading

Steph Locke

The end!