Chapter 1 Introduction

1.2 Book structure

This book is organized into six parts.

  • Part 1 demonstrates the link between Shiny and the classic web languages like HTML, CSS and JavaScript. We finish by exploring the dependencies behind Shiny (Bootstrap, jQuery, …)
  • In part 2, we dive into the {htmltools} (Cheng et al. 2020) package, providing functions to create and manipulate HTML tags from R as well as manage web dependencies
  • Part 3 contains chapters dedicated to the Shiny input system where we highlight some partially hidden features like websockets. This part starts with a JavaScript introduction that might be skipped if necessary!
  • Part 4 focuses on the development of a new template for Shiny by demonstrating examples from the {tablerDash} (Granjon 2020) package, being a serious refreshment to {shinydashboard} (Chang and Borges Ribeiro 2018). These, and more may be explored further as part of the RinteRface project.
  • Part 5 focuses on CSS and SASS, showcasing examples from the R community like {fresh} Perrier and Meyer (2020b)], to beautify apps with only few lines of code
  • Part 6 dives into mobile web development through a practical study involving the {shinyMobile} package (Granjon, Perrier, and Rudolf 2020)

1.3 Code structure

This book has a side package containing all the necessary material to run the code without having to reload each previous snippet.

remotes::install_github("DivadNojnarg/outstanding-shiny-ui-code
")

It covers Chapters 9, 10 and the whole Practice section.

There is another good reason for this package: provide a robust method to bundle JavaScript/CSS code along side any shiny app. Indeed, it is quite tempting to proceed as below:

ui <- fluidPage(
  tags$script(
    "$(function() {
      Shiny.addCustomMessageHandler('hello', function(message) {     alert(message); 
      });
    });
    "
  ),
  actionButton("go", "Send")
)

server <- function(input, output, session) {
  observeEvent(input$go, {
    session$sendCustomMessage("hello", message = "plop")
  })
}

shinyApp(ui, server)

It is fine if the app purpose is a simple demonstration. In our case, since we aim at providing reusable template elements, we need a better approach, that will be described later.

1.4 Preliminary exercices

Before starting with technical details, we propose to play a little game. Among all the images shown, what are the ones corresponding to shiny apps?

References

Chang, Winston, and Barbara Borges Ribeiro. 2018. Shinydashboard: Create Dashboards with ’Shiny’. https://CRAN.R-project.org/package=shinydashboard.

Cheng, Joe, Carson Sievert, Winston Chang, Yihui Xie, and Jeff Allen. 2020. Htmltools: Tools for Html. https://CRAN.R-project.org/package=htmltools.

Granjon, David. 2020. TablerDash: ’Tabler’ Api for ’Shiny’.

Granjon, David, Victor Perrier, and Isabelle Rudolf. 2020. ShinyMobile: Mobile Ready ’Shiny’ Apps with Standalone Capabilities.

Perrier, Victor, and Fanny Meyer. 2020b. Fresh: Create Custom ’Bootstrap’ Themes to Use in ’Shiny’. https://CRAN.R-project.org/package=fresh.