first list example breaks without a `key` prop

the first example for rendering a list has this code

**TodoApp_2_1.re**
```ocaml
ReasonReact.arrayToElement(Array.of_list(
List.map((item) => , items)
))
```

but although this code will compile correctly, when viewing it in a browser, you'll get the following traceback which hides the fact that the runtime error is to do with `validateExplicitKey`

**`Uncaught TypeError: element._owner.getName is not a function`**

 at validateExplicitKey (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:5636:66)

    at validateChildKeys (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:5659:9)

    at Object.createElement (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:5747:9)

    at newrecord.(anonymous function) (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:6730:39)

    at Object._1 (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:1052:12)

    at Object.render (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:6250:32)

    at finishClassComponent (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:22098:31)

    at updateClassComponent (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:22075:12)

    at beginWork (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:22449:16)

    at performUnitOfWork (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:24440:16)

validateExplicitKey @ bundle.js:5636

validateChildKeys @ bundle.js:5659

createElement @ bundle.js:5747

newrecord.(anonymous function) @ bundle.js:6730

_1 @ bundle.js:1052

render @ bundle.js:6250

finishClassComponent @ bundle.js:22098

updateClassComponent @ bundle.js:22075

beginWork @ bundle.js:22449

performUnitOfWork @ bundle.js:24440

workLoop @ bundle.js:24504

callCallback @ bundle.js:14736

invokeGuardedCallbackDev @ bundle.js:14775

invokeGuardedCallback @ bundle.js:14632

renderRoot @ bundle.js:24582

performWorkOnRoot @ bundle.js:25196

performWork @ bundle.js:25148

requestWork @ bundle.js:25057

scheduleWorkImpl @ bundle.js:24940

scheduleWork @ bundle.js:24902

scheduleTopLevelUpdate @ bundle.js:25373

updateContainer @ bundle.js:25411

(anonymous) @ bundle.js:29428

unbatchedUpdates @ bundle.js:25282

renderSubtreeIntoContainer @ bundle.js:29427

render @ bundle.js:29492

renderToElementWithId @ bundle.js:13825

(anonymous) @ bundle.js:6664

__webpack_require__ @ bundle.js:20

module.exports @ bundle.js:63

(anonymous) @ bundle.js:66

bundle.js:23965 The above error occurred in the  component:

    in TodoApp


Consider adding an error boundary to your tree to customize error handling behavior.

Visit https://fb.me/react-error-boundaries to learn more about error boundaries.

logCapturedError @ bundle.js:23965

captureError @ bundle.js:24756

renderRoot @ bundle.js:24607

performWorkOnRoot @ bundle.js:25196

performWork @ bundle.js:25148

requestWork @ bundle.js:25057

scheduleWorkImpl @ bundle.js:24940

scheduleWork @ bundle.js:24902

scheduleTopLevelUpdate @ bundle.js:25373

updateContainer @ bundle.js:25411

(anonymous) @ bundle.js:29428

unbatchedUpdates @ bundle.js:25282

renderSubtreeIntoContainer @ bundle.js:29427

render @ bundle.js:29492

renderToElementWithId @ bundle.js:13825

(anonymous) @ bundle.js:6664

__webpack_require__ @ bundle.js:20

module.exports @ bundle.js:63

(anonymous) @ bundle.js:66

bundle.js:14782 Uncaught Error: A cross-origin error was thrown. React doesn't have access to the actual error object in development. See https://fb.me/react-crossorigin-error for more information.

    at Object.invokeGuardedCallbackDev (bundle.js:14782)

    at invokeGuardedCallback (bundle.js:14632)

    at renderRoot (bundle.js:24582)

    at performWorkOnRoot (bundle.js:25196)

    at performWork (bundle.js:25148)

    at requestWork (bundle.js:25057)

    at scheduleWorkImpl (bundle.js:24940)

    at scheduleWork (bundle.js:24902)

    at scheduleTopLevelUpdate (bundle.js:25373)

    at Object.updateContainer (bundle.js:25411)

invokeGuardedCallbackDev @ bundle.js:14782

invokeGuardedCallback @ bundle.js:14632

renderRoot @ bundle.js:24582

performWorkOnRoot @ bundle.js:25196

performWork @ bundle.js:25148

requestWork @ bundle.js:25057

scheduleWorkImpl @ bundle.js:24940

scheduleWork @ bundle.js:24902

scheduleTopLevelUpdate @ bundle.js:25373

updateContainer @ bundle.js:25411

(anonymous) @ bundle.js:29428

unbatchedUpdates @ bundle.js:25282

renderSubtreeIntoContainer @ bundle.js:29427

render @ bundle.js:29492

renderToElementWithId @ bundle.js:13825

(anonymous) @ bundle.js:6664

__webpack_require__ @ bundle.js:20

module.exports @ bundle.js:63

(anonymous) @ bundle.js:66

this is easy enough to fix if you use the title as a key (for now at least, or you could horrifically suggest using `List.mapi` and passing...). in any case, the code should probably change to

```diff
ReasonReact.arrayToElement(Array.of_list(
- List.map((item) => , items)
+ List.map((item) => , items)
))
```

at least until the subsequent portion where the items actually do have their own ids.

i tried doing this in a pr, but i'm pretty sure this repo doesn't actually include the original source files and just put stuff here (why not, though, jared??)

Comienza con el ejemplo TodoApp_2_1.re y confirma si su código fuente original está disponible, ya que el issue indica que este repositorio podría contener únicamente material generado. Actualiza el ejemplo de renderizado de listas para que cada TodoItem tenga el key descrito y, después, verifica que el navegador ya no informe del error relacionado con key que se muestra en bundle.js.

Escrito por el modelo de indexación a partir del texto del issue.