Introduction

Shiny is an R package that makes it easy to build interactive web apps straight from R. You can host standalone apps on a webpage or embed them in R Markdown documents or build dashboards. You can also extend your Shiny apps with CSS themes, htmlwidgets, and JavaScript actions.

Some examples of well-polished Shiny apps are available at https://shiny.rstudio.com/gallery/.

Today you will get familiar with the work flow involved in developing and publishing a Shiny app, creating a more advanced user interface, modifying the server function, and displaying reactive output.


Getting started

To get started, follow the steps below.

  1. If needed, run install.packages("shiny") in your R Console to install package shiny.

  2. If needed, run install.packages("crypto") in your R Console to install package crypto

  3. Go to File > New File > Shiny Web App

  4. Enter your application’s name

  5. Keep option Single File (app.R) selected

  6. Enter the directory of where the application should be saved

  7. File app.R should open

  8. Delete all contents except what is necessary to run a basic Shiny app:

library(shiny)

# Build UI
ui <- fluidPage( 

)

# Define server function
server <- function(input, output) { 

}

# Run the application 
shinyApp(ui = ui, server = server)

You should not change the file name app.R. To stay organized, keep each shiny app in its own directory.

You will use functions in package crypto to create a web-based app that provides price and market capitalization data on cryptocurrencies. In many of the tasks below functional R code is given to you. However, you need to modify the code to make it reactive within the Shiny environment.

After each task, run your app to verify it matches the image below, when provided. Reference https://shawn-santo.shinyapps.io/crypto/ for a fully functional app.

Build the user interface

First, you will focus on creating object ui. Reference the slides as needed.

Task 1

After library(shiny), add library(tidyverse) and library(crypto). Include the below function for a custom plot theme. Take a look at help(package = "crypto") to see the available functions in package crypto.

theme_custom <- function() {
  theme_bw() +
    theme(
          axis.title = element_text(size = 16), 
          title = element_text(size = 20),
          legend.title = element_text(size = 10),
          legend.text = element_text(size = 10),
          axis.text.x = element_text(size = 12),
          axis.text.y = element_text(size = 12),
          plot.caption = element_text(size = 10))
}



Task 2

Use function navbarPage() with two tabPanel() functions. Give a title inside navbarPage() of “Crypto Explorer”. Title the first tab “Charts” and the second tab “Top Coins”. Inside the first tabPanel() titled “Charts” use sidebarLayout() with sidebarPanel() and mainPanel().

After you make the changes, run your app. It should look like the image below.



Task 3

Inside sidebarPanel() include a text input box and a date range input. Default values are given in the image below. Inside mainPanel() include two plot output functions: one will be to show the price, the other will be to show the coin’s volume.

After you make the changes, run your app. It should look like the image below.



Task 4

Inside tabPanel() titled “Top Coins”, include two column() functions to divide the page. The first should have width = 4 and the second should have width = 8. Inside the first column function where the width is set to 4, add a numeric input box. The default value is given in the image below. Inside the second column function where the width is set to 8, add a table output.

After you make the changes, run your app. It should look like the image below.



Build function server()

R code will be given, but you need to modify it to make it reactive within the Shiny environment. Hence, you will need to use an appropriate render function or create a reactive expression as well as pull the inputs. When you see < > in the code below it needs to be filled with an input.

Task 5

First, create the price chart.

After you make the changes, run your app. It should look like the image below.

data <- crypto_history(coin = < >,
                       start_date = gsub("-", "", < >, fixed = T),
                       end_date = gsub("-", "", < >, fixed = T))

data %>%
  ggplot(mapping = aes(x = date, y = close)) +
  geom_line(color = "#428BCA", size = 1.5) +
  labs(x = "Date", y = "Closing price ($)",
       title = paste("Price of ", < >, sep = "")) +
  theme_custom()



Task 6

Next, create the volume chart.

After you make the changes, run your app. It should look like the image below.

data <- crypto_history(coin = < >,
                       start_date = gsub("-", "", < >, fixed = TRUE),
                       end_date = gsub("-", "", < >, fixed = TRUE))

data %>%
  ggplot(mapping = aes(x = date, y = volume / 10 ^ 6)) +
  geom_line(color = "#a3c586", size = 1.5) +
  labs(x = "Date", y = "Volume (in millions)") +
  theme_custom()



Task 7

Lastly, you will create a table to display the top coins by market capitalization.

After you make the changes, run your app. It should look like the image below.

crypto_prices() %>%
  select(Rank = (rank), Symbol = symbol, Name = name,
         Price = price_usd, Cap = market_cap_usd) %>%
  mutate(Rank = as.factor(Rank)) %>%
  slice(1:< >)



Task 8

Try to modify the code in your server function so you do not pull the data twice from function crypto_history().

Task 9

Add something new to your app. It could be a new input, a new output, or a new tab. Maybe tidy up the plots. See what information you can pull from the functions in package crypto.

Share your app

After you finish your app, publish it on https://www.shinyapps.io/. Create a free account at that website if you have not yet done so.

To publish your app, click the button next to “Run App” and follow the steps to link your account from https://www.shinyapps.io/.