All the examples are hosted under examples.sycamore.dev/<example_name> with
<example_name> being the name of the example you want to view. For instance, the todomvc example
is hosted on
examples.sycamore.dev/todomvc.
All the examples can also be built locally using Trunk. For instance, the
following command builds and serves the todomvc example:
cd examples/todomvc
trunk serveNow open up localhost:8080 in your browser to see "Hello World!".
| Example | Description |
|---|---|
| attributes-passthrough | Passing through dynamic attributes to an inner element |
| components | UI abstraction using components |
| context | Demonstration for the Context API |
| counter | A simple counter which can be incremented and decremented |
| hello-builder | Hello World! With the builder API! |
| hello-world | Hello World! |
| higher-order-components | Higher-order-components (functions that create components) |
| http-request | Suspense + async components for sending HTTP requests |
| http-request-builder | Suspense + async components for sending HTTP requests using the builder API! |
| hydrate | Making existing HTML reactive |
| iteration | Demonstration of how to iterate over data in UI |
| js-framework-benchmark | Implementation of js-framework-benchmark |
| js-snippets | Demonstration of importing a function from JS |
| motion | Demonstration for using animation frames and tweened signals |
| number-binding | Demonstration of binding the value of a range or number input |
| router | Demonstration of sycamore-router |
| ssr | Demonstration of server-side-rendering |
| ssr-suspense | Demonstration of server-side rendering with suspense support |
| ssr-streaming | Demonstration of server-side-rendering with streaming |
| svg | Creating SVGs with the view! macro |
| timer | Demonstration of using futures to auto-increment a counter |
| todomvc | Fully compliant implementation of TodoMVC spec |
| transitions | Suspense + async transitions |