Shiny basics for interactive apps in R Programming - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this Shiny app's text output?

Consider this Shiny app code snippet. What will be displayed in the app's main panel when the slider is moved to 5?

R Programming

library(shiny)

ui <- fluidPage(
  sliderInput("num", "Choose a number", min = 1, max = 10, value = 1),
  textOutput("result")
)

server <- function(input, output) {
  output$result <- renderText({
    paste("You selected", input$num * 2)
  })
}

shinyApp(ui, server)

A You selected NULL

B You selected 1

C You selected 5

D You selected 10

💡 Hint

Remember the slider value is multiplied by 2 before displaying.

The slider input value is 5, and the server multiplies it by 2, so the text output shows "You selected 10".

🧠 Conceptual

intermediate

Which reactive function updates automatically when input changes?

In Shiny, which function is used to create a reactive expression that updates automatically when its inputs change?

A observeEvent()

B renderUI()

C reactive()

D isolate()

💡 Hint

Think about a function that returns a value and updates reactively.

The reactive() function creates reactive expressions that update automatically when their inputs change. observeEvent() is for side effects, renderUI() creates UI outputs, and isolate() prevents reactive updates.

🔧 Debug

advanced

Why does this Shiny app not update the plot when slider changes?

Look at this server code snippet. The plot does not update when the slider input changes. What is the cause?

R Programming

server <- function(input, output) {
  output$plot <- renderPlot({
    x <- 1:10
    y <- x * 2
    plot(x, y)
  })
}

A The plot does not use input$num, so it never reacts to slider changes.

B renderPlot() is missing parentheses after it.

C The plot function is incorrect and causes an error.

D The server function is missing a return statement.

💡 Hint

Check if the reactive input is used inside renderPlot.

The plot code does not use input$num or any reactive input, so Shiny does not know to update the plot when the slider changes.

📝 Syntax

advanced

Which option causes a syntax error in Shiny UI definition?

Which of these UI code snippets will cause a syntax error?

A

fluidPage(
  titlePanel("App Title"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("num", "Number", 1, 10, 5),
    ),
    mainPanel(
      textOutput("text")
    )
  )
)

B

)
)  
)    
)"txet"(tuptuOtxet      
(lenaPniam    
,)    
)5 ,01 ,1 ,"rebmuN" ,"mun"(tupnIredils      
(lenaPrabedis    
(tuoyaLrabedis  
,)"eltiT ppA"(lenaPeltit  
(egaPdiulf

C

luidPage(
  titlePanel("App Title"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("num", "Number", 1, 10, 5)
    ),
    mainPanel(
      textOutput("text")
    )
  )
)

D

fluidPage(
  titlePanel("App Title"),
  sidebarLayout(
    sidebarPanel(
      sliderInput("num", "Number", 1, 10, 5)
    ),
    mainPanel(
      textOutput("text")
    )
  )
)

💡 Hint

Look for misplaced commas inside function calls.

Option A has an extra comma after the sliderInput call inside sidebarPanel, causing a syntax error.

🚀 Application

expert

How many items are in the reactiveValues list after this code runs?

Given this server code, how many items does vals contain after the app starts?

R Programming

server <- function(input, output, session) {
  vals <- reactiveValues()
  vals$a <- 10
  vals$b <- 20
  observe({
    vals$c <- vals$a + vals$b
  })
}

A 2

B 3

C 1

D 0

💡 Hint

Consider when the observe block runs and what it adds to vals.

Initially, vals has 'a' and 'b'. The observe block runs immediately and adds 'c', so vals has 3 items.

Practice

1. In a Shiny app, what is the main role of the ui part?

easy

A. To perform calculations and data processing

B. To define what the user sees and interacts with

C. To store data permanently

D. To connect to external databases

Solution

1. Step 1: Understand the purpose of ui in Shiny

   The ui defines the layout and elements the user interacts with, like buttons and plots.

2. Step 2: Differentiate from server role

   The server handles logic and calculations, not the ui.

3. Final Answer:

   To define what the user sees and interacts with -> Option B

4. Quick Check:

   ui = user interface [OK]

Hint: Remember UI means User Interface, what users see [OK]

Common Mistakes:

• Confusing ui with server
• Thinking ui does data processing
• Assuming ui stores data

2. Which of the following is the correct way to create a numeric input in Shiny's UI?

easy

A. numericInput(inputId = "num", label = "Number", value = 0)

B. numericInput("Number", inputId = "num", value = 0)

C. numericInput(0, "Number", 0)

D. numericInput(label = "Number", value = 0)

Solution

1. Step 1: Recall numericInput syntax

   The correct order is numericInput(inputId, label, value).

2. Step 2: Check each option

   numericInput(inputId = "num", label = "Number", value = 0) matches the correct syntax exactly; others have wrong argument order or missing arguments.

3. Final Answer:

   numericInput(inputId = "num", label = "Number", value = 0) -> Option A

4. Quick Check:

   Correct argument order = numericInput(inputId = "num", label = "Number", value = 0) [OK]

Hint: Remember inputId first, then label, then value [OK]

Common Mistakes:

• Mixing argument order
• Omitting inputId
• Using unnamed arguments incorrectly

3. What will be the output shown in the Shiny app if the server code is:

server <- function(input, output) {
  output$text <- renderText({
    paste("Hello", input$name)
  })
}

and the UI has a textInput with inputId = "name" where the user types "Alice"?

medium

A. Error: object 'name' not found

B. input$name

C. Hello input$name

D. Hello Alice

Solution

1. Step 1: Understand renderText and input usage

   The renderText function returns text that updates automatically using input$name.

2. Step 2: Substitute input$name with user input

   User typed "Alice", so paste("Hello", input$name) becomes "Hello Alice".

3. Final Answer:

   Hello Alice -> Option D

4. Quick Check:

   Dynamic text output = "Hello Alice" [OK]

Hint: renderText shows text with input values replaced [OK]

Common Mistakes:

• Thinking input$name prints literally
• Confusing renderText with renderPrint
• Expecting error due to input usage

4. Identify the error in this Shiny server code snippet:

server <- function(input, output) {
  output$plot <- renderPlot({
    plot(data)
  })
}

Assuming data is not defined anywhere else.

medium

A. Missing definition of 'data' causes an error

B. renderPlot should be renderPlotly

C. output$plot should be output$plotOutput

D. plot() cannot be used inside renderPlot

Solution

1. Step 1: Check for variable definitions

   The code uses data inside plot() but data is not defined anywhere.

2. Step 2: Understand consequences of missing data

   This will cause an error because R cannot find the object data.

3. Final Answer:

   Missing definition of 'data' causes an error -> Option A

4. Quick Check:

   Undefined variable = error [OK]

Hint: Always define variables before using in render functions [OK]

Common Mistakes:

• Assuming plot() is invalid in renderPlot
• Confusing output variable names
• Thinking renderPlotly is required

5. You want to create a Shiny app that shows a histogram of a numeric variable chosen by the user from a dropdown menu. Which approach correctly connects the input and output?

hard

A. Use sliderInput to select variable, then plot histogram of entire data

B. Use numericInput for variable choice, then plot fixed variable in server

C. Use selectInput in UI for variable choice, then in server use renderPlot to plot histogram of data[[input$var]]

D. Use textInput for variable name, then plot histogram of input$var directly

Solution

1. Step 1: Choose correct input control for variable selection

   selectInput lets user pick a variable name from choices.

2. Step 2: Use input to select data column in server

   Access the chosen variable as data[[input$var]] and plot histogram with renderPlot.

3. Final Answer:

   Use selectInput in UI for variable choice, then in server use renderPlot to plot histogram of data[[input$var]] -> Option C

4. Quick Check:

   Dropdown input + dynamic plot = Use selectInput in UI for variable choice, then in server use renderPlot to plot histogram of data[[input$var]] [OK]

Hint: Use selectInput for choices, access with data[[input$var]] [OK]

Common Mistakes:

• Using numericInput instead of selectInput
• Trying to plot input$var directly without data
• Using sliderInput for variable selection