Learn R Programming

⚠️There's a newer version (2.3.4) of this package.Take me there.

bs4Dash

Bootstrap 4 shinydashboard using AdminLTE3

New users moving to bs4Dash v2.0.0

Taking the simple {shinydashboard} example:

library(shiny)
library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(title = "Basic dashboard"),
  dashboardSidebar(),
  dashboardBody(
    # Boxes need to be put in a row (or column)
    fluidRow(
      box(plotOutput("plot1", height = 250)),

      box(
        title = "Controls",
        sliderInput("slider", "Number of observations:", 1, 100, 50)
      )
    )
  )
)

server <- function(input, output) {
  set.seed(122)
  histdata <- rnorm(500)

  output$plot1 <- renderPlot({
    data <- histdata[seq_len(input$slider)]
    hist(data)
  })
}

shinyApp(ui, server)

Starting from v2.0.0, moving to {bs4Dash} is rather simple:

library(bs4Dash)
ui <- dashboardPage(
  dashboardHeader(title = "Basic dashboard"),
  dashboardSidebar(),
  dashboardBody(
    # Boxes need to be put in a row (or column)
    fluidRow(
      box(plotOutput("plot1", height = 250)),

      box(
        title = "Controls",
        sliderInput("slider", "Number of observations:", 1, 100, 50)
      )
    )
  )
)

server <- function(input, output) {
  set.seed(122)
  histdata <- rnorm(500)

  output$plot1 <- renderPlot({
    data <- histdata[seq_len(input$slider)]
    hist(data)
  })
}

shinyApp(ui, server)

Upgrading bs4Dash to 2.0.0

  • {bs4Dash} is undergoing major rework to make it easier to come from {shinydashboard}. The current development version 2.0.0 provides a 1:1 supports, in other word moving from {shinydashboard} to {bs4Dash} is accomplished by changing library(shinydashboard) to library(bs4Dash).

  • {bs4Dash} v2.0.0 also provides 1:1 with {shinydashboardPlus} to ease compatibility.

  • Apps built with {bs4Dash} version <= 0.5.0 are definitely not compatible with v2.0.0 due to substantial breaking changes in the API. We advise users to keep the old version for old apps and move to to the new version for newer apps.

Installation

# latest devel version
devtools::install_github("RinteRface/bs4Dash")
# from CRAN
install.packages("bs4Dash")

Demo

See a working example on shinyapps.io here. You may also run:

library(bs4Dash)
bs4DashGallery()

Issues

Issues are listed here.

Acknowledgement

I warmly thank Glyphicons creator for providing them for free with Bootstrap.

Code of Conduct

Please note that the bs4Dash project is released with a Contributor Code of Conduct. By contributing to this project, you agree toabide by its terms.

Copy Link

Version

Install

install.packages('bs4Dash')

Monthly Downloads

3,681

Version

2.2.1

License

GPL (>= 2) | file LICENSE

Issues

Pull Requests

Stars

Forks

Maintainer

David Granjon

Last Published

December 20th, 2022

Functions in bs4Dash (2.2.1)

attachmentBlock

AdminLTE3 attachment container
bs4Badge

Create a Bootstrap 4 dashboard badge item
cardDropdown

Create a box dropdown item list
actionButton

Bootstrap 4 Action button/link
createAlert

Create a Bootstrap 4 alert on the server side
bs4CardLabel

Create a label for Boostrap 4 card
descriptionBlock

AdminLTE3 description block
app_container

Create container for bs4Dash demo app
bs4Accordion

Bootstrap 4 accordion container
appButton

AdminLTE2 special large button
column

Boostrap 4 column system
bs4DashBrand

Alternative to simple text title
bs4DashGallery

Launch the bs4Dash Gallery
cardProfile

AdminLTE3 card profile
bs4DashBody

Boostrap 4 dashboard body
bs4Callout

Create a Bootstrap 4 callout
bs4CardSidebar

Create a sidebar for Boostrap 4 card
bs4CardLayout

Bootstrap 4 container for cards
bs4DashControlbar

Create a Boostrap 4 dashboard right sidebar
bs4Carousel

Bootstrap 4 carousel
bs4DashPage

Create a Boostrap 4 dashboard page
dropdownDivider

Create a box dropdown divider
bs4UserMenu

Bootstrap 4 user profile.
findSidebarItem

Internally used by sidebarMenu to find treeview items and normal items.
bs4DropdownMenu

Boostrap 4 dashboard dropdown menu
getAdminLTEColors

Get all AdminLTE colors.
bs4DashFooter

Dashboard Footer
bs4DashNavbar

Boostrap 4 dashboard navbar
menuItemOutput

Create a sidebar menu item output (client side)
ionicon

BS4 ionicons
pagination

Bootstrap 4 pagination widget
bs4Loading

AdminLTE3 loading state element
bs4Jumbotron

BS4 jumbotron for AdminLTE3
bs4ListGroup

BS4 list group for AdminLTE3
bs4DashSidebar

Create a Boostrap 4 dashboard main sidebar
renderbs4InfoBox

Boostrap 4 info box
insertTab

Insert a tabPanel in a tabsetPanel
dropdownMenuOutput

Create a dropdown menu output (client side)
menuOutput

Create a dynamic menu output for bs4Dash (client side)
popover

Create a Bootstrap 4 popover from the UI side
bs4Quote

Boostrap 4 block quote
bs4Sortable

BS4 sortable section
bs4Stars

AdminLTE3 stars
skinSelector

AdminLTE3 skin selector
sidebarMenuOutput

Create a sidebar menu output (client side)
bs4Ribbon

Boostrap 4 ribbon
productList

AdminLTE3 product list container
bs4ProgressBar

AdminLTE3 progress bar
bs4TabCard

Create a Boostrap 4 tabCard
bs4Table

Boostrap 4 table container
bs4SocialCard

AdminLTE3 social card
toast

Create an adminLTE toast
userList

AdminLTE3 user list container
bs4UserCard

AdminLTE3 widget user card
bs4Timeline

AdminLTE3 timeline block
useAutoColor

Plot auto-color module
tooltip

Create a Bootstrap 4 Tooltip from the UI side
userPostMedia

AdminLTE3 user post media
validColors

Valid colors
userPost

AdminLTE3 user post
userMessages

AdminLTE3 user message container
renderMenu

Create dynamic menu output (server side)
tabsetPanel

Create a tabsetPanel
validStatuses

Valid statuses
validNuances

Valid nuances
renderbs4ValueBox

Create a value box (server side)
tagAssert

Assert that a tag has specified properties
validStatusesPlus

Valid statuses extra