Working web examples are here!

vuelto-org · Jan 5, 2025 · 2e41806 · 2e41806
1 parent a06b46c
commit 2e41806
Show file tree

Hide file tree

Showing 9 changed files with 625 additions and 0 deletions.
diff --git a/mkdocs.yml b/mkdocs.yml
@@ -37,6 +37,12 @@ nav:
       - 🌱 Beginner:
           - 🚀 Getting Started: "tutorials/beginner/new-project.md"
           - 🎨 Rendering: "tutorials/beginner/rendering.md"
+  - Examples:
+      - 🏠 Home: "examples/index.md"
+      - 📚 Shapes: "examples/1/index.html"
+      - 📚 Images: "examples/2/index.html"
+      - 📚 Combined: "examples/3/index.html"
+
   - Roadmap:
       - 📅 Upcoming: "roadmap/index.md"
       - 🛣️ V1: "roadmap/v1.md"

diff --git a/website/examples/1/index.html b/website/examples/1/index.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Go WASM App</title>
+    <script src="../wasm_exec.js"></script>
+  </head>
+  <body>
+    <script>
+      const go = new Go();
+      WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
+        go.run(result.instance);
+      });
+    </script>
+  </body>
+</html>
diff --git a/website/examples/1/main.wasm b/website/examples/1/main.wasm
diff --git a/website/examples/2/index.html b/website/examples/2/index.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Go WASM App</title>
+    <script src="../wasm_exec.js"></script>
+  </head>
+  <body>
+    <script>
+      const go = new Go();
+      WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
+        go.run(result.instance);
+      });
+    </script>
+  </body>
+</html>
diff --git a/website/examples/2/main.wasm b/website/examples/2/main.wasm
diff --git a/website/examples/3/index.html b/website/examples/3/index.html
@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Go WASM App</title>
+    <script src="../wasm_exec.js"></script>
+  </head>
+  <body>
+    <script>
+      const go = new Go();
+      WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
+        go.run(result.instance);
+      });
+    </script>
+  </body>
+</html>
diff --git a/website/examples/3/main.wasm b/website/examples/3/main.wasm
diff --git a/website/examples/index.md b/website/examples/index.md
@@ -0,0 +1,7 @@
+# 🔍 Examples
+Hey and welcome to the examples section! Here you can find a list of examples that demonstrate how to use Vuelto in different scenarios. All of these work in the web!
+
+## 🧩 All examples
+- [Shapes example](1/index.html)
+- [Images example](2/index.html)
+- [Combined example](3/index.html)