mirror of
https://github.com/roc-lang/roc.git
synced 2024-09-20 15:27:45 +03:00
virtual-dom: client and server Roc files with shared interface
This commit is contained in:
parent
e963f1f37e
commit
20f4e77d5d
38
examples/virtual-dom-wip/ExampleApp.roc
Normal file
38
examples/virtual-dom-wip/ExampleApp.roc
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
interface ExampleApp
|
||||||
|
exposes [exampleApp, State]
|
||||||
|
imports [
|
||||||
|
pf.Html.{ App, Html, html, head, body, div, text, h1 },
|
||||||
|
]
|
||||||
|
|
||||||
|
State : {
|
||||||
|
answer : U32,
|
||||||
|
}
|
||||||
|
|
||||||
|
exampleApp : App State State
|
||||||
|
exampleApp = {
|
||||||
|
init,
|
||||||
|
render,
|
||||||
|
wasmUrl: "assets/example-client.wasm",
|
||||||
|
}
|
||||||
|
|
||||||
|
init = \result ->
|
||||||
|
when result is
|
||||||
|
Ok state -> state
|
||||||
|
Err _ -> { answer : 0 }
|
||||||
|
|
||||||
|
render : State -> Html State
|
||||||
|
render = \state ->
|
||||||
|
num = Num.toStr state.answer
|
||||||
|
|
||||||
|
html [] [
|
||||||
|
head [] [],
|
||||||
|
body [] [
|
||||||
|
h1 [] [text "The app"],
|
||||||
|
div [] [text "The answer is \(num)"],
|
||||||
|
],
|
||||||
|
]
|
||||||
|
|
||||||
|
expect
|
||||||
|
Html.renderStatic (Html.translateStatic (render { answer: 42 }))
|
||||||
|
==
|
||||||
|
"<!DOCTYPE html><html><head></head><body><h1>The app</h1><div>The answer is 42</div></body></html>"
|
@ -1,35 +0,0 @@
|
|||||||
app "app-server"
|
|
||||||
packages { pf: "platform/server-side.roc" }
|
|
||||||
imports [
|
|
||||||
pf.Html.{ App, Html, html, head, body, div, text, h1 },
|
|
||||||
]
|
|
||||||
provides [app] to pf
|
|
||||||
|
|
||||||
State : {
|
|
||||||
answer : U32,
|
|
||||||
}
|
|
||||||
|
|
||||||
app : App State State
|
|
||||||
app = {
|
|
||||||
init: \state -> state,
|
|
||||||
render,
|
|
||||||
wasmUrl: "assets/app.wasm",
|
|
||||||
}
|
|
||||||
|
|
||||||
# This function must be identical in both server and client.
|
|
||||||
# Of course, it should be in a separate .roc file imported into both,
|
|
||||||
# but that has not been implemented yet. Currently apps are single-file
|
|
||||||
# and can only import from the platform!
|
|
||||||
render : State -> Html State
|
|
||||||
render = \state ->
|
|
||||||
num = Num.toStr state.answer
|
|
||||||
|
|
||||||
html [] [
|
|
||||||
head [] [],
|
|
||||||
body [] [
|
|
||||||
h1 [] [text "The app"],
|
|
||||||
div [] [text "The answer is \(num)"],
|
|
||||||
],
|
|
||||||
]
|
|
||||||
|
|
||||||
expect Html.renderStatic (Html.translateStatic (render { answer: 42 })) == ""
|
|
6
examples/virtual-dom-wip/example-client.roc
Normal file
6
examples/virtual-dom-wip/example-client.roc
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
app "example-client"
|
||||||
|
packages { pf: "platform/client-side.roc" }
|
||||||
|
imports [ExampleApp.{ exampleApp }]
|
||||||
|
provides [app] to pf
|
||||||
|
|
||||||
|
app = exampleApp
|
6
examples/virtual-dom-wip/example-server.roc
Normal file
6
examples/virtual-dom-wip/example-server.roc
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
app "example-server"
|
||||||
|
packages { pf: "platform/server-side.roc" }
|
||||||
|
imports [ExampleApp.{ exampleApp }]
|
||||||
|
provides [app] to pf
|
||||||
|
|
||||||
|
app = exampleApp
|
Loading…
Reference in New Issue
Block a user