Search code examples
reactjsclojurescriptreagent

How to prepare a React.js component for usage in ClojureScript as an external Reagent component?


I would like to use this React.js component as a foreign Reagent component in a ClojureScript application :

https://github.com/felixrieseberg/React-Spreadsheet-Component.

This component is however not available in the repository:

http://cljsjs.github.io/.

If a React.js component is available in the directory then using it with Reagent would be as simple as in the following example.

(ns demo.views
  (:require [reagent.core :as reagent]
            [cljsjs.reactable]])

(defn example []
  [:div
  [:> Reactable.Table
    {:data (clj->js [
                 {:name "Foo" :section 51}
                 {:name "Bar" :section 51}
                 ])}
    ]
   ]
  )

I would like to know what I would have to do with the React Spreadsheet Component such that I can use it in a similar simple way. How to prepare a React.js component for usage in ClojureScript as an external Reagent component? Please provide a clear recipe type of description.

Note: This question How to use a ReactJS Component with Clojurescipt/Reagent looks similar but does not answer my question.


Solution

  • It boils down to how you want to do JavaScript interop... you have 3 choices:

    1. Include the js from your HTML file
    2. Build it as part of your compilation
    3. Include it as a library

    I encourage you to try (3); it isn't difficult, just follow the steps on CLJSJS https://github.com/cljsjs/packages/wiki/Creating-Packages