Skip to main content
Version: v2

Templates & Examples

Get started building components for wasmCloud.

  • Templates are scaffolds for new applications. Use wash new to create a project from a template, then customize it for your use case.
  • Examples are complete applications demonstrating specific wasmCloud capabilities.
Compatibility

All templates and examples on this page target wasmCloud v2 and require wash 2.0.0+; a small number of entries require a newer wash version and call this out inline (for example, WebGPU TensorFlow requires 2.1.0+ because WebGPU in services landed in that release). Components target the WASI 0.2 component model. Interface versions shown reflect what is pinned in each template or example at time of writing; wash new always pulls current source from the repository.

Templates​

TemplateLanguageDescription
HTTP Hello WorldRustHTTP server using wstd
TCP ServiceRustHTTP API + TCP service workspace
HTTP Client (Rust)RustOutgoing HTTP proxy with wstd::http::Client
HTTP Handler (axum)RustFull REST API handler using axum via wstd-axum
HTTP Handler with Key-Value Storage (Rust)RustREST API + wasi:keyvalue
HTTP API with Distributed Workloads (Rust)RustTwo components coordinating via wasmcloud:messaging
HTTP Hello World (Hono)TypeScriptHTTP server using Hono
HTTP Hello World (Fetch API)TypeScriptHTTP server using the Fetch API
HTTP ClientTypeScriptOutgoing HTTP proxy
HTTP Handler (Hono)TypeScriptFull REST API handler
HTTP Handler with Blob Storage (Hono)TypeScriptREST API + wasi:blobstore
HTTP Handler with Filesystem (Hono)TypeScriptREST API + wasi:filesystem
HTTP Handler with Key-Value Storage (Hono)TypeScriptREST API + wasi:keyvalue
HTTP Handler with Logging (Hono)TypeScriptREST API + structured logging via wasi:logging
HTTP API with Distributed WorkloadsTypeScriptTwo components coordinating via wasmcloud:messaging
TCP Echo ServiceTypeScriptHTTP component + TCP service workload

Rust​

Requires the Rust toolchain with the wasm32-wasip2 target. After scaffolding with wash new, run wash dev from the project directory to start the development loop. See Quickstart prerequisites for setup instructions.

HTTP Hello World​

A minimal HTTP server component built with the wstd async runtime for Wasm components.

Create from template:

shell
wash new https://github.com/wasmCloud/wasmCloud.git --name my-project --subfolder templates/http-hello-world

TCP Service​

A two-component Rust workspace. http-api is an HTTP server that accepts text input via a web UI and forwards it to service-leet, a TCP server that transforms text to "leet speak" (e.g., hello world → h3110 w0r1d). Together they demonstrate a multi-component service pattern with TCP transport.

Create from template:

shell
wash new https://github.com/wasmCloud/wasmCloud.git --name my-service --subfolder templates/service-tcp

HTTP Client (Rust)​

An HTTP proxy component that makes outgoing HTTP requests using wstd::http::Client. Uses the wstd #[http_server] proc macro to handle the incoming request and proxies the call upstream.

Create from template:

shell
wash new https://github.com/wasmCloud/wasmCloud.git --name my-project --subfolder templates/http-client

HTTP Handler (axum)​

A full-featured HTTP handler component using axum for routing, wired to wasi:http/incoming-handler via wstd-axum. The template demonstrates routing, query parameters, and JSON request and response bodies, with axum's default features (which depend on tokio and hyper) disabled in favor of the Wasm-compatible feature set.

Create from template:

shell
wash new https://github.com/wasmCloud/wasmCloud.git --name my-project --subfolder templates/http-handler

HTTP Handler with Key-Value Storage (Rust)​

An HTTP handler component that stores and retrieves key-value pairs over HTTP, backed by wasi:keyvalue/store. The component speaks only the WASI interface; the host runtime selects the underlying storage backend (in-memory, filesystem, NATS, Redis, and others) based on .wash/config.yaml, so the same component code runs against any supported backend without modification.

Create from template:

shell
wash new https://github.com/wasmCloud/wasmCloud.git --name my-project --subfolder templates/http-kv-handler

HTTP API with Distributed Workloads (Rust)​

A two-component Rust workspace demonstrating distributed workloads over messaging. An http-api component receives POST /task requests and dispatches work via wasmcloud:messaging/consumer; a task-leet component exports wasmcloud:messaging/handler and transforms the payload (e.g., text → "leet speak"). During wash dev, the runtime routes calls between components in-process — no NATS server required.

Create from template:

shell
wash new https://github.com/wasmCloud/wasmCloud.git --name my-project --subfolder templates/http-api-with-distributed-workloads

TypeScript​

Requires npm v14.17+ and TypeScript v5.6+. After scaffolding with wash new, run npm run dev from the project directory to start the development loop. See Quickstart prerequisites for setup instructions.

TypeScript templates use the @bytecodealliance/jco-std adapter for WASI compatibility and are available in the templates/ directory of wasmCloud/typescript.

HTTP Hello World (Hono)​

A minimal HTTP server component using the Hono web framework.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-hello-world-hono

HTTP Hello World (Fetch API)​

A minimal HTTP server component using the Service Worker Fetch API pattern.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-hello-world-fetch

HTTP Client​

An HTTP proxy component that makes outgoing HTTP requests. Supports GET, POST, PUT, DELETE, and PATCH with custom header forwarding, request body handling, JSON parsing, and response header extraction.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-client

HTTP Handler (Hono)​

A full-featured HTTP handler component using Hono, demonstrating middleware patterns including CORS, request logging, response timing, and request ID tracking, with RESTful CRUD endpoints and error handling.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-handler-hono

HTTP Handler with Blob Storage (Hono)​

An HTTP handler component using Hono, backed by wasi:blobstore for persistent file storage. Provides a complete REST API for blob CRUD operations.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-blobstore-handler-hono

HTTP Handler with Filesystem (Hono)​

An HTTP handler component using Hono that serves files from a mounted directory via wasi:filesystem. Demonstrates reading from a preopened host directory inside a Wasm component.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-filesystem-handler-hono

HTTP Handler with Key-Value Storage (Hono)​

An HTTP handler component using Hono, backed by wasi:keyvalue for persistent key-value storage. Demonstrates CRUD operations, atomic incrementation, and Hono middleware patterns. When run with npm run dev, a NATS-KV key-value provider is automatically configured.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-kv-handler-hono

HTTP Handler with Logging (Hono)​

An HTTP handler component using Hono that emits structured logs via wasi:logging. Every request and response is logged at the appropriate level (trace, debug, info, warn, error, critical) so you can see how WASI logging integrates with the wasmCloud host's structured log output.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-logging-handler-hono

HTTP API with Distributed Workloads​

A two-component TypeScript project demonstrating component-to-component coordination over wasmcloud:messaging. An http-api component accepts POST /task requests and dispatches work via wasmcloud:messaging/consumer; a task-worker component exports wasmcloud:messaging/handler, processes the payload, and returns a reply. During wash dev, the runtime routes calls between components in-process — no NATS server required.

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/http-api-with-distributed-workloads

TCP Echo Service​

A two-workload TypeScript project demonstrating the wasmCloud service model. A TCP service workload accepts connections on 127.0.0.1:7878, reads lines, and replies with the word count. A component workload exposes POST /count, forwards text to the TCP service over the in-process loopback network, and returns a JSON response.

  • Source: wasmCloud/typescript — templates/service-tcp-echo
  • service interfaces: Imports wasi:sockets/tcp@0.2.3 (and related socket interfaces); exports wasi:cli/run@0.2.0
  • component interfaces: Imports wasi:sockets/tcp@0.2.3 (and related socket interfaces); exports wasi:http/incoming-handler@0.2.6

Create from template:

shell
wash new https://github.com/wasmCloud/typescript.git --name my-project --subfolder templates/service-tcp-echo

Examples​

Complete example applications are available in the examples/ directory of wasmCloud/wasmCloud (Rust) and the examples/components/ directory of wasmCloud/typescript (TypeScript). Run wash dev from any example directory to build and start a local development environment.

ExampleLanguageOCI Artifact
BlobbyRustghcr.io/wasmcloud/components/blobby
gRPC Hello WorldRustcomponents/grpc-hello-world-client, components/grpc-hello-world-server
OpenTelemetry HTTP CounterRustghcr.io/wasmcloud/components/otel-http
QR Code GeneratorRustghcr.io/wasmcloud/components/qrcode
HTTP AxiosTypeScript—
HTTP Password CheckerTypeScript—
HTTP Server with HonoTypeScript—
HTTP stdioTypeScript—
HTTP StreamingTypeScript—
WebGPU TensorFlowTypeScript—
WASI Config from Kubernetes EnvTypeScript—

Rust​

Blobby​

A file server component ("Little Blobby Tables") demonstrating CRUD operations on blob storage, served through a web UI. Built with the wstd async runtime.

  • Source: wasmCloud/wasmCloud — examples/blobby
  • OCI artifact: ghcr.io/wasmcloud/components/blobby
  • Interfaces: Imports wasi:blobstore/blobstore@0.2.0-draft; exports wasi:http/incoming-handler (via the wstd #[http_server] proc macro)

gRPC Hello World​

Two components demonstrating how to make and serve gRPC calls from a wasmCloud component. component-client calls an external gRPC server; component-server serves gRPC traffic to an external client. Built with tonic and prost over HTTP/2.

  • Source: wasmCloud/wasmCloud — examples/grpc-hello-world
  • OCI artifacts: ghcr.io/wasmcloud/components/grpc-hello-world-client, ghcr.io/wasmcloud/components/grpc-hello-world-server
  • component-client interfaces: Imports wasi:http/outgoing-handler; exports wasi:http/incoming-handler (via wstd)
  • component-server interfaces: Exports wasi:http/incoming-handler (via wstd)

OpenTelemetry HTTP Counter​

An HTTP counter service instrumented with OpenTelemetry through the wasi:otel interfaces. Each request creates a parent server span, emits child spans for downstream HTTP / blobstore / keyvalue operations, records structured log entries correlated with the active trace, and exports request-count and response-size metrics.

  • Source: wasmCloud/wasmCloud — examples/otel-http
  • OCI artifact: ghcr.io/wasmcloud/components/otel-http
  • Interfaces: Imports wasi:otel/{tracing,logs,metrics,types}@0.2.0-rc.1, wasi:http/outgoing-handler@0.2.2, wasi:blobstore/{blobstore,container}@0.2.0-draft, wasi:keyvalue/{store,atomics}@0.2.0-draft, wasi:config/store@0.2.0-rc.1, wasi:clocks/wall-clock@0.2.0, wasi:logging/logging@0.1.0-draft; exports wasi:http/incoming-handler@0.2.2

QR Code Generator​

A QR code generator that accepts text input via HTTP and returns a PNG-encoded QR code, with a web UI.

TypeScript​

HTTP Axios​

A CLI-style component that uses axios to perform an outbound HTTP request and returns the result through a custom WIT interface. The same component can be invoked via wash call, wasmtime run, or jco run through its wasi:cli/run entrypoint. Demonstrates pulling in a widely-used npm package and using it inside a component.

HTTP Password Checker​

A wasi:http-compliant HTTP handler that provides an API for checking password strength. Uses only standard WASI interfaces (no wasmCloud-specific dependencies) and demonstrates pulling in JS ecosystem packages inside a component — notably valibot for schema validation and check-password-strength for the strength heuristic.

HTTP Server with Hono​

An HTTP server component built on Hono via a custom adapter that bridges Hono onto the wasi:http/incoming-handler interface. Includes example routes (/api/data, /api/config) and demonstrates a minimal Hono + wasi:http setup.

HTTP stdio​

A small HTTP handler that demonstrates writing to stdout and stderr from inside a component via the wasi:cli stream interfaces. Responds to GET /?name=<name> while logging the request to the host's stdout/stderr.

HTTP Streaming​

An HTTP component that performs a streaming response using wasi:http and wasi:io primitives, streaming 1 MiB of random bytes on every request. Demonstrates how to stream a response body from a TypeScript component without buffering.

WebGPU TensorFlow​

A two-workload TypeScript example demonstrating GPU-accelerated machine learning inside a wasmCloud workload, running TensorFlow.js with the WebGPU backend on top of wasi:webgpu. A service workload loads a style-transfer model into GPU memory at startup and serves a binary protocol on loopback TCP 127.0.0.1:7878; a component workload serves the browser UI and forwards POST /stylize requests to the service, returning the stylized JPEG.

  • Source: wasmCloud/typescript — examples/components/webgpu-tensorflow
  • service interfaces: Imports wasi:webgpu/webgpu@0.0.1, wasi:graphics-context/graphics-context@0.0.1, wasi:sockets/tcp@0.2.3 (and related socket interfaces); exports wasi:cli/run@0.2.3
  • component interfaces: Imports wasi:sockets/tcp@0.2.3 (and related socket interfaces); exports wasi:http/incoming-handler@0.2.3
  • Requirements: wash ≥ 2.1.0 (WebGPU in services landed in 2.1.0) and a GPU on the host machine running wash dev

WASI Config from Kubernetes Env​

An HTTP component that reads runtime configuration via the wasi:config/store interface, demonstrating how wasmCloud sources config from Kubernetes ConfigMaps and Secrets at runtime. Exposes GET /config (all values as JSON) and GET /config/:key (a single value). The component contains no Kubernetes-specific code — values are injected by the wasmCloud config provider, which can be backed by a ConfigMap or Secret in a Kubernetes deployment.