Tips for Making Professional Shiny Apps with R
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.
If you’ve built a Shiny app with R you’ll know how exciting it feels to get your first app up and running. Shiny is an amazing tool for R users, but how do you take it to the next level? This post with outline five easy ways to make Shiny apps more professional.
Add a Progress Wheel
I’ll start with the progress wheel because it is the easiest and most impactful change to make. Oftentimes, Shiny apps involve calculations that take more than one second to execute. It can be a frustrating experience for the user to interact with an application and wait without knowing what is happening. Is the application busy doing some calculation? Did the user select the correct button? Is the server down? You have likely been in this situation yourself as a user of the web. There are a few different ways to implement a progress indicator, but I have found the simplest and most effective solution already in the shinysky package. The busyIndicator() function allows you to specify a custom message and wait time before the progress wheel appears.
busyIndicator(text = "Calculation in progress ... ", wait = 0)
Create a www Folder
Most web applications contain extra resources or libraries to enhance their appearance and functionality. Shiny apps are no different. If you would like to include images, styling, or even JavaScript, then all of these files should be contained inside a single folder entitled www that is located in the same directory as the ui.R and server.R files. The www folder is the main location for all web resources in your application. If you would like to enforce a global standard of styling, then create a .css file containing the CSS stylesheet language for formatting. If you would like to add images or GIFs to your Shiny app, then place them in the www folder as well. Shiny supports most image file formats such as .jpg, .png, and .gif. If you would like to add JavaScript logic, then create a .js file containing any functions or variables that you would like to execute. Again, place this file inside the www folder. Note that you must explicitly reference these files inside the <head> tag of your app. The best way to add to your app is by using tags$head() and tags$link() like this:
tags$head(
tags$link(rel = "stylesheet", type = "text/css",
href = "style.css")
)
You can even give your app a bookmark icon using the link tag instead of the head tag!
tags$link(rel = "shortcut icon", type = "image/x-icon",
href = "my-shortcut-icon.ico")
Style with CSS
If you are deploying your Shiny apps in a professional setting, it is a best practice to format and style your apps using rules defined by the CSS stylesheet language. This will reduce the amount of time and effort to style new applications and provide a clean and consistent experience so that users quickly become familiar with how elements of your apps function based on a consistent appearance. Using CSS in Shiny apps is no different from styling a traditional web page, so any resource teaching CSS will help, such as, the W3Schools CSS Tutorial available at http://www.w3schools.com/css/. A Shiny CSS guide is also available at http://shiny.rstudio.com/articles/css.html
Use a global.R file
It is good practice when coding software to place commonly used pieces of logic in a central location. You can put this concept into practice by creating a global.R file for your Shiny app. The global.R file is not a requirement for a Shiny app, but it will reduce redundant code and increase the app’s speed by re-using logic and variables from a global scope among concurrent app users. The global.R file should be located in the same directory as the ui.R and server.R files. Whenever a Shiny app is first used, the global.R file makes its logic available to the ui.R and server.R files. This speeds up your app because it is only runs once (when the app is first launched). Typically, global.R is a good place for loading libraries, sourcing R functions or variables needed by your app, and setting options like stringsAsFactors = FALSE.
Encourage Data Downloading
A big part of Shiny’s value proposition in the enterprise is promoting data democracy and the free sharing of information for use to further benefit the company. Shiny app users may prefer other tools, such as Excel or Tableau or Python. Empower your users and allow them the flexibility to intergrate into their preferred tool. The best way to facilitate that is to allow downloads of the data. The best package by far for displaying data and allowing for downloads is the datatable package. The following code snippet creates a row for your download button and then the datatable. I recommend pulling the button to the right of the screen using float: right; in your CSS so the button is naturally placed at the top right of your table and ready for the user to click.
fluidRow(
column(12, downloadButton("downloadDataFromTable", "Download Table Data"))
)
fluidRow(
column(12, DT::dataTableOutput("campaign_table", width = "100%"))
)
R-bloggers.com offers daily e-mail updates about R news and tutorials about learning R and many other topics. Click here if you're looking to post or find an R/data-science job.
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.