diff --git a/packages/web/Cargo.toml b/packages/web/Cargo.toml
index 72171a09a..7d0d5f32c 100644
--- a/packages/web/Cargo.toml
+++ b/packages/web/Cargo.toml
@@ -8,10 +8,10 @@ license = "MIT/Apache-2.0"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-dioxus-core = { path="../core", version="0.1.2" }
-dioxus-html = { path="../html" }
+dioxus-core = { path = "../core", version = "0.1.2" }
+dioxus-html = { path = "../html" }
 js-sys = "0.3"
-wasm-bindgen = { version="0.2.71", features=["enable-interning"] }
+wasm-bindgen = { version = "0.2.71", features = ["enable-interning"] }
 lazy_static = "1.4.0"
 wasm-bindgen-futures = "0.4.20"
 wasm-logger = "0.2.0"
@@ -22,7 +22,7 @@ console_error_panic_hook = "0.1.6"
 generational-arena = "0.2.8"
 wasm-bindgen-test = "0.3.21"
 once_cell = "1.7.2"
-atoms = { path="../atoms" }
+atoms = { path = "../atoms" }
 async-channel = "1.6.1"
 anyhow = "1.0.41"
 slotmap = "1.0.3"
@@ -75,7 +75,11 @@ crate-type = ["cdylib", "rlib"]
 im-rc = "15.0.0"
 # rand = { version="0.8.4", features=["small_rng"] }
 separator = "0.4.1"
-uuid = { version="0.8.2", features=["v4", "wasm-bindgen"] }
-dioxus-hooks = { path="../hooks" }
-gloo-timers = { version="0.2.1", features=["futures"] }
+uuid = { version = "0.8.2", features = ["v4", "wasm-bindgen"] }
+dioxus-hooks = { path = "../hooks" }
+gloo-timers = { version = "0.2.1", features = ["futures"] }
+serde = { version = "1.0.126", features = ["derive"] }
+surf = { version = "2.2.0", default-features = false, features = [
+    "wasm-client",
+] }
 # wasm-timer = "0.2.5"
diff --git a/packages/web/examples/async_web.rs b/packages/web/examples/async_web.rs
index 0d4035350..3228af704 100644
--- a/packages/web/examples/async_web.rs
+++ b/packages/web/examples/async_web.rs
@@ -17,13 +17,20 @@ use dioxus_web::*;
 
 fn main() {
     // Setup logging
-    wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
+    // wasm_logger::init(wasm_logger::Config::new(log::Level::Debug));
     console_error_panic_hook::set_once();
 
     // Run the app
     wasm_bindgen_futures::spawn_local(WebsysRenderer::start(App));
 }
 
+#[derive(serde::Deserialize)]
+struct DogApi {
+    message: String,
+}
+
+const ENDPOINT: &str = "https://dog.ceo/api/breeds/image/random/";
+
 static App: FC<()> = |cx| {
     // let mut count = use_state(cx, || 0);
     let state = use_state(cx, || 0);
@@ -32,19 +39,24 @@ static App: FC<()> = |cx| {
     let g = cx.use_task(|| async move {
         let mut tick: i32 = 0;
         log::debug!("yeet!");
-        loop {
-            gloo_timers::future::TimeoutFuture::new(250).await;
-            log::debug!("ticking forward... {}", tick);
-            tick += 1;
-            if tick > 10 {
-                break;
-            }
-        }
+        // loop {
+        //     gloo_timers::future::TimeoutFuture::new(250).await;
+        //     log::debug!("ticking forward... {}", tick);
+        //     tick += 1;
+        //     if tick > 10 {
+        //         break;
+        //     }
+        // }
+
         set_val(10);
-        String::from("Huzza!")
+        surf::get(ENDPOINT).recv_json::<DogApi>().await
+        // String::from("Huzza!")
     });
 
-    log::debug!("Value from component was {:#?}", g);
+    let dog_node = match g.as_ref().and_then(|f| f.as_ref().ok()) {
+        Some(res) => rsx!(in cx, img { src: "{res.message}" }),
+        None => rsx!(in cx, div { "No doggos for you :(" }),
+    };
 
     cx.render(rsx! {
         div {
@@ -65,6 +77,10 @@ static App: FC<()> = |cx| {
                             "decr"
                         }
                     }
+                    div {
+                        h1{"doggo!"}
+                        {dog_node}
+                    }
                 }
             }
         }