chore: update getting started doc

omarluq · Jul 5, 2024 · 0f6f55c · 0f6f55c
1 parent 050d0a2
commit 0f6f55c
Showing 1 changed file with 40 additions and 1 deletion.
diff --git a/docs/getting_started.md b/docs/getting_started.md
@@ -15,4 +15,43 @@ yarn add stimulus-store
 ```
 
 ### UMD
-Coming 🔜
+
+If you prefer not to use a build system, you can load `stimulus-store` in a `<script>` tag and it will be globally available through the `window.StimulusStore` object.
+
+```html
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <script src="https://unpkg.com/stimulus/dist/stimulus.umd.js"></script>
+    <script src="https://unpkg.com/stimulus-store/dist/bundle.umd.js"></script>
+    <script>
+      (() => {
+        const application = Stimulus.Application.start();
+
+        const helloStore = StimulusStore.createStore({
+          name: "myStore",
+          type: String,
+          initialValue: "Hello World!",
+        });
+
+        application.register(
+          "hello",
+          class extends Stimulus.Controller {
+            static stores = [helloStore];
+
+            connect() {
+              StimulusStore.useStore(this);
+              this.element.innerHtml = `<p>${this.helloStoreValue}</p>`;
+            }
+          }
+        );
+      })();
+    </script>
+  </head>
+  <body>
+    <div data-controller="hello">…</div>
+  </body>
+</html>
+```
+