Skip to content

Reagentλ︎

Reagent provides a ClojureScript interface to React.js, simplifying the development of single page apps and web user interfactes. Reagent apps are very fast as immutable data structures makes calculating virtual dom changes extremely efficient.

React components are ClojureScript functions, state is held in ClojureScript data structures and the user interface can be generated using a Hiccup-like syntax.

TODO::work in progress, sorryλ︎

Designing a Reagent appλ︎

A simple reagent app consists of 3 main sections

  • state - shared between one or more components
  • components - behavior of the application, such as rendering content
  • rendering - render components and update them when state changes

Stateλ︎

The application state is modeled using Clojure data structures, e.g. hash-maps, vectors, contained within a reagent atom.

A reagent atom is a mutable container into which new values can be swapped or reset in a controlled way (Software Transactional Memory)

Components are Clojure functionsλ︎

(defn hello []
  [:div "I am a reagent component, defining HTML content using the hiccup style syntax"])

Renderingλ︎