Tata letak sidebar

Fungsi tata letak memungkinkan input dan keluaran diatur secara visual dalam UI. Pemilihan tata letak yang tepat membuat aplikasi Shiny lebih menarik secara estetis, sekaligus meningkatkan pengalaman pengguna.

Pada latihan ini, Anda akan memodifikasi tata letak sebuah aplikasi Shiny yang memungkinkan pengguna mengeksplorasi popularitas nama-nama kekinian. Aplikasi akhir Anda seharusnya secara visual menyerupai berikut ini:

An app where the name selector appears in the left sidebar, while the graph appears on the right in the main panel

Latihan ini merupakan bagian dari kursus

Membangun Aplikasi Web dengan Shiny di R

Lihat Kursus

Instruksi latihan

Ubah tata letak aplikasi ini sehingga pemilih nama muncul di sidebar dan plot serta tabel muncul di sebelah kanan.

Latihan interaktif langsung praktik

Cobalah latihan ini dengan melengkapi kode contoh ini.

ui <- fluidPage(
  # MODIFY CODE BELOW: Wrap in a sidebarLayout
    # MODIFY CODE BELOW: Wrap in a sidebarPanel
    selectInput('name', 'Select Name', top_trendy_names$name),
    # MODIFY CODE BELOW: Wrap in a mainPanel
    plotly::plotlyOutput('plot_trendy_names'),
    DT::DTOutput('table_trendy_names')
)

# DO NOT MODIFY
server <- function(input, output, session){
  # Function to plot trends in a name
  plot_trends <- function(){
     babynames %>% 
      filter(name == input$name) %>% 
      ggplot(aes(x = year, y = n)) +
      geom_col()
  }
  output$plot_trendy_names <- plotly::renderPlotly({
    plot_trends()
  })
  
  output$table_trendy_names <- DT::renderDT({
    babynames %>% 
      filter(name == input$name)
  })
}

shinyApp(ui = ui, server = server)

Edit dan Jalankan Kode