Add WebAssembly Studio links to examples/README

Should hopefully make it much easier to get off the ground running and
exploring!
This commit is contained in:
Alex Crichton 2018-04-17 13:51:01 -07:00
parent c74230b4a9
commit 158b95c29b
9 changed files with 32 additions and 9 deletions

View File

@ -37,6 +37,8 @@ what this crate can do, check out the [design doc].
[perf-ex]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/performance [perf-ex]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/performance
[smorg-ex]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/smorgasboard [smorg-ex]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/smorgasboard
[hello-online]: https://webassembly.studio/?f=gzubao6tg3
## Basic usage ## Basic usage
Let's implement the equivalent of "Hello, world!" for this crate. Let's implement the equivalent of "Hello, world!" for this crate.
@ -46,7 +48,9 @@ Let's implement the equivalent of "Hello, world!" for this crate.
[rustup]: https://rustup.rs [rustup]: https://rustup.rs
First up, let's install the tools we need If you'd like you dive [straight into an online example][hello-online], but
if you'd prefer to follow along in your own console let's install the tools we
need:
``` ```
$ rustup target add wasm32-unknown-unknown $ rustup target add wasm32-unknown-unknown
@ -208,9 +212,10 @@ If you open https://localhost:8080 in a browser you should see a `Hello, world!`
dialog pop up! This works in Firefox out of the box but not in Chrome due to a dialog pop up! This works in Firefox out of the box but not in Chrome due to a
webpack issue. See [the hello_world README][hello-readme] for a workaround. webpack issue. See [the hello_world README][hello-readme] for a workaround.
If that was all a bit much, no worries! You can [follow along If that was all a bit much, no worries! You can [execute this code
online][hello-tree] to see all the files necessary as well as a script to set it online][hello-online] thanks to [WebAssembly Studio](https://webassembly.studio)
all up. or you can [follow along on GitHUb][hello-tree] to see all the files necessary
as well as a script to set it all up.
[hello-tree]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/hello_world [hello-tree]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/hello_world
[hello-readme]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/hello_world/README.md [hello-readme]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/hello_world/README.md
@ -251,7 +256,8 @@ classes/functions within.
## What else can we do? ## What else can we do?
Much more! Here's a taste of various features you can use in this project: Much more! Here's a taste of various features you can use in this project. You
can also [explore this code online](https://webassembly.studio/?f=t61j18noqz):
```rust ```rust
// src/lib.rs // src/lib.rs

View File

@ -1,9 +1,12 @@
# Examples # Examples
This directory contains a number of examples of the `#[wasm_bindgen]` macro and This directory contains a number of examples of the `#[wasm_bindgen]` macro and
how to display them in the browser. Each directory should contain a `build.sh` how to display them in the browser. Each directory contains a README with a link
which assembles all the relevant files, and then if you open up `index.html` in to https://webassembly.studio so you can also explore the example online
a web browser you should be able to see everything in action! (apologies if they're out of sync!), and each directory also contains a
`build.sh` which assembles all the relevant files locally. If you open up
`index.html` in a web browser you should be able to see everything in action
when using `build.sh`!
The examples here are: The examples here are:

View File

@ -1,5 +1,7 @@
# Closure examples # Closure examples
[View this example online](https://webassembly.studio/?f=g3hc1qs6tka)
This directory is an example of using the `#[wasm_bindgen]` macro with closures This directory is an example of using the `#[wasm_bindgen]` macro with closures
to interact with the DOM. to interact with the DOM.

View File

@ -1,5 +1,7 @@
# `console.log` # `console.log`
[View this example online](https://webassembly.studio/?f=ppd7u8k9i9)
This directory is an example of using the `#[wasm_bindgen]` macro to import the This directory is an example of using the `#[wasm_bindgen]` macro to import the
`console.log` function and call it `console.log` function and call it

View File

@ -1,5 +1,7 @@
# DOM access # DOM access
[View this example online](https://webassembly.studio/?f=54xnz04tcke)
This directory is an example of using the `#[wasm_bindgen]` macro to interact This directory is an example of using the `#[wasm_bindgen]` macro to interact
with the DOM, specifically the `document` object. You'll see here a few examples with the DOM, specifically the `document` object. You'll see here a few examples
of defining access to the global `document` variable as well as appending a new of defining access to the global `document` variable as well as appending a new

View File

@ -1,9 +1,11 @@
# Hello, World! # Hello, World!
[View this example online](https://webassembly.studio/?f=gzubao6tg3)
This directory is an example of using the `#[wasm_bindgen]` macro to create an This directory is an example of using the `#[wasm_bindgen]` macro to create an
entry point that's called from the browser and then displays a dialog. entry point that's called from the browser and then displays a dialog.
You can build the example with: You can build the example locally with:
``` ```
$ ./build.sh $ ./build.sh

View File

@ -1,5 +1,7 @@
# `Math` # `Math`
[View this example online](https://webassembly.studio/?f=ffnm4kpzmib)
This directory is an example of using the `#[wasm_bindgen]` macro to import the This directory is an example of using the `#[wasm_bindgen]` macro to import the
`Math` object and invoke various functions on it. `Math` object and invoke various functions on it.

View File

@ -1,5 +1,7 @@
# `performance` # `performance`
[View this example online](https://webassembly.studio/?f=6gxcp4f4953)
This directory is an example of using the `#[wasm_bindgen]` macro to interact This directory is an example of using the `#[wasm_bindgen]` macro to interact
with global APIs like `performance.now()` to learn about the current time in with global APIs like `performance.now()` to learn about the current time in
Rust. Rust.

View File

@ -1,5 +1,7 @@
# Smorgasboard of examples # Smorgasboard of examples
[View this example online](https://webassembly.studio/?f=t61j18noqz)
This directory is an smattering of examples using the `#[wasm_bindgen]` macro. This directory is an smattering of examples using the `#[wasm_bindgen]` macro.
Here we see passing strings back and for, exporting classes from Rust to JS, Here we see passing strings back and for, exporting classes from Rust to JS,
importing classes from JS to Rust, etc. importing classes from JS to Rust, etc.