Cacher is the code snippet organizer for pro developers

import React from 'react';
import ReactDOM from 'react-dom';

const App = props => {
  return <List items={listItems} />;
};
const items = ['Bread', 'Milk', 'Eggs', 'Tea'];

const listItems = [];

for (let i = 0; i < items.length; i++) {
  listItems.push(<li key={i}>{items[i]}</li>);
}

const List = props => <ul>{props.items}</ul>;

ReactDOM.render(<App />, document.getElementById('root'));