Episode 26: Peeling back the curtain of Movie Vue R (Part 1)
Go behind the (gorgeous) scenes of the Movie Vue R app with Herman Sontrap and Kent Russell!
Resources mentioned in the episode
- Movie Vue R Shiny App: friss.shinyapps.io/shiny-vue-r
- Contest Submission Post on RStudio Community
- App GitHub repository: github.com/FrissAnalytics/shiny-vue-r
- Discussion slides available at this link
- Vue.js - Progressive JavaScript framework: vuejs.org
- Vuetify - Material design framework for Vue: vuetifyjs.com
- HTML templates article: shiny.rstudio.com/articles/templates.html
- Material design icons: materialdesignicons.com
- http-vue-loader - load .vue files from your HTML/JS: github.com/FranckFreiburger/http-vue-loader
- Vuex getting started guide: vuex.vuejs.org/guide
- Vue Router - The official router for Vue.js: router.vuejs.org
- UI component for Globe Data Visualization using ThreeJS/WebGL: globe.gl
- Lodash - A modern JavaScript utility library delivering modularity, performance & extras: lodash.com
- d3.js - Data-Driven Documents: d3js,org
- Mitt - Tiny 200b functional event emitter / pubsub: github.com/developit/mitt
- Overlay Scrollbars - A javascript scrollbar plugin which hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling: kingsora.github.io/OverlayScrollbars
- Kent’s listviewer HTML widget for viewing lists: cran.r-project.org/package=listviewer
- plumber - Turn your R code into a web API: www.rplumber.io
Episode Timestamps
00:00:00 Episode Introduction
00:01:00 Introduction to Herman Sontrop
00:06:10 Introduction to Kenton Russell
00:10:00 High-level walkthrough of Movie Vue R
00:19:25 Diving into the code that drives Movie Vue R
00:22:35 Overview and motivation behind Vue
00:38:30 Vue instance example
00:40:00 Vue reactivty examples
00:46:10 Vue.js components are like Shiny modules
00:49:50 Single file components
00:54:16 Breaking down a Vue component into useful parts; props, data, methods, computed, and watch
00:57:20 Vuetify, tap into many pre-built components, styles, and more
01:10:00 Covid Globe Example in Shiny app
01:12:40 Rendering a ggplot
01:15:15 Summarizing parts of the Movie Vue R app
01:19:10 A look at template.html. A detailed walk through the organization of the app’s HTML and files
01:26:30 Where R and Shiny are added to a Vue app. And how your app can send messages back to Shiny and R
01:31:20 Loading images and ggplots
01:38:00 Episode wrapup
shinydevseries::session_info()
📽 Find previous interviews at https://shinydevseries.com
📋 Feedback is more than welcome! Please send your comments or suggestions on our contact form at shinydevseries.com/contact
If you enjoyed this video or got value from it, then consider dropping something in the tip jar. Any money raised will be used to improve the channel and invest in additional equipment and resources to make the content even better!
📨 Help shape the future direction of the Shiny Developer Series live streams by completing this very short survey
Media production for the Shiny Developer Series is made possible by these outstanding projects and platforms:
- OBS Studio: https://obsproject.com/
- OBS Fully Loaded install script by Martin Wimpress: https://github.com/wimpysworld/obs-fully-loaded
- VDO Ninja: https://vdo.ninja
- StreamElements: https://streamelements.com
- ShotCut: https://shotcut.org/
- Pop@_OS by System76: https://pop.system76.com/
- Ubuntu: https://ubuntu.com/