2023-10-06 23:13:31 +00:00
|
|
|
# thunderstrike.ai intern resources
|
|
|
|
|
|
|
|
## purescript
|
2023-10-06 23:35:07 +00:00
|
|
|
**Purescript** is a strongly-typed <a href="https://en.wikipedia.org/wiki/Type_safety"><sup>[type safety]</sup></a>
|
|
|
|
purely functional <a href="https://en.wikipedia.org/wiki/Purely_functional_programming"><sup>[purely functional]</sup></a>
|
|
|
|
programming language that compiles to javascript (like typescript).
|
2023-10-06 23:13:31 +00:00
|
|
|
|
2023-10-06 23:35:07 +00:00
|
|
|
### In brief
|
|
|
|
<ul>
|
|
|
|
<li>
|
|
|
|
effectful code
|
|
|
|
<a href="https://en.wikipedia.org/wiki/Side_effect_(computer_science)"><sup>[side effect]</sup></a>
|
|
|
|
is isolated from non-effectful code. This makes programs much more consistent to run and reason about.
|
|
|
|
</li>
|
|
|
|
<li>everything is an expression</li>
|
|
|
|
<li>interacting with raw javascript is relatively painless</li>
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
### Motivating example: React vs Halogen
|
2023-10-06 23:45:29 +00:00
|
|
|
You don't have to understand exactly how these examples work,
|
|
|
|
I'm providing them simply for you to glance over and get a feeling
|
|
|
|
for reading typescript/javascript vs purescript.
|
|
|
|
|
|
|
|
This app:
|
2023-10-06 23:35:07 +00:00
|
|
|
1. renders `"Loading..."` until either data or error
|
|
|
|
1. fetches data from a server
|
|
|
|
1. if ok, render items in a list. if error, render error span at the bottom of the page.
|
|
|
|
|
2023-10-06 23:43:48 +00:00
|
|
|
<details>
|
|
|
|
<summary>React (click to expand)</summary>
|
|
|
|
|
|
|
|
```typescript
|
|
|
|
type Item = {id: string, title: string, description: string}
|
|
|
|
|
|
|
|
export const App: () => React.Node = () => {
|
|
|
|
const [items, setItems] = React.useState<Array<Item> | undefined>(undefined)
|
|
|
|
const [error, setError] = React.useState<Error | undefined>(undefined)
|
2023-10-06 23:35:07 +00:00
|
|
|
|
|
|
|
React.useEffect(() => {
|
|
|
|
fetch('/api/item')
|
2023-10-06 23:43:48 +00:00
|
|
|
.then(rep => rep.json<Array<Item>>())
|
2023-10-06 23:35:07 +00:00
|
|
|
.then(items => setItems(items))
|
|
|
|
.catch(e => setError(e))
|
|
|
|
}, [])
|
|
|
|
|
|
|
|
return error !== undefined
|
|
|
|
? (<p class="error">{error.message}</p>)
|
|
|
|
: items === undefined
|
|
|
|
? (<p>Loading...</p>)
|
|
|
|
: items.map(item => {
|
|
|
|
return (
|
|
|
|
<div key={item.id}>
|
|
|
|
<p>{item.title}</p>
|
2023-10-06 23:39:25 +00:00
|
|
|
<span class="small">
|
|
|
|
{item.description}
|
|
|
|
</span>
|
2023-10-06 23:35:07 +00:00
|
|
|
</div>
|
|
|
|
)
|
|
|
|
})
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
2023-10-06 23:43:48 +00:00
|
|
|
</details>
|
|
|
|
|
|
|
|
<details>
|
|
|
|
<summary>Purescript Halogen (click to expand)</summary>
|
2023-10-06 23:37:34 +00:00
|
|
|
|
2023-10-06 23:35:07 +00:00
|
|
|
```haskell
|
2023-10-06 23:45:29 +00:00
|
|
|
type Item = { id :: String, title :: String, description :: String }
|
2023-10-06 23:41:16 +00:00
|
|
|
|
2023-10-06 23:40:38 +00:00
|
|
|
data State
|
|
|
|
= StateEmpty
|
|
|
|
| StateErrored Error
|
|
|
|
| StateGotItems (Array Item)
|
2023-10-06 23:35:07 +00:00
|
|
|
|
2023-10-06 23:40:38 +00:00
|
|
|
data Action = ActionInit
|
|
|
|
|
2023-10-06 23:45:29 +00:00
|
|
|
renderItem item = div [] [ p [] [text item.title]
|
|
|
|
, span
|
|
|
|
[className "small"]
|
|
|
|
[text item.description]
|
|
|
|
]
|
2023-10-06 23:35:07 +00:00
|
|
|
|
|
|
|
renderApp StateEmpty = p [] [text "Loading..."]
|
|
|
|
renderApp (StateErrored e) = p [className "error"] [text (message e)]
|
|
|
|
renderApp (StateGotItems items) = map renderItem items
|
|
|
|
|
2023-10-06 23:40:38 +00:00
|
|
|
action ActionInit = do
|
2023-10-06 23:35:07 +00:00
|
|
|
response <- fetch (URL "/api/item") {method: Get}
|
|
|
|
jsonString <- text response
|
|
|
|
itemsOrError <- readJSON jsonString
|
|
|
|
case itemsOrError of
|
|
|
|
Right items -> put (StateGotItems items)
|
|
|
|
Left error -> put (StateErrored error)
|
|
|
|
|
|
|
|
app = mkComponent
|
|
|
|
{ initialState: StateEmpty
|
|
|
|
, render: renderApp
|
2023-10-06 23:45:29 +00:00
|
|
|
, eval: mkEval ( defaultEval { handleAction = action, initialize: Just ActionInit } )
|
2023-10-06 23:35:07 +00:00
|
|
|
}
|
2023-10-06 23:13:31 +00:00
|
|
|
```
|
2023-10-06 23:37:34 +00:00
|
|
|
|
2023-10-06 23:43:48 +00:00
|
|
|
</details>
|