I’m writing a fairly significant React/React Native app right now (hope to have something releasable by the end of summer). I posted a gist not too long ago showing how to get RN up and running in under 5 minutes: https://gist.github.com/dwhitney/e2a040432040607ae519fdf05cbc27ad
First, Halogen definitely won’t work with RN because of its purescript-dom
dependency. If you even so much as whisper “DOM” or “window” in the vicinity of a RN app, it will immediately crash with an obscure error leaving you hopeless and helpless. This is true even if you think that stuff is safely buried in a function that definitely won’t get called.
From there, I think the people who’ve created purescript-react
and purescript-reactnative
have done a good job, but they both fall victim to the common issue most wrapper libraries have: they fall woefully out of date. I say this now after both have just been updated, so take my criticism with a grail of salt - but when I started my app, both libraries were on different versions of react and upgrading purescript-reactnative
to the same version of purescript-react
caused purescript-reactnative
to immediately crash because the lib referenced a component that had been removed from react native (a navigation thing IIRC). I forked and fixed this and made a PR but saw that someone had done the same several months earlier and it hadn’t been merged. C’est la vie. I’m far worse about this stuff that the authors of these libraries are, so I hope this isn’t taken as harsh criticism, but simply a fact one must adapt to when joining a relatively new language.
In light of all of this I decided to “roll my own”. This is simpler than it sounds. If you look through the source of purescript-reactnative
you see that most of the library is unlocked by these 40 lines of code (most of which I don’t need) https://github.com/doolse/purescript-reactnative/blob/master/src/ReactNative/Unsafe/Components.js – I figured I could just do that too, which is essentially what my gist up top does. Next I noticed that purescript-react-basic
unlocks React with about 60 lines of code: https://github.com/lumihq/purescript-react-basic/blob/master/src/React/Basic.js – figured I could do that too, so I did, and you can see the most essential elements of both working in the gist.
Beyond that, I wanted to make sure that I kept up to date with the latest version of React and React Native, so I took my dev environment a step beyond what is typical and added babel and flow. I added a separate directory for JavaScript code where I write ES6 with Flow types that are compiled into the PureScript src
directories. This makes upgrading a breeze since I get Flow checks against the JavaScript libraries whenever I want.
To make my code work in both web and RN, I wrote a little Component DSL and CSS DSL that works with purescript-run
and accompanying interpreters that write either React or React Native. Though I didn’t plan this, I recently got the added benefit of trivial server side rendering since that was simply another interpreter. It has worked out well (much thanks to Nate Faubion for the fantastic libs!).
I have liked this approach so much that I’m pretty much on the mindset now that wrapper libraries should be avoided and you ought to bite the bullet and write a touch of FFI when needed (under 200 lines in our case, which represents 0.01% of the codebase).
HTH