react-haskell: Haskell React bindings

[ library, mit, web ] [ Propose Tags ]

This package provides high level bindings to Facebook's React library, meant for use with Haste.

React is a JavaScript library for building user interfaces. React (and React-Haskell) is focused on just UI - it's not a framework.

Currently React-Haskell can render simple stateful components, but not what React calls classes. Put another way, React-Haskell doesn't support lifecycle methods yet.

Here's a simple example which demonstrates basic elements, attributes, state, and handling events.

-- We're creating a class with JSString state
data Example
instance ReactKey Example where
    type ClassState Example = JSString
    type AnimationState Example = ()
    type Signal Example = JSString

-- updating to the new state without animation
transition :: JSString -> JSString -> (JSString, [AnimConfig Example])
transition oldState signal = (signal, [])

view :: JSString -> React Example ()
view str = div_ [ class_ "container" ] $ do
    input_ [ value_ str, onChange (Just . targetValue) ]

main :: IO ()
main = withElem "id" $ \elem ->
    render elem =<< createClass view transition "" () []
Versions [RSS] [faq],,, 2.0.0, 2.0.1
Dependencies base (>=4.5 && <5), deepseq, haste-compiler, haste-lib (>=0.4 && <0.6), lens-family, monads-tf, transformers, void (==0.7) [details]
License MIT
Author Joel Burget
Category Web
Home page
Bug tracker
Source repo head: git clone
Uploaded by joelb at 2015-01-04T20:05:55Z
Distributions NixOS:2.0.1
Downloads 3033 total (31 in the last 30 days)
Rating (no votes yet) [estimated by Bayesian average]
Your Rating
  • λ
  • λ
  • λ
Status Hackage Matrix CI
Docs uploaded by user
Build status unknown [no reports yet]



Manual Flags

Automatic Flags

Built with haste-inst/hastec


Use -f <flag> to enable a flag, or -f -<flag> to disable that flag. More info


Maintainer's Corner

For package maintainers and hackage trustees