Albert Rapp Profile picture
🎓 Math PhD student & freelancer 👨‍🏫 Bite-sized insights on dataviz, web dev & data science with R at https://t.co/M34b5BzHTD

Dec 14, 2022, 16 tweets

Analytics dashboards are a popular way to explore data or to communicate insights.

So it's good to know how to build one.

Here's how you do that with R in no time. 🧵 #rstats #shiny

1 // Data

First, you need data.

It's always fun to work with your personal data, so I will use my the last three months of my Twitter analytics data. You can download yours at analytics.twitter.com

You could also download the public metrics with {rtweet} instead.

2 // Data cleaning

Next, do a bit of data cleaning. In my case, I just have to clean the column names and select a few columns.

{janitor} and {dplyr} make that easy.

3 // Set up dashboard

Now, we can already start building the dashboard.

Use {shiny} and {bs4Dash} to set up the dashboard. The UI elements from {bs4Dash} make that really simple

3b // UI elements from {bs4Dash}

Basically what you need are the modular dashboardXYZ() functions and bs4Cards().

4 // Fill sidebars

Now you can include your data in your app.
Use it to fill the sidebars with sliders.

The easiest way is to write a wrapper around the sliderInput() and use it to fill the sidebar.

5 // Add table

The sliders will be used to filter our data. Once it is filtered, we can put it into a table with {reactable}.

This is a 3-step process:

1️⃣ Add reactableOutput() to the UI
2️⃣ Create a reactive for the filtered data
3️⃣ Render table with renderReactable()

5b // Table formatting

The table columns could use some formatting. You can do that within the reactable() function.

If you're not familiar with {reactable}, you can just follow along the *many* examples in the excellent docs at glin.github.io/reactable/arti…

6 // Add a box

Adding boxes works on both the UI and the server side.

In the UI, use bs4ValueBoxOutput().

In the server, do two things:
1️⃣ Compute metric summary
2️⃣ Render Value box

6b // Repeat for more boxes

You can repeat the same procedure to include more boxes.

The best way to do that is with modules. Since they are best explained in a separate example, I'll just leave this here:

7 // Add interactive plots

Finally, we can add interactive plots with {plotly} using plotlyOutput() + renderPlotly().

And the best part: You don't need to know how {plotly} works. Just make a ggplot and convert it with ggplotly().

7b // Repeat for more plots

Once again, you can repeat the same logic to include more plots with or without modules. The choice is yours.

8 // Reactivity to dark theme

Finally, we need to make sure that the table and the plots react to the dashboard's dark theme toggle.

For the plot, load {thematic} and activate it with thematic_shiny().
For the table, follow the instructions from the docs glin.github.io/reactable/arti…

Yay! 🥳 We've successfully built an analytics dashboard.

Need more details? You can check out the micro-course I've set up for this project.

It comes with code for the completed app and a full video walk-through. You can get it at courses.albert-rapp.de/l/shiny-analyt…

That's a wrap! 🙌

I hope you've found this thread helpful. If you want to see more content like this, follow @rappa753 for more. ☺️

Also, don't forget to Like/Retweet the first tweet below if you can.

See you next time! 👋

If you liked this post, you may enjoy my 3-minute newsletter too.

Every week, my newsletter shares insights on
- dataviz,
- Shiny web apps
- stats

Reading time: 3 minutes or less

You can join at
alberts-newsletter.beehiiv.com/subscribe

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling