
How to write PureScript react components to replace JavaScript - JacksonGariety
https://thomashoneyman.com/articles/replace-react-components-with-purescript/
======
chvid
This is the corresponding code written in React using hooks:

    
    
        export const Counter = ({label, counterType, onClick}) => {
            const [counter, setCounter] = useState(0);
            return (
                <button onClick={() => {
                    counterType == "Increment" && setCounter(counter + 1);
                    counterType == "Decrement" && setCounter(counter - 1);
                    onClick && onClick();
                }}>
                    {label}: {counter}
                </button>
            );
        }
    

I think the case for PureScript React would be more convincing if the code you
ended up with was loosely as concise as the above.

~~~
kalyantm
Exactly my thought. I've always loved FP, I write JS in a FP style at work,
and have always wanted to get into learning something like Elm/PureScript (and
eventually Haskell) but I feel like it takes ages to get productive. That
PureScript React example alone has me thinking twice. But as a general
question, what would be a better way to approach these languages?

~~~
bgorman
Consider looking at ReasonML and ReasonReact, you can write stringly typed
code at first, later you can start relying on type inference and ADTs

~~~
omniscient_oce
Yeah, ReasonML and ReasonReact are great because you're still writing JSX and
not some over-engineered voodoo rewrite of React and/or JS but you get the
power of strong types and ADTs and a super fast compiler.

------
evanrelf
You can also use React Hooks in PureScript with purescript-react-basic-
hooks[1].

Or for a more native PureScript approach to single-page web apps, check out
purescript-halogen[2] and purescript-halogen-hooks[3] (created by the author
of this article).

[1]: [https://github.com/spicydonuts/purescript-react-basic-
hooks](https://github.com/spicydonuts/purescript-react-basic-hooks)

[2]: [https://github.com/purescript-halogen/purescript-
halogen](https://github.com/purescript-halogen/purescript-halogen)

[3]: [https://github.com/thomashoneyman/purescript-halogen-
hooks](https://github.com/thomashoneyman/purescript-halogen-hooks)

------
quickthrower2
Is PureScript nice to use again? Tried it a year or two ago and it relied
heavily on Bower and I had a hard time getting anything to work on Windows -
lots of Bower errors and such. I tried it a few years ago and got it to work,
but in that case getting Halogen to compile the most basic app just stuck the
compiler into a freeze for minutes, so I gave up. But I am not shitting on
PureScript, it looks like a fantastic way to develop JS apps, and I'd love to
use it.

~~~
jamil7
I'm also wondering the same thing, after the whole Elm meltdown I've been
looking for something similar to learn on the side.

~~~
tannhaeuser
Elm meltdown?

~~~
goldenkey
[https://news.ycombinator.com/item?id=22821447](https://news.ycombinator.com/item?id=22821447)

------
andrenth
Not to hijack the thread, but I’ve recently learned that Purescript-Native has
a Go target [1].

Does anyone have experience with this? How practical would it be to use this
where one would otherwise use Go?

[1] [https://discourse.purescript.org/t/purescript-native-can-
now...](https://discourse.purescript.org/t/purescript-native-can-now-target-
golang/878)

------
azangru
How is Purescript these days?

I haven't heard many news from its ecosystem since Phil Freeman stepped down
from its active development. Purescript by Example must be quite outdated by
now? I know that Alex Kelley is still working on his set of tutorials "Make
the Leap from Javascript to Purescript"[0]. Anything else interesting going
on?

I feel like there was a lot of excitement about Purescript in around
2015-2016, but then it sort of died out?

0 - [https://github.com/adkelley/javascript-to-
purescript](https://github.com/adkelley/javascript-to-purescript)

~~~
TexInWien
There's plenty of interesting activity going on:

The Discourse (
[https://discourse.purescript.org/](https://discourse.purescript.org/) ) and
Slack channels ( [https://fpchat-invite.herokuapp.com/](https://fpchat-
invite.herokuapp.com/) ) are active (and quite welcoming / helpful).

A community fork of "PureScript by Example" is being updated / maintained,
here: [https://book.purescript.org/](https://book.purescript.org/)

Try PureScript is back online after a hiatus:
[https://try.purescript.org/](https://try.purescript.org/)

The compiler is now at version 0.13.8 with reasonably regular updates (and
0.14.0 should be on the way reasonably soon):
[https://github.com/purescript/purescript/releases](https://github.com/purescript/purescript/releases)

Spago, the new(ish) package manager, is quite nice:
[https://github.com/purescript/spago](https://github.com/purescript/spago)

The VSCode integration is solid. I'd say the tooling story is pretty good,
over all.

Work is underway to provide a package registry, since bower is being phased
out:
[https://github.com/purescript/registry](https://github.com/purescript/registry)

Halogen 5 was released recently: [https://github.com/purescript-
halogen/purescript-halogen](https://github.com/purescript-halogen/purescript-
halogen)

------
lightgreen
> JavaScript apps to PureScript > Both companies have seen a dramatic drop in
> bugs in production.

I suspect if they migrated from JavaScript to TypeScript instead they would
have seen the same dramatic drop in bugs, but also migrated much quicker and
would be able to hire engineers easier, and development speed would have
increased (because of much better tooling/IDE/interop).

I think PureScript is a very bright project, I even want to try it myself, but
realistically, comparison to plain JavaScript is not the best benchmark.

------
oweqruiowe
How do they connect child components to parts of the application state in
PureScript? I'm looking for a mechanism like react-redux's `connect` function.
Something that eliminates the need to pass state through the root component
down to everything else.

------
michaelcampbell
I admire his CLI approach to things, but this just seems dogmatic:

    
    
        echo -e "\noutput\n.psc*\n.purs*\.spago" >> .gitignore
    

Sure, ok, saying "add these entries to your .gitignore" is too pedestrian?

~~~
e12e
At least I'd prefer a simple here-doc:

    
    
      tee -a .gitignore <<'EOF'
      output
      .psc*
      .purs*
      .spago
      EOF
    

(or use:

    
    
      cat <<'EOF' >> .gitignore
      output
      .psc*
      .purs*
      .spago
      EOF
    

But I think the tee-version more readily emphasize what's going on, and works
with sudo).

------
fristys
Holy shit that syntax looks disgusting. No way Jose.

------
Osiris
The article says that PureScript helped them reduce bugs but fails to give any
examples of how PureScript prevented bugs.

Looking at the examples, the code seems to function the same so it's not
obvious what problem is being solved that warrants teaching a whole dev team a
new language.

In my experience, the vast majority of React app bugs are 1) state management,
or 2) asynchronousisty. How does PureScript help to prevent those two classes
of bugs?

~~~
roebk
In my experience the vast majority of React bugs are standard bugs you'd find
in any JavaScript program, null reference errors. PureScript will force you to
handle nulls as a Maybe, preventing a whole class of bugs.

------
BFatts
Do we need another strongly typed language that compiles to JavaScript? If
that's so important, why don't people use C/C++ and compile that to WASM for
best performance too? We've got TypeScript... is it necessary to have yet
another language??

~~~
jamil7
Purescript is from a different family and has different goals. Overall though
more languages and more choice is a good thing. Typescript (I'm thankful it's
around) is just the path of least resistance and has therefore become the
defacto.

------
barbarbar
It seems like a horrible idea to introduce this one off framework where ever
you go. I feel sorry for the companies that has to carry the burden of the
rewrite to something known. This should be used for a hobby at home.

------
edem
Why would anyone write purescript when we have typescript?

~~~
rkangel
I would phrase the question as "why would you write Typescript when we have
Purescript (or ReasonML)"?

Why would you choose to write a language who's type system is much less
expressive than languages like Purescript? Why not have that expressive power
and its ability to prevent some classes of bugs, and still have good interop
with JS?

~~~
e12e
I was actually thinking, why would you use purescript for react, when you
could use reasonml?

[https://reasonml.github.io/reason-
react/docs/en/components](https://reasonml.github.io/reason-
react/docs/en/components)

[https://reasonml.github.io/reason-react/docs/en/usestate-
eve...](https://reasonml.github.io/reason-react/docs/en/usestate-event-value)

As far as I can tell the integration is cleaner and has better support from
upstream? I guess it's not Haskell - but I really would be interested in why
you would choose purescript for this use-case (personal preference is a fine
reason, but I'd at least hope that preference goes beyond merely syntax?).

~~~
rkangel
No, I actually prefer Reason.

I'm happy to argue the benefits of either. The differences between it and
Purescript are much smaller than the differences between them and most things.

