Flexdashboards are a simple R Markdown template and make laying out dashboards (with or without interactivity from Shiny) very simple. For more information about flexdashboards, go to rmarkdown.rstudio.com/flexdashboard/. Creating a flexdashboard in RStudio is incredibly easy. First, install the package with install.packages("flexdashboard"). Then, just select from File | New File | R Markdown... | From Template | Flex Dashboard | OK:

As with most RStudio documents, it comes prefilled with the boilerplate code to make the structure of a dashboard. You can see the structure straight away if you like, by clicking Knit in RStudio (or by calling rmarkdown::render("yourFileName.Rmd")).

The boilerplate dashboard looks like this:

Let's make a very simple static dashboard first to learn more about it, and then we'll look at some more advanced layout features and add some interactive Shiny elements. Here is the finished dashboard:

I've used the default layout that is returned when you select a flexdashboard template, which is structured very simply like this, by modifying the headings:

Column {data-width=650}
-----------------------------------------------------------------------
### Life expectancy over time
```{r}
*Code*
```

Column {data-width=350}
-----------------------------------------------------------------------
### Life expectancy
```{r}
*Code*
```

### GDP per capita
```{r}
*Code*
```

As you can see, the dashboard is laid out in columns, with the width defined in {} brackets at each column definition. Chunks are defined as you'd expect in any R Markdown document, with ### as a heading and ```{r} ... ``` wrapping the code. Flexdashboard will neatly arrange the output for you in columns.

Simple! Now, let's look at doing something a bit different with the layout, and we'll add some Shiny at the same time. To turn a flexdashboard into a Shiny dashboard, just add runtime: shiny to the options at the top (this part of the document is called the YAML header). While we're here, let's also lay out the application with rows, rather than columns. Simply change orientation: columns to orientation: rows.

So, now your header should look like the following:

---
title: "Shiny gapminder"
runtime: shiny
output: 
 flexdashboard::flex_dashboard:
 orientation: rows
 vertical_layout: fill
---

Let's now define a column with a sidebar and place our controls in it as normal, as follows:

```{r setup, include=FALSE}
library(flexdashboard)
library(leaflet)
 ```
Column {.sidebar}
-----------------------------------------------------------------------

```{r}
sliderInput("year",
 "Years included",
 min = 1952,
 max = 2007,
 value = c(1952, 2007),
 sep = "",
 step = 5
)

checkboxInput("linear", label = "Add trend line?", value = FALSE)
```

And now, we can access those values as normal in the output. One of the output values is defined as normal, except as a row rather than a column:

Row
-----------------------------------------------------------------------
### Life expectancy over time

```{r}
renderPlot({
 
 thePlot = mapData %>%
 filter(year >= input$year[1], year <= input$year[2]) %>%
 group_by(continent, year) %>%
 summarise(meanLife = mean(lifeExp)) %>%
 ggplot(aes(x = year, y = meanLife, group = continent, colour = continent)) +
 geom_line()
 
 if(input$linear){ 
 thePlot = thePlot + geom_smooth(method = "lm") 
 } 
 
 print(thePlot)
})
```

Note that, in this case, we can't define a reactive object to filter the year values, as we did before, so we filter by date within each output item (which is bad coding practice in a normal Shiny application, of course). We'll put the other output items in a tabset, as follows:

Row {.tabset}
-----------------------------------------------------------------------

### Life expectancy
```{r}
renderLeaflet({
 
 mapData %>%
 filter(year == input$year[2]) %>%
 leaflet() %>%
 addTiles() %>%
 setView(lng = 0, lat = 0, zoom = 2) %>%
 addCircles(lng = ~ lon, lat = ~ lat, weight = 1,
 radius = ~ lifeExp * 5000, 
 popup = ~ paste(country, lifeExp))
})
```

### GDP per capita
```{r}
renderLeaflet({
 
 mapData %>%
 filter(year == input$year[2]) %>%
 leaflet() %>%
 addTiles() %>%
 setView(lng = 0, lat = 0, zoom = 2) %>%
 addCircles(lng = ~ lon, lat = ~ lat, weight = 1,
 radius = ~ log(gdpPercap) * 25000, 
 popup = ~ paste(country, gdpPercap))
})
```

And that's it. Pretty simple. The finished article looks like this:

It's a pretty smart-looking dashboard, considering how simple it is to code. There are lots more options for flexdashboards, including the use of Shiny modules (covered in Chapter 8, Code Patterns in Shiny Applications) as well as different methods of laying out flexdashboards. Visit the link given previously for more information. For the rest of this chapter, we will be looking at full Shiny applications.