Skip to content

Creating a new learning module

Joe Marlo edited this page Mar 6, 2023 · 10 revisions

Creating a new learning module

Learning modules should be structured as Shiny modules and follow the golem framework. The process to create a new module is:

  1. Use the dev/02_dev.R script to create a new module template
  2. Write your learning module
  3. Integrate the module into the main application by placing it in the R/app_ui.R and R/app_server.R files

Adding it to the main application

  • app_ui.R: Add code in two places. Follow the pattern in the dashboard body here and dashboard sidebar here
  • app_server.R: Add code in the server following the pattern here
  • Store the module ID in the module_ids object established in the R/utils_global.R file
  • model_learn.R: Add a new bs4Dash::box and selector in the landing page UI and server

Adding a quiz

The module R/mod_quiz.R creates interactive quizzes to be used within learning modules. Please see R/mod_learn_post_treatment.R for an example of incorporating a quiz. The quiz content should be in a separate utils script. For example, the post-treatment module has the R/fct_learn_post_treatment.R script that contains the questions and answers.

Storing data

csvs and other files can be store in the /inst/extdata subdirectory. The files should be referenced using the app_sys() function. E.g. app_sys('extdata', 'post_treatment_plants_df.csv', mustWork = TRUE)

Any data that is going to be read by JavaScript should be stored within the web application (i.e. the /www folder). See the estimands module for an example.

Storing markdowns

The article's text content should be stored in markdowns and saved within the www folder. For example, the post-treatment module has multiple markdowns stored in /www/learn/post-treatment/markdowns/ directory. These are pulled into the module via the includeMarkdown() and app_sys() commands: includeMarkdown(app_sys("app", "www", "learn", "post-treatment", "markdowns", 'post_treatment_1.md'))

Creating scrollytells

scrollytells can be created using R or using JavaScript. For most use cases, the R implementation is the simplest and easiest to manage. The test module R/mod_learn_scrolly_example.R contains an example of the R implementation. The underlying R functions are in R/fct_scrollytell.R and rely on a JavaScript script in /www/js/scrollytell.js and CSS file in /www/css/scrollytell.css.

The JavaScript method is much complex but allows for D3.js visualizations instead of R generated .png plots. {TODO: JS scrollytell}

Creating D3 visualizations

{TODO}