create a new post about webr in tlg-catalog (#166)

* create a new post about webr in tlg-catalog

* rename article; change date

* typo; add to wordlist

* address review comments

R/help_create_blogpost.R

@@ -40,7 +40,8 @@ create_post <- function(post_name,
                           "metacore",
                           "displays",
                           "falcon",
-                          "NEST"
+                          "Shiny",
+                          "TLG"
                         )) {
   path_to_img <- "media"
   available_images <- list.files(path_to_img) %>% tools::file_path_sans_ext()

inst/WORDLIST.txt

@@ -722,3 +722,10 @@ Rlogo
 sessioninfo
 valuelevel
 writeup
+asis
+Pawel
+py
+ropensci
+Rucki
+runiverse
+thecoatlessprofessor

posts/2024-05-08_tlg_catalog_webr/appendix.R

@@ -0,0 +1,73 @@
+library(dplyr)
+# markdown helpers --------------------------------------------------------
+
+markdown_appendix <- function(name, content) {
+  paste(paste("##", name, "{.appendix}"), " ", content, sep = "\n")
+}
+markdown_link <- function(text, path) {
+  paste0("[", text, "](", path, ")")
+}
+
+
+
+# worker functions --------------------------------------------------------
+
+insert_source <- function(repo_spec, name,
+                          collection = "posts",
+                          branch = "main",
+                          host = "https://github.com",
+                          text = "Source",
+                          file_name) {
+  path <- paste(
+    host,
+    repo_spec,
+    "tree",
+    branch,
+    collection,
+    name,
+    file_name,
+    sep = "/"
+  )
+  return(markdown_link(text, path))
+}
+
+insert_timestamp <- function(tzone = Sys.timezone()) {
+  time <- lubridate::now(tzone = tzone)
+  stamp <- as.character(time, tz = tzone, usetz = TRUE)
+  return(stamp)
+}
+
+insert_lockfile <- function(repo_spec, name,
+                            collection = "posts",
+                            branch = "main",
+                            host = "https://github.com",
+                            text = "Session info") {
+  path <- path <- "https://pharmaverse.github.io/blog/session_info.html"
+
+  return(markdown_link(text, path))
+}
+
+
+
+# top level function ------------------------------------------------------
+
+insert_appendix <- function(repo_spec, name, collection = "posts", file_name) {
+  appendices <- paste(
+    markdown_appendix(
+      name = "Last updated",
+      content = insert_timestamp()
+    ),
+    " ",
+    markdown_appendix(
+      name = "Details",
+      content = paste(
+        insert_source(repo_spec, name, collection, file_name = file_name),
+        # get renv information,
+        insert_lockfile(repo_spec, name, collection),
+        sep = ", "
+      )
+    ),
+    sep = "\n"
+  )
+  knitr::asis_output(appendices)
+}

posts/2024-05-08_tlg_catalog_webr/tlg_catalog_webr.qmd

@@ -0,0 +1,70 @@
+---
+title: "TLG Catalog 🤝 WebR"
+author:
+  - name: Pawel Rucki
+description: "Introducing WebR to TLG Catalog: A Game Changer for Interactive Learning"
+date: "2024-05-08"
+# please do not use any non-default categories.
+# You can find the default categories in the repository README.md
+categories: [TLG, Shiny]
+# feel free to change the image
+image: "tlg_catalog.png"
+
+---
+
+<!--------------- typical setup ----------------->
+
+```{r setup, include=FALSE}
+long_slug <- "2024-05-08_tlg_catalog_webr"
+# renv::use(lockfile = "renv.lock")
+```
+
+<!--------------- post begins here ----------------->
+
+[![](tlg_catalog.png){fig-align="center" width="220"}](https://insightsengineering.github.io/tlg-catalog)
+
+[TLG Catalog website](https://insightsengineering.github.io/tlg-catalog)
+
+# Introducing WebR to TLG Catalog: A Game Changer for Interactive Learning
+
+I'm thrilled to announce a major update to the [TLG Catalog](https://insightsengineering.github.io/tlg-catalog). We have integrated [`WebR`](https://docs.r-wasm.org/webr/latest/) to the website transforming the way you interact with the R code. You don't have to copy and run code separately, open containers and/or install packages. With WebR, you can now interact with the TLG source R code directly in your browser, making learning more interactive and enjoyable than ever before!
+
+![](recording_static.gif){fig-align="center"}
+
+## What is `WebR`?
+
+> WebR makes it possible to run R code in the browser without the need for an R server to execute the code: the R interpreter runs directly on the user’s machine.
+
+_Source: [WebR documentation](https://quarto-webr.thecoatlessprofessor.com/)_
+
+In short, [`WebR`](https://docs.r-wasm.org/webr/latest/) is a project that aims to port R into [`WebAssembly`](https://webassembly.org/) (WASM) which then allows to run compiled code in the website. A special thanks to George Stagg from Posit for making this integration possible. While [`WebR`](https://docs.r-wasm.org/webr/latest/) is still in active development, a significant progress had been made recently increasing its robustness and efficiency.
+
+However, it's important to note a limitation: not all packages are compatible with [`WebR`](https://docs.r-wasm.org/webr/latest/). A package must be compiled for WebAssembly to be used with [`WebR`](https://docs.r-wasm.org/webr/latest/). Fortunately, there's a dedicated [WebR binary R package repository](https://repo.r-wasm.org) hosting close to 20,000 packages. For packages not yet available, you can utilize a dedicated [GitHub Actions workflow](https://github.com/r-wasm/actions) to build them yourself, or use [r-universe](https://r-universe.dev/) platform that [will build it for you](https://ropensci.org/blog/2023/11/17/runiverse-wasm/).
+
+## Implementation Details
+
+The integration of [`WebR`](https://docs.r-wasm.org/webr/latest/) into [TLG Catalog](https://insightsengineering.github.io/tlg-catalog) was made possible through a dedicated [`quarto-webr` Quarto extension](https://quarto-webr.thecoatlessprofessor.com/), which simplifies the integration process. The main challenge was to ensure a DRY (Don't Repeat Yourself) approach with respect to the existing codebase. This was achieved through leveraging lesser-known `knitr` features, including `knitr::knit_code$get()` to reuse code chunks as well as `results = "asis"` to create code chunk from within another (parent) code chunk. The source code for this is open-source and available on [GitHub](https://github.com/insightsengineering/tlg-catalog/blob/main/book/_utils/webr.qmd).
+
+## Interactive `teal` Applications via `shinylive`
+
+The benefits of [`WebR`](https://docs.r-wasm.org/webr/latest/) extend beyond TLG outputs. It also enhances all existing [`teal`](https://insightsengineering.github.io/teal/) applications. Users can now interact with applications and even live-edit their source code! Everything is inside the website itself without any additional application hosting service. This was made possible through the [`shinylive` Quarto extension](https://quarto-ext.github.io/shinylive/) leveraging [`Shinylive`](https://shiny.posit.co/py/docs/shinylive.html) under the hood. A huge thank you to the `Shiny` team for their contributions!
+
+![](recording_app.gif){fig-align="center"}
+
+## Summary
+
+The addition of interactivity via [`WebR`](https://docs.r-wasm.org/webr/latest/) marks a significant milestone for [TLG Catalog](https://insightsengineering.github.io/tlg-catalog). This update unlocks a myriad of possibilities previously unavailable, such as live code editing, step-by-step code execution, access to function documentation, and dynamic data exploration. This advancement brings R closer to users, especially those new to the language, fostering a more engaging and effective learning experience.
+
+Happy learning!
+
+<!--------------- appendices go here ----------------->
+
+```{r, echo=FALSE}
+source("appendix.R")
+insert_appendix(
+  repo_spec = "pharmaverse/blog",
+  name = long_slug,
+  # file_name should be the name of your file
+  file_name = list.files() %>% stringr::str_subset(".qmd") %>% first()
+)
+```