Building Interactive, - PowerPoint Presentation

Slide1

Building Interactive, R-Powered Web Applications with Shiny

Jeff Allen, Dallas R Users Group

2/9/2013Slide2

About MeBy day…

Computational Biologist at UT SouthwesternUse R to analyze biomedical data

Develop Java-based web application

By night…

Freelance consultant as Trestle Technology

Web developmentData analysisIT consulting

MS Computer Science, SMUSlide3

OverviewMotivationShiny

Reactive ProgrammingCode WalkthroughsSimple histogram

Advanced histogram

Reactive histogram

Custom outputs

HostingSlide4

Motivation“R is great!”

“The Internet is great!”Slide5

MotivationWant to get R into web browsersPrevious approaches

rApacheRserve (Java, C++, C#, Python, Ruby, .NET)

deployR

Custom hacks

Just make R accessible to server-side programming languages (PHP, Ruby, Java, etc.)Slide6

ShinyOpen-Sourced by RStudio

11/2012 on CRANNew model for web-accessible R codeAble to generate basic web UIsUses web sockets

“The new HTTP”

Built on a “Reactive Programming” model

Entirely extensible

Custom inputs and outputsSlide7

Reactive Programming

a <- 3b <- a + 2

a <- 7

b == ?

Imperative: b = 5

Reactive: b = 9Slide8

Reactive Programming ExampleSlide9

Basic Shiny UI and Serverhttp://trestletechnology.net:3838/simpleGeyeser/

https://github.com/trestletech/shiny-sandbox/tree/master/simpleGeyeser

Basic Shiny ExampleSlide10

ui.R

shinyUI(

bootstrapPage

(

selectInput(inputId

= "n_breaks

",

label

= "Number of bins in histogram (approximate):",

choices

= c(10, 20, 35, 50),

selected

= 20

),

plotOutput

(

outputId

= "

main_plot

", height = "300px

")

)

)Slide11

ui.R

shinyUI(

bootstrapPage

(

selectInput(inputId = "

n_breaks",

label

= "Number of bins in histogram (approximate):",

choices

= c(10, 20, 35, 50),

selected

= 20

),

plotOutput

(

outputId

= "

main_plot

", height = "300px

")

))Slide12

ui.R

shinyUI(

bootstrapPage

(

selectInput(inputId = "n_breaks

",

label

= "

Number of bins in histogram (approximate):

",

choices

= c(

10

,

20

,

35

,

50

),

selected

=

20

),

plotOutput

(

outputId

= "

main_plot

", height = "300px

")

))Slide13

ui.R

shinyUI(

bootstrapPage

(

selectInput(inputId = "n_breaks

",

label

= "

Number of bins in histogram (approximate):

",

choices

= c(

10

,

20

,

35

,

50

),

selected

=

20

),

plotOutput

(

outputId

= "

main_plot

", height = "

300px

")

))Slide14

ui.R

shinyUI(

bootstrapPage

(

selectInput(inputId = "n_breaks

",

label

= "

Number of bins in histogram (approximate):

",

choices

= c(

10

,

20

,

35

,

50

),

selected

=

20

),

plotOutput

(

outputId

= "main_plot", height = "300px")))Slide15

server.R

shinyServer(

function(input, output)

{

output$main_plot <-

reactivePlot(

function(){

hist

(

faithful$eruptions

,

probability

= TRUE,

breaks

=

as.numeric

(

input$n_breaks

),

xlab

= "Duration (minutes)",

main

= "Geyser eruption duration

")

})

}

)Slide16

server.R

shinyServer(

function

(input, output)

{

output$main_plot <-

reactivePlot(

function(){

hist

(

faithful$eruptions

,

probability

= TRUE,

breaks

=

as.numeric

(

input$n_breaks

),

xlab

= "Duration (minutes)",

main

= "Geyser eruption duration

")

})

})Slide17

server.R

shinyServer(

function

(input, output)

{

output$main_plot <- reactivePlot

(

function(){

hist

(

faithful$eruptions

,

probability

= TRUE,

breaks

=

as.numeric

(

input$n_breaks

),

xlab

= "Duration (minutes)",

main

= "Geyser eruption duration

")

})

})Slide18

server.R

shinyServer(

function

(input, output)

{

output$main_plot <- reactivePlot

( function

(){

hist

(

faithful$eruptions

,

probability

= TRUE,

breaks

=

as.numeric

(

input$n_breaks

),

xlab

= "Duration (minutes)",

main

= "Geyser eruption duration

")

})

})Slide19

server.R

shinyServer(

function

(input, output)

{

output$main_plot <- reactivePlot

( function

(){

hist

(

faithful$eruptions

,

probability

=

TRUE

,

breaks

=

as.numeric

(

input$n_breaks

),

xlab

= "

Duration (minutes)

",

main = "Geyser eruption duration") })})Slide20

Key

Dependency Graph –

Simple

shinyServer

$

n_breaks

Reactive Function

Input

main_plotSlide21

Additional UI Featureshttp://trestletechnology.net:3838/naiveGeyeser/

https://github.com/trestletech/shiny-sandbox/tree/master/naiveGeyeser/

Intermediate Shiny ExampleSlide22

Key

Dependency Graph – Naïve

shinyServer

$dataset

$

individual_obs

$

bw_adjust

$

n_breaks

Reactive Function

Input

$density

main_plot

(Get data, get name, plot)Slide23

Key

“Data Flow”– Naïve

shinyServer

$dataset

$

individual_obs

$

bw_adjust

$

n_breaks

Reactive Function

Input

$density

main_plot

(Get data, get name, plot)Slide24

Optimized Reactive Serverhttp://trestletechnology.net:3838/reactiveGeyeser/

https://github.com/trestletech/shiny-sandbox/tree/master/reactiveGeyeser

/

Reactive Shiny ExampleSlide25

Key

Dependency Graph – Reactive

getData

dataName

shinyServer

$dataset

$

individual_obs

$

bw_adjust

$

n_breaks

Reactive Function

Input

$density

main_plotSlide26

Key

“Data Flow” – Reactive

getData

dataName

shinyServer

$dataset

$

individual_obs

$

bw_adjust

$

n_breaks

Reactive Function

Input

$density

main_plotSlide27

http://trestletechnology.net:3838/grn/

https://github.com/trestletech/shiny-sandbox/tree/master/grn

D3.JS Shiny ExampleSlide28

http://trestletechnology.net:3838/rgl/https://github.com/trestletech/shiny-sandbox/tree/master/rgl

RGL Shiny ExampleSlide29

HostingRStudio offers “Glimmer”

Free (for now) managed hosting platform for ShinyRStudio‘s Shiny-ServerOpen sourced

1/22/2013

Written in Node.js

Same software that powers Glimmer

“Some assembly required”Hacks to support older IEsAmazon Machine Image on EC2Slide30

Questions?Code at http://github.com/trestletech/shiny-sandbox

Slides athttp://trestletechnology.net/blog/

Find me on: