From 1ac5b51f39130aa7556ed1741881ec43157bda9e Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Wed, 27 Feb 2019 09:36:25 -0500
Subject: [PATCH] some more content

---
 .../tutorial/03-logic/03-else-if-blocks/text.md | 11 ++++++++++-
 .../03-logic/04-each-blocks/app-a/App.svelte    | 15 +++++++++++++++
 .../03-logic/04-each-blocks/app-b/App.svelte    | 15 +++++++++++++++
 .../tutorial/03-logic/04-each-blocks/text.md    | 17 +++++++++++++++++
 site/content/tutorial/99-todo/99-todo/text.md   |  2 +-
 5 files changed, 58 insertions(+), 2 deletions(-)
 create mode 100644 site/content/tutorial/03-logic/04-each-blocks/app-a/App.svelte
 create mode 100644 site/content/tutorial/03-logic/04-each-blocks/app-b/App.svelte
 create mode 100644 site/content/tutorial/03-logic/04-each-blocks/text.md

diff --git a/site/content/tutorial/03-logic/03-else-if-blocks/text.md b/site/content/tutorial/03-logic/03-else-if-blocks/text.md
index 16dd6b7f60..18faeacfe6 100644
--- a/site/content/tutorial/03-logic/03-else-if-blocks/text.md
+++ b/site/content/tutorial/03-logic/03-else-if-blocks/text.md
@@ -2,5 +2,14 @@
 title: Else-if blocks
 ---
 
-Just like in JavaScript, we can 'chain' related conditional blocks together:
+Multiple conditions can be 'chained' together with `else if`:
 
+```html
+{#if x > 10}
+	<p>{x} is greater than 10</p>
+{:else if 5 > x}
+	<p>{x} is less than 5</p>
+{:else}
+	<p>{x} is between 5 and 10</p>
+{/if}
+```
\ No newline at end of file
diff --git a/site/content/tutorial/03-logic/04-each-blocks/app-a/App.svelte b/site/content/tutorial/03-logic/04-each-blocks/app-a/App.svelte
new file mode 100644
index 0000000000..ff625c899f
--- /dev/null
+++ b/site/content/tutorial/03-logic/04-each-blocks/app-a/App.svelte
@@ -0,0 +1,15 @@
+<script>
+	let cats = [
+		{ id: 'J---aiyznGQ', name: 'Keyboard Cat' },
+		{ id: 'z_AbfPXTKms', name: 'Maru' },
+		{ id: 'OUtn3pvWmpg', name: 'Henri The Existential Cat' }
+	];
+</script>
+
+<h1>The Famous Cats of YouTube</h1>
+
+<ul>
+	<!-- open each block -->
+		<li><a target="_blank" href="https://www.youtube.com/watch?v={cat.id}">{cat.name}</a></li>
+	<!-- close each block -->
+</ul>
\ No newline at end of file
diff --git a/site/content/tutorial/03-logic/04-each-blocks/app-b/App.svelte b/site/content/tutorial/03-logic/04-each-blocks/app-b/App.svelte
new file mode 100644
index 0000000000..61dda5f5a8
--- /dev/null
+++ b/site/content/tutorial/03-logic/04-each-blocks/app-b/App.svelte
@@ -0,0 +1,15 @@
+<script>
+	let cats = [
+		{ id: 'J---aiyznGQ', name: 'Keyboard Cat' },
+		{ id: 'z_AbfPXTKms', name: 'Maru' },
+		{ id: 'OUtn3pvWmpg', name: 'Henri The Existential Cat' }
+	];
+</script>
+
+<h1>The Famous Cats of YouTube</h1>
+
+<ul>
+	{#each cats as { id, name }}
+		<li><a target="_blank" href="https://www.youtube.com/watch?v={id}">{name}</a></li>
+	{/each}
+</ul>
\ No newline at end of file
diff --git a/site/content/tutorial/03-logic/04-each-blocks/text.md b/site/content/tutorial/03-logic/04-each-blocks/text.md
new file mode 100644
index 0000000000..3fbe56398a
--- /dev/null
+++ b/site/content/tutorial/03-logic/04-each-blocks/text.md
@@ -0,0 +1,17 @@
+---
+title: Each blocks
+---
+
+If you need to loop over lists of data, use an `each` block:
+
+```html
+<ul>
+	{#each cats as cat}
+		<li><a target="_blank" href="https://www.youtube.com/watch?v={cat.id}">{cat.name}</a></li>
+	{/each}
+</ul>
+```
+
+> The expression (`cats`, in this case) can be any array or array-like object (i.e. it has a `length` property). You can loop over generic iterables with `each [...iterable]`.
+
+If you prefer, you can use destructuring — `each cats as { id, name }` — and replace `cat.id` and `cat.name` with `id` and `name`.
\ No newline at end of file
diff --git a/site/content/tutorial/99-todo/99-todo/text.md b/site/content/tutorial/99-todo/99-todo/text.md
index 7ae616b80f..fe8583e145 100644
--- a/site/content/tutorial/99-todo/99-todo/text.md
+++ b/site/content/tutorial/99-todo/99-todo/text.md
@@ -38,7 +38,7 @@ Side-quest: create a 'Svelte for new developers' blog post that assumes no knowl
 ## Logic
 
 * [x] If blocks
-* [ ] Else/elseif blocks
+* [x] Else/elseif blocks
 * [ ] Each blocks
 * [ ] Keyed each blocks (maybe? kind of need to cover transitions before we can make this obvious)
 * [ ] Await blocks