From b31878c2c1ba423fede7542c473092bba5943dfa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kay=20Pl=C3=B6=C3=9Fer?= <kay-is@users.noreply.github.com>
Date: Sat, 30 Jun 2018 14:19:56 +0200
Subject: [PATCH] Fix lesson 4 fragments

---
 04-components.html | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/04-components.html b/04-components.html
index 4445b9a..dc936b0 100644
--- a/04-components.html
+++ b/04-components.html
@@ -37,26 +37,26 @@ <h2>{data}</h2>
 // Since React 16.0.0, components can return an array of elements as well
 // In doing so, no additional wrapper element is created
 // One caveat is that, similarly to what we do when rendering an array,
-// we have to add a unique key to each element in the array
+// we have to add a unique key to each element in the array, also don't forget the commas
 // (we'll see more on this in the next lesson)
 function MyComponent() {
   var data = "world"
   return [
-    <h1 key="hello">Hello</h1>
+    <h1 key="hello">Hello</h1>,
     <h2 key="data">{data}</h2>
   ]
 }
 
 // Since React 16.2.0, we can use special "wrapper" components called fragments
 // that behave the same (no extra wrapper element created)
-// but remove the need to explitly set keys (fragments do this under the hood)
+// but remove the need to explitly set keys (fragments do this under the hood) and commas
 function MyComponent() {
   var data = "world"
   return (
-    <Fragment>
+    <React.Fragment>
       <h1>Hello</h1>
       <h2>{data}</h2>
-    </Fragment>
+    </React.Fragment>
   )
 }