This commit is contained in:
orion 2023-10-06 18:43:48 -05:00
parent 28eef73c01
commit 9d3fee618d
Signed by: orion
GPG Key ID: 6D4165AE4C928719

View File

@ -22,23 +22,19 @@ this frontend app:
1. fetches data from a server 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. 1. if ok, render items in a list. if error, render error span at the bottom of the page.
<table> <details>
<thead> <summary>React (click to expand)</summary>
<td><b>React</b></td>
<td><b>Halogen</b></td>
<thead>
<tbody>
<tr>
<td>
```javascript ```typescript
export const App = () => { type Item = {id: string, title: string, description: string}
const [items, setItems] = React.useState(undefined)
const [error, setError] = React.useState(undefined) export const App: () => React.Node = () => {
const [items, setItems] = React.useState<Array<Item> | undefined>(undefined)
const [error, setError] = React.useState<Error | undefined>(undefined)
React.useEffect(() => { React.useEffect(() => {
fetch('/api/item') fetch('/api/item')
.then(rep => rep.json()) .then(rep => rep.json<Array<Item>>())
.then(items => setItems(items)) .then(items => setItems(items))
.catch(e => setError(e)) .catch(e => setError(e))
}, []) }, [])
@ -60,8 +56,10 @@ export const App = () => {
} }
``` ```
</td> </details>
<td>
<details>
<summary>Purescript Halogen (click to expand)</summary>
```haskell ```haskell
type Item = { id :: String type Item = { id :: String
@ -106,7 +104,4 @@ app = mkComponent
} }
``` ```
</td> </details>
</tr>
</tbody>
</table>