6.7 Case study

This is one of the first shiny apps I wrote, it pulls data for a specific user from Stack Overflow, works out which “tags” they have received the most votes for, then plots those top tags in a word cloud.

6.7.1 The initial app (app-01.R)

How might this app be improved?

  • Code
    • stackr eagerly obtains data from stack overflow (maybe it should wait til user has input a complete user ID)
  • UX
    • Visual style is boring (maybe it should look more like stack overflow?)
    • Could we input user name, rather than ID?
    • Could we show the user-name / image, so the user knows they’ve copied in the correct user ID
    • Can we add some extra plots / tables and make a multipage layout
# Plot a wordcloud to summarise the tags that a stack-overflow user tends to
# answer/ask about

library(shiny)
library(wordcloud)
library(stackr)

# Helper functions

make_word_cloud <- function(df) {
  with(
    df,
    wordcloud::wordcloud(
      words = tag_name,
      freq = answer_score,
      min.freq = 0,
      colors = RColorBrewer::brewer.pal(6, "Purples")[-1],
      scale = c(10, 0.5)
    )
  )
}

# Define UI for application that plots information about a user's stack
# overflow presence

ui <- fluidPage(

  # Application title
  titlePanel("Stack Overflow: User Statistics"),

  # Sidebar for selecting which Stack Overflow user's data is presented
  sidebarLayout(
    sidebarPanel(
      textInput("user_id", "Select a Stack Overflow user ID:", "1845650")
    ),

    # Show a plot of a wordcloud of the user's answer-tags
    mainPanel(
      plotOutput("word_cloud")
    )
  )
)

# Define server logic required to obtain data from stack-overflow and draw a
# wordcloud
server <- function(input, output) {
  stack_data <- reactive(
    stackr::stack_users(input[["user_id"]], "top-tags"),
  )

  output$word_cloud <- renderPlot(
    make_word_cloud(stack_data())
  )
}

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

6.7.2 The final app (app.R)

Relative to the original app, we have:

  • introduced a new results table (containing the data obtained from stack-overflow)
  • converted from a single-panel to a multi-panel layout (using tabsetPanel and two tabPanels)
  • attempted to use the stack-overflow colour scheme as part of the apps theme, and also in the wordcloud colour scheme

The stack overflow colour scheme was obtained by using the browser’s developer tools (here using “Inspect” in chromium and looking at the “styles” section) on an open SO page.

# Plot a wordcloud to summarise the tags that a stack-overflow user tends to
# answer/ask about

library(shiny)
library(wordcloud)
library(stackr)

# Helper functions

make_word_cloud <- function(df) {
  with(
    df,
    wordcloud::wordcloud(
      words = tag_name,
      freq = answer_score,
      min.freq = 0,
      colors = RColorBrewer::brewer.pal(6, "Purples")[-1],
      scale = c(10, 0.5)
    )
  )
}

# Define UI for application that plots information about a user's stack
# overflow presence

ui <- fluidPage(

  # Application title
  titlePanel("Stack Overflow: User Statistics"),

  # Sidebar for selecting which Stack Overflow user's data is presented
  sidebarLayout(
    sidebarPanel(
      textInput("user_id", "Select a Stack Overflow user ID:", "1845650")
    ),

    # Show a plot of a wordcloud of the user's answer-tags
    mainPanel(
      plotOutput("word_cloud")
    )
  )
)

# Define server logic required to obtain data from stack-overflow and draw a
# wordcloud
server <- function(input, output) {
  stack_data <- reactive(
    stackr::stack_users(input[["user_id"]], "top-tags"),
  )

  output$word_cloud <- renderPlot(
    make_word_cloud(stack_data())
  )
}

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