Fix for #23: Adding extremely simple "hello world" MVP to demonstrate…

… svelte-retag in most basic form. Relocating Vercel site files to subdirectory under ./demo/vercel so this can live under ./demo/hello-world.
patricknelson · Nov 21, 2023 · 3b8f29a · 3b8f29a
1 parent 4ffe056
commit 3b8f29a
Show file tree

Hide file tree

Showing 44 changed files with 1,038 additions and 14 deletions.
diff --git a/README.md b/README.md
@@ -141,16 +141,17 @@ with [`svelte-tag@^1.0.0`](https://github.com/crisward/svelte-tag).
 
 ## Change Log
 
-- [x] Migrate to Vitest for unit testing (see https://github.com/crisward/svelte-tag/pull/14)
-- [x] Update logo
-- [x] Fix nested slot support (https://github.com/patricknelson/svelte-retag/pull/5)
-- [x] Better support for slots during early execution of IIFE compiled packages, i.e. use `MutationObserver` to watch
+- Migrate to Vitest for unit testing (see https://github.com/crisward/svelte-tag/pull/14)
+- Update logo
+- Fix nested slot support (https://github.com/patricknelson/svelte-retag/pull/5)
+- Better support for slots during early execution of IIFE compiled packages, i.e. use `MutationObserver` to watch
 	for light DOM slots during initial parsing (see https://github.com/patricknelson/svelte-retag/issues/7)
-- [x] Support Lit-style lowercase props (see https://github.com/patricknelson/svelte-retag/pull/9)
-- [x] Svelte 4 support (tested)
-- [x] Support context (see https://github.com/patricknelson/svelte-retag/issues/10, PR
+- Support Lit-style lowercase props (see https://github.com/patricknelson/svelte-retag/pull/9)
+- Svelte 4 support (tested)
+- Support context (see https://github.com/patricknelson/svelte-retag/issues/10, PR
 	at https://github.com/patricknelson/svelte-retag/pull/18)
-- [x] Add demos (see https://github.com/patricknelson/svelte-retag/issues/11)
+- Add demos to vercel site (see https://github.com/patricknelson/svelte-retag/issues/11)
+- Add step-by-step instructions and provided a simple MVP example (https://github.com/patricknelson/svelte-retag/pull/24)
 
 ### Milestones:
 

diff --git a/demo/.gitignore → demo/hello-world/.gitignore b/demo/.gitignore → demo/hello-world/.gitignore
diff --git a/demo/.vscode/extensions.json → demo/hello-world/.vscode/extensions.json b/demo/.vscode/extensions.json → demo/hello-world/.vscode/extensions.json
diff --git a/demo/hello-world/README.md b/demo/hello-world/README.md
@@ -0,0 +1,15 @@
+# svelte-retag: Hello World
+
+This is an **MVP** demo that shows `svelte-retag` in action in its simplest form in local development with a
+`HelloWorld.svelte` component implemented as a `<hello-world>` custom element.
+
+To try it out yourself, make sure you have [Git](https://git-scm.com/downloads) and [Node](https://nodejs.org/) installed and then run:
+
+```bash
+git clone https://github.com/patricknelson/svelte-retag.git
+cd svelte-retag/demo/hello-world
+npm install
+npm run dev
+```
+
+Then open your browser to [http://localhost:5173/](http://localhost:5173/) to view the demo.
diff --git a/demo/hello-world/index.html b/demo/hello-world/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/svelte-retag-favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>svelte-retag: Hello World</title>
+  </head>
+  <body>
+    <hello-world greetperson="👩‍🚀"></hello-world>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>
diff --git a/demo/jsconfig.json → demo/hello-world/jsconfig.json b/demo/jsconfig.json → demo/hello-world/jsconfig.json