chore(examples): migrate to Spin manifest v2 + README/misc updates

Signed-off-by: Vaughn Dice <vaughn.dice@fermyon.com>

Author: vdice

examples/javascript/hello_world/README.md

@@ -5,13 +5,14 @@ This is the simplest example of using the Javascript SDK.
 ### Building the example
 
 ```console
+npm install
 spin build
 ```
 
 ### Running the example
 
 ```console
-spin up --follow-all
+spin up
 ```
 
 Use e.g. `curl -v http://127.0.0.1:3000/hello` to test the endpoint.

examples/javascript/hello_world/spin.toml

@@ -1,13 +1,15 @@
-spin_manifest_version = "1"
+spin_manifest_version = 2
+
+[application]
 authors = ["Fermyon Engineering <engineering@fermyon.com>"]
 name = "spin-http-js"
-trigger = { type = "http", base = "/" }
 version = "1.0.0"
 
-[[component]]
-id = "hello"
-source = "target/spin-http-js.wasm"
-[component.trigger]
+[[trigger.http]]
 route = "/hello"
-[component.build]
+component = "hello"
+
+[component.hello]
+source = "target/spin-http-js.wasm"
+[component.hello.build]
 command = "npm install && npm run build"

examples/javascript/http-router/README.md

@@ -12,4 +12,6 @@ The app exposes the following endpoints:
 
 ## Build and run the app locally
 
+First, install npm dependencies with `npm install`.
+
 To build and run the app locally, you can either use `spin build` and `spin up` or combine both commands and simply run `spin build --up`.

examples/javascript/http-router/spin.toml

@@ -1,15 +1,17 @@
-spin_manifest_version = "1"
+spin_manifest_version = 2
+
+[application]
 authors = ["Thorsten Hans <thorsten.hans@gmail.com>"]
 description = "Sample to demonstrate the usage of the HTTP router"
 name = "http-router"
-trigger = { type = "http", base = "/" }
 version = "0.1.0"
 
-[[component]]
-id = "http-router"
+[[trigger.http]]
+route = "/..."
+component = "http-router"
+
+[component.http-router]
 source = "target/http-router.wasm"
 exclude_files = ["**/node_modules"]
-[component.trigger]
-route = "/..."
-[component.build]
+[component.http-router.build]
 command = "npm run build"

examples/javascript/kv/README.md

@@ -15,4 +15,6 @@ The app leverages the `default` key-value store as specified in `spin.toml`.
 
 ## Build and run the app locally
 
+First, install npm dependencies with `npm install`.
+
 To build and run the app locally, you can either use `spin build` and `spin up` or combine both commands and simply run `spin build --up`.

examples/javascript/kv/spin.toml

@@ -1,16 +1,18 @@
-spin_manifest_version = "1"
+spin_manifest_version = 2
+
+[application]
 authors = ["Thorsten Hans <thorsten.hans@gmail.com>"]
 description = "Demonstrates how to use key-value store APIs in JS"
 name = "kv"
-trigger = { type = "http", base = "/" }
 version = "0.1.0"
 
-[[component]]
-id = "kv"
+[[trigger.http]]
+route = "/..."
+component = "kv"
+
+[component.kv]
 source = "target/kv.wasm"
 key_value_stores = ["default"]
 exclude_files = ["**/node_modules"]
-[component.trigger]
-route = "/..."
-[component.build]
+[component.kv.build]
 command = "npm run build"

examples/javascript/outbound-http/README.md

@@ -5,12 +5,14 @@ This example showcases utilizing fetch to request data from an API and use it in
 ### Building the example
 
 ```
-npm run build
+npm install
+spin build
 ```
+
 ### Running the example
 
 ```
-spin up --follow-all
+spin up
 ```
 
 Use e.g. `curl -v http://127.0.0.1:3000/hello` to test the endpoint.

examples/javascript/outbound-http/package.json

@@ -4,7 +4,7 @@
  "description": "",
  "main": "index.js",
  "scripts": {
- "build": "npx webpack --mode=production && mkdir -p target && spin js2wasm -o target/spin-http-js.wasm dist/spin.js",
+ "build": "npx webpack --mode=production && mkdir -p target && spin js2wasm -o target/spin-outbound-http.wasm dist/spin.js",
  "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],

examples/javascript/outbound-http/spin.toml

@@ -1,15 +1,17 @@
-spin_manifest_version = "1"
+spin_manifest_version = 2
+
+[application]
 authors = ["Fermyon Engineering <engineering@fermyon.com>"]
-name = "spin-http-js"
-trigger = { type = "http", base = "/" }
+name = "spin-outbound-http"
 version = "1.0.0"
 
-[[component]]
-id = "hello"
-source = "target/spin-http-js.wasm"
-allowed_http_hosts = ["https://some-random-api.ml"]
-files = ["src/index.html"]
-[component.trigger]
+[[trigger.http]]
 route = "/hello"
-[component.build]
+component = "hello"
+
+[component.hello]
+source = "target/spin-outbound-http.wasm"
+allowed_http_hosts = ["random-data-api.fermyon.app"]
+files = ["src/index.js"]
+[component.hello.build]
 command = "npm run build"

examples/javascript/outbound-http/src/index.js

@@ -2,13 +2,13 @@ const encoder = new TextEncoder("utf-8")
 const decoder = new TextDecoder("utf-8")
 
 export async function handleRequest(request) {
- const dogFact = await fetch("https://some-random-api.ml/facts/dog")
+ const physicsFact = await fetch("https://random-data-api.fermyon.app/physics/json")
 
- const dogFactBody = decoder.decode(await dogFact.arrayBuffer() || new Uint8Array())
+ const physicsFactBody = decoder.decode(await physicsFact.arrayBuffer() || new Uint8Array())
 
  const env = JSON.stringify(process.env)
 
- const body = `Here's a dog fact: ${dogFactBody}\n`
+ const body = `Here's a physics fact: ${physicsFactBody}\n`
 
  return {
  status: 200,