Minor fixup of tutorial files (#2131)

* Make the talk titles consistent

* Add replacing the hardcoded list of talks with the one generated from data

* Update website/docs/tutorial.md

Co-authored-by: Simon <simon@siku2.io>

* Update website/docs/tutorial.md

Co-authored-by: Simon <simon@siku2.io>

Co-authored-by: Simon <simon@siku2.io>
This commit is contained in:
Jonathan Birk 2021-11-05 17:49:57 +01:00 committed by GitHub
parent 8fd6100874
commit 3ebd866d13
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 7 deletions

View File

@ -213,19 +213,19 @@ let videos = vec![
}, },
Video { Video {
id: 2, id: 2,
title: "Building and breaking things".to_string(), title: "The development process".to_string(),
speaker: "Jane Smith".to_string(), speaker: "Jane Smith".to_string(),
url: "https://youtu.be/PsaFVLr8t4E".to_string(), url: "https://youtu.be/PsaFVLr8t4E".to_string(),
}, },
Video { Video {
id: 3, id: 3,
title: "The development process".to_string(), title: "The Web 7.0".to_string(),
speaker: "Matt Miller".to_string(), speaker: "Matt Miller".to_string(),
url: "https://youtu.be/PsaFVLr8t4E".to_string(), url: "https://youtu.be/PsaFVLr8t4E".to_string(),
}, },
Video { Video {
id: 4, id: 4,
title: "The Web 7.0".to_string(), title: "Mouseless development".to_string(),
speaker: "Tom Jerry".to_string(), speaker: "Tom Jerry".to_string(),
url: "https://youtu.be/PsaFVLr8t4E".to_string(), url: "https://youtu.be/PsaFVLr8t4E".to_string(),
}, },
@ -241,6 +241,25 @@ let videos = videos.iter().map(|video| html! {
}).collect::<Html>(); }).collect::<Html>();
``` ```
And finally we need to replace the hardcoded list of videos with the `Html` we created from data:
```rust ,ignore {6-10}
html! {
<>
<h1>{ "RustConf Explorer" }</h1>
<div>
<h3>{ "Videos to watch" }</h3>
- <p>{ "John Doe: Building and breaking things" }</p>
- <p>{ "Jane Smith: The development process" }</p>
- <p>{ "Matt Miller: The Web 7.0" }</p>
- <p>{ "Tom Jerry: Mouseless development" }</p>
+ { videos }
</div>
// ...
</>
}
```
## Components ## Components
Components are the building blocks of Yew applications. By combining components, which can be made of other components, Components are the building blocks of Yew applications. By combining components, which can be made of other components,
@ -302,7 +321,7 @@ struct Video {
Now, we can update our `App` component to make use of `VideosList` component. Now, we can update our `App` component to make use of `VideosList` component.
```rust ,ignore {4-10,16-17,19-20} ```rust ,ignore {4-7,13-14}
#[function_component(App)] #[function_component(App)]
fn app() -> Html { fn app() -> Html {
// ... // ...

View File

@ -7,19 +7,19 @@
}, },
{ {
"id": 2, "id": 2,
"title": "Building and breaking things", "title": "The development process",
"speaker": "Jane Smith", "speaker": "Jane Smith",
"url": "https://youtu.be/PsaFVLr8t4E" "url": "https://youtu.be/PsaFVLr8t4E"
}, },
{ {
"id": 3, "id": 3,
"title": "The development process", "title": "The Web 7.0",
"speaker": "Matt Miller", "speaker": "Matt Miller",
"url": "https://youtu.be/PsaFVLr8t4E" "url": "https://youtu.be/PsaFVLr8t4E"
}, },
{ {
"id": 4, "id": 4,
"title": "The Web 7.0", "title": "Mouseless development",
"speaker": "Tom Jerry", "speaker": "Tom Jerry",
"url": "https://youtu.be/PsaFVLr8t4E" "url": "https://youtu.be/PsaFVLr8t4E"
} }