diff --git a/frontend/Cargo.toml b/frontend/Cargo.toml
index 413beef..0ab2f80 100644
--- a/frontend/Cargo.toml
+++ b/frontend/Cargo.toml
@@ -4,3 +4,10 @@ version = "0.1.0"
edition = "2021"
[dependencies]
+console_error_panic_hook = "0.1.7"
+gloo-net = "0.6.0"
+log = "0.4.22"
+wasm-bindgen-futures = "0.4.42"
+wasm-logger = "0.2.0"
+yew = { version = "0.21.0", features = ["csr"] }
+yew-router = "0.18.0"
diff --git a/frontend/Trunk.toml b/frontend/Trunk.toml
new file mode 100644
index 0000000..925d336
--- /dev/null
+++ b/frontend/Trunk.toml
@@ -0,0 +1,3 @@
+[build]
+target = "index.html"
+dist = "../dist"
diff --git a/frontend/index.html b/frontend/index.html
new file mode 100644
index 0000000..4c32f2c
--- /dev/null
+++ b/frontend/index.html
@@ -0,0 +1,9 @@
+
+
+
+
+
+ Yew App
+
+ loading...
+
diff --git a/frontend/src/main.rs b/frontend/src/main.rs
index e7a11a9..09dd9ef 100644
--- a/frontend/src/main.rs
+++ b/frontend/src/main.rs
@@ -1,3 +1,86 @@
-fn main() {
- println!("Hello, world!");
+use gloo_net::http::Request;
+use wasm_bindgen_futures::spawn_local;
+use yew::prelude::*;
+use yew_router::prelude::*;
+
+#[derive(Clone, Routable, PartialEq)]
+enum Route {
+ #[at("/")]
+ Home,
+ #[at("/hello-server")]
+ HelloServer,
}
+
+fn switch(routes: Route) -> Html {
+ match routes {
+ Route::Home => html! { { "Hello Frontend" }
},
+ Route::HelloServer => html! { },
+ }
+}
+
+#[function_component(App)]
+fn app() -> Html {
+ html! {
+
+ render={switch} />
+
+ }
+}
+
+#[function_component(HelloServer)]
+fn hello_server() -> Html {
+ let data = use_state(|| None);
+
+ // Request `/api/hello` once
+ {
+ let data = data.clone();
+ use_effect(move || {
+ if data.is_none() {
+ spawn_local(make_request(data));
+ }
+
+ || {}
+ });
+ }
+
+ match data.as_ref() {
+ None => {
+ html! {
+ {"No server response"}
+ }
+ }
+ Some(Ok(data)) => {
+ html! {
+ {"Got server response: "}{data}
+ }
+ }
+ Some(Err(err)) => {
+ html! {
+ {"Error requesting data from server: "}{err}
+ }
+ }
+ }
+}
+
+async fn make_request(data: UseStateHandle