Fix lesson 4 fragments

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>
  )
 }