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
[smorg-ex]: https://github.com/rustwasm/wasm-bindgen/tree/master/examples/smorgasboard
[hello-online]: https://webassembly.studio/?f=gzubao6tg3
## Basic usage
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
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
@ -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
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
online][hello-tree] to see all the files necessary as well as a script to set it
all up.
If that was all a bit much, no worries! You can [execute this code
online][hello-online] thanks to [WebAssembly Studio](https://webassembly.studio)
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-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?
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
// src/lib.rs

View File

@ -1,9 +1,12 @@
# Examples
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`
which assembles all the relevant files, and then if you open up `index.html` in
a web browser you should be able to see everything in action!
how to display them in the browser. Each directory contains a README with a link
to https://webassembly.studio so you can also explore the example online
(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:

View File

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

View File

@ -1,5 +1,7 @@
# `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
`console.log` function and call it

View File

@ -1,5 +1,7 @@
# DOM access
[View this example online](https://webassembly.studio/?f=54xnz04tcke)
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
of defining access to the global `document` variable as well as appending a new

View File

@ -1,9 +1,11 @@
# 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
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

View File

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

View File

@ -1,5 +1,7 @@
# `performance`
[View this example online](https://webassembly.studio/?f=6gxcp4f4953)
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
Rust.

View File

@ -1,5 +1,7 @@
# Smorgasboard of examples
[View this example online](https://webassembly.studio/?f=t61j18noqz)
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,
importing classes from JS to Rust, etc.