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.
How to write PureScript react components to replace JavaScript
11–20 of 74 posts
Re: How to write PureScript react components to replace JavaScript
#12This is the corresponding code written in React using hooks: export const Counter = ({label, counterType, onClick}) => { const [counter, setCounter] = useState(0); return ( { counterType == "Increment" && setCounter(counter + 1); counterType == "Decrement" && setCounter(counter - 1); onClick && onClick(); }}> {label}: {counter} ); } I think the case for PureScript React would be more convincing if the code you ended…
Also, you can get compile-time strict typing in Typescript with some minor annotations added to that: export const Counter: FunctionComponent void }> = ({ label, counterType, onClick }) => { const [counter, setCounter] = useState (0); return ( { counterType == "Increment" && setCounter(counter + 1); counterType == "Decrement" && setCounter(counter - 1); onClick && onClick(); }}> {label}: {counter} ); }
Yes.
You can add types if you want. And maybe one can discuss if there is a more elegant syntax than the C-style syntax of JavaScript (there is ...).
Other than that. I think the code is about as concise as it gets.
Re: How to write PureScript react components to replace JavaScript
#13Is 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…
I'm also wondering the same thing, after the whole Elm meltdown I've been looking for something similar to learn on the side.
Re: How to write PureScript react components to replace JavaScript
#14This is the corresponding code written in React using hooks: export const Counter = ({label, counterType, onClick}) => { const [counter, setCounter] = useState(0); return ( { counterType == "Increment" && setCounter(counter + 1); counterType == "Decrement" && setCounter(counter - 1); onClick && onClick(); }}> {label}: {counter} ); } I think the case for PureScript React would be more convincing if the code you ended…
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?
Elm shouldn't take more than a week to be productive if you know other existing language. I ran a study group where people spent few hours a week, the group took 7 meetings to finishing the book and discussing a variety of possible problems to solve with Elm. It's a much simpler language than PureScript.
Re: How to write PureScript react components to replace JavaScript
#15Earlier quoted context omitted.
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?
Consider looking at ReasonML and ReasonReact, you can write stringly typed code at first, later you can start relying on type inference and ADTs
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.
Re: How to write PureScript react components to replace JavaScript
#16Is 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…
I'm also wondering the same thing, after the whole Elm meltdown I've been looking for something similar to learn on the side.
Elm meltdown?
Re: How to write PureScript react components to replace JavaScript
#17This is the corresponding code written in React using hooks: export const Counter = ({label, counterType, onClick}) => { const [counter, setCounter] = useState(0); return ( { counterType == "Increment" && setCounter(counter + 1); counterType == "Decrement" && setCounter(counter - 1); onClick && onClick(); }}> {label}: {counter} ); } I think the case for PureScript React would be more convincing if the code you ended…
The snippets in the article are not using React with hooks. I imagine it would be more similar to your example if the snippets used purescript-react-basic-hooks[1] [1]: https://github.com/spicydonuts/purescript-react-basic-hooks
No, they're using more 'old fashioned' class-based components with state; function-based components using hooks is the modern way of writing React. Less boilerplate, for one.
Re: How to write PureScript react components to replace JavaScript
#18This is the corresponding code written in React using hooks: export const Counter = ({label, counterType, onClick}) => { const [counter, setCounter] = useState(0); return ( { counterType == "Increment" && setCounter(counter + 1); counterType == "Decrement" && setCounter(counter - 1); onClick && onClick(); }}> {label}: {counter} ); } I think the case for PureScript React would be more convincing if the code you ended…
Pedantic and what always happens when someone posts code on the internet, but, I'd extract the onClick function and provide a default value for the onclick parameter for readability, and use cleverness to show off:
export const Counter = ({label, counterType, onClick}) => {
const [counter, setCounter] = useState(0);
onClick = onClick || () => {};
const handleClick = () => {
const modifier = counterType === "Increment" ? 1 : -1;
setCounter(counter + modifier);
onClick();
}
return (
{label}: {counter}
);
}
Re: How to write PureScript react components to replace JavaScript
#19Earlier quoted context omitted.
I'm also wondering the same thing, after the whole Elm meltdown I've been looking for something similar to learn on the side.
Elm meltdown?
Re: How to write PureScript react components to replace JavaScript
#20This is the corresponding code written in React using hooks: export const Counter = ({label, counterType, onClick}) => { const [counter, setCounter] = useState(0); return ( { counterType == "Increment" && setCounter(counter + 1); counterType == "Decrement" && setCounter(counter - 1); onClick && onClick(); }}> {label}: {counter} ); } I think the case for PureScript React would be more convincing if the code you ended…
Pedantic and what always happens when someone posts code on the internet, but, I'd extract the onClick function and provide a default value for the onclick parameter for readability, and use cleverness to show off: export const Counter = ({label, counterType, onClick}) => { const [counter, setCounter] = useState(0); onClick = onClick || () => {}; const handleClick = () => { const modifier = counterType === "Increment…
You should also use useCallback for handleClick