Intro to reactR

Kent Russell

2023-10-10

Why reactR?

react has become incredibly popular, and the ecosystem around react is robust. reactR aims to allow R users to more easily incorporate react and JSX.

Install

install.packages("reactR")

# for the latest development version
#  install from Github
# devtools::install_github("timelyportfolio/reactR")

Quick Example

Let’s use react to render a simple h1 HTML element below.

library(reactR)
library(htmltools)

attachDependencies(
  tags$script(
  "
    ReactDOM.render(
      React.createElement(
        'h1',
        null,
        'Powered by React'
      ),
      document.getElementById('react-heading-here')
    )
  "
  ),
  html_dependency_react()
)

Blog Post

For more on how we can use R and React, see the blog post React in R. Also, there are many more examples in the Github repo at inst/examples.

Using JSX

JSX helps ease some of the burden caused by React.createElement. reactR provides a babel_transform() function to use JSX. Hopefully, in the future, we can convince RStudio to modify htmltools to work directly with JSX (see issue).