Structure of a Shiny Applet

Haley Jeppson, Joe Papio,
Sam Tyner

June 15, 2017

Reactivity

  • shiny is built on the idea of reactive programming.
  • i.e. outputs automatically update whenever an input value changes
input values => R code => output values

Reactive expressions keep track of what values they read and what values they change. If those values become “out of date”, they know their return value is out of date and will automatically recalculate.

A Tale of Two Files

Shiny applications have two components:

  • ui.R defines the page layout and user interface
  • server.R contains the R code to create any output

ui.R

library(shiny)

# A simple/common user interface template
ui <- fluidPage(

  # Application title
  titlePanel("Title"),
  
  sidebarPanel(
    # Define some inputs here
  ),
  
  mainPanel(
    # outputs` (from the server) go here
  )

)

User Interface (ui)

  • elements of the user interface are called widgets
  • we distinguish between input and output
  • overview of available input widgets in shiny at http://shiny.rstudio.com/gallery/widget-gallery.html
  • input widgets have a similar structure xxxInput (inputId, label, value) where xxx is the name of the widget
    • inputId is the (unique) name you give to the widget (object name)
    • label is the text that appears with the widget in interface
    • value all widgets have a value - the type of this value is specific to the widget
    • … other parameters are widget-specific

server.R

# Server side logic 
server <- function(input, output) {
  # do something
}

A minimal shiny app

library(shiny)

ui <- fluidPage()
server <- function(input, output) {
}

shinyServer(ui, server)
  • save this code in a separate folder call the file app.R
  • run the code: either paste into the console or use runApp on folder name

Shiny Inputs

textInput("text", label = h3("Text input"), value = "Enter text...")


h3() is just converting html into a header of level 3:

h3("Hello")
<h3>Hello</h3>
selectInput("select", label = h3("What do you like?"), 
            choices = c("Pizza", "Ice cream", 
                        "Donuts", "None of the above"), 
            selected=2)

Shiny Inputs (cont’d)

  • actionButton() - creates a clickable button
  • checkboxInput() and checkboxGroupInput()
  • dateInput() - calendar to select a date
  • dateRangeInput() - select a range of dates
  • fileInput() - upload a file
  • numericInput() - input a numeric value
  • radioButtons() - select one or more items
  • sliderInput() - slide along a range of values
  • textInput() - input a string

resource

Your Turn

  • Consider extending the hello world example:
runApp("01_Hello", display.mode = "showcase")
  • Challenge 1: add an input to change the mean and standard deviation (Hint: see ?numericInput).
  • Challenge 2: add an input to simulate from a gamma as well as a normal (Hint: you can simulate from gamma distribution with rgamma).
  • Challenge 3: (Tricky) how do we get the shiny app to react to the input?

Shiny Outputs

Shiny also has a set of output functions with general structure:

xxxOutput (outputId, ...)

where outputId is a (unique) object name (and xxx is one of the choices below)

  • html, image, plot, table, text, creates what the names says
  • uiOutput raw HTML
  • verbatimTextOutput text

Outputs have width and height, might be clickable, hoverable, …