Onderdelen van een shinydashboard-UI

De restaurantanalogie kwam terug in de video. Daar zag je dat een shinydashboard eigenlijk een type shinyApp is met een dashboardoutput. Daardoor kun je het opsplitsen in de UI- en serverdelen. Bovendien kun je de UI van een shinydashboard verder opdelen in kleinere componenten.

Begrijpen wat deze componenten zijn helpt je om je eerste shinydashboard in elkaar te zetten.

Welke van deze functies definiëren de UI van een shinydashboard?

Deze oefening maakt deel uit van de cursus

Dashboards bouwen met shinydashboard

Interactieve oefening met praktijkervaring

Zet theorie om in actie met een van onze interactieve oefeningen

Deze oefening maakt deel uit van de cursus

Dashboards bouwen met shinydashboard

SkillTag.level.beginnerSkillTag.label

4.7+

Begin gratis met de cursus

Voordat je een shinydashboard bouwt, is het belangrijk om te begrijpen wat een shinyApp is. In dit hoofdstuk leer je wat een shinyApp is en waaruit een shinyApp bestaat. Aan het einde van dit hoofdstuk kun je je eigen shinyApp renderen.

Exercise 1: Aan de slag met shiny-apps Exercise 2: Onderdelen van een shinyApp Exercise 3: Een lege shinyApp Exercise 4: Soorten input Exercise 5: Oefenen met sliderInput Exercise 6: Meerdere inputs invoegen Exercise 7: checkboxInput en checkboxGroupInput Exercise 8: Soorten output Exercise 9: textOutput met interacties Exercise 10: Keuzemenu's Exercise 11: Je eerste shinyApp

In het vorige hoofdstuk heb je shiny apps leren kennen. In dit hoofdstuk zie je dat een shinydashboard eigenlijk gewoon een andere shiny app is, maar dan met meer instelbare functies. Dezelfde outputs en inputs die in het vorige hoofdstuk zijn besproken, kun je hier op precies dezelfde manier gebruiken. Daarna leer je eenvoudig wireframen voor een dashboard, waarbij je kunt bepalen waar je outputs en inputs in het dashboard plaatst.

Exercise 1: Onderdelen van een shinydashboard Exercise 2: Onderdelen van een shinydashboard-UI

Huidige oefening

Exercise 3: Je eerste (lege) dashboard Exercise 4: De header en de zijbalk Exercise 5: Header- en sidebar-functies Exercise 6: Een header instellen Exercise 7: Een sidebar instellen Exercise 8: De body Exercise 9: Wireframing met boxes Exercise 10: Wireframing Exercise 11: Je eerste shinydashboard Exercise 12: Helperfuncties Exercise 13: Instellingen voor header en zijbalk Exercise 14: De body en het afronden van de UI Exercise 15: Je eerste dashboard bouwen

In dit hoofdstuk leer je je shinydashboard verder te verbeteren door interactieve elementen toe te voegen. Denk aan grafieken, geospatiale kaarten en tabellen waarmee gebruikers van het dashboard in real-time kunnen werken.

Exercise 1: Interactieve grafieken met plotly Exercise 2: Je eigen plotly-plots maken Exercise 3: Begrijpen wat de beperkingen van plotly zijn Exercise 4: Geospatiale kaarten met sf Exercise 5: Typen sf-objecten Exercise 6: sf-plots met plot()Exercise 7: sf-plots met ggplot Exercise 8: Geospatiale kaarten met leaflet Exercise 9: Lagen van een leaflet-kaart Exercise 10: Je eerste leaflet-kaart maken Exercise 11: Interactieve elementen in een shinydashboard Exercise 12: Hulpfuncties maken Exercise 13: Je eerste shinydashboard met interactieve elementen

Nu je vertrouwd bent met shinydashboard, kunnen we ontwerpelementen toevoegen. We kunnen achtergrondkleuren aanpassen, boxafmetingen wijzigen enzovoort. We bespreken ook enkele basisprincipes van goede UI/UX. Tot slot laten we zien hoe je statuses en CSS-opmaak kunt gebruiken.

Exercise 1: Goede UI/UX-praktijken Exercise 2: Inzicht in UI/UX-principes Exercise 3: Wireframing met UI/UX-principes Exercise 4: Statussen, kleuren en skins Exercise 5: Statuses instellen Exercise 6: Kleuren instellen Exercise 7: Shinydashboard-skins wijzigen Exercise 8: Aanpassen met CSS-opmaak Exercise 9: Goede UI/UX-praktijken en een warming-up Exercise 10: Statuses en de UI afronden Exercise 11: Pas je shinydashboard aan met CSS Exercise 12: Afronding