title: Best way to return array.map() in React?
body: <p>I'm kind of new to React and am following some video tutorials as also am I reading some books about it. (None older than 2016 - because It changes a lot)</p>
  
  <p>During my journey, I passed by two ways to do the array.map() loop in React.</p>
  
  <p><strong>1. Do the map loop inside the parent component and just return the elements from the child component</strong></p>
  
  <pre><code>class ItemsList extends React.Component {
    render() {
      const items = this.props.items.map((item) =&gt;(
        &lt;Item
          id={item.id}
          title={item.title}
        /&gt;
    ));
      return (
        &lt;div id='items'&gt;
          {item}
        &lt;/div&gt;
      );
    } //render
  }
  
  class Item extends React.Component {
    render() {
      return (
        &lt;li key={this.props.id}&gt;
            {this.props.title}
        &lt;/li&gt;
      );
    } //render
  }
  </code></pre>
  
  <p><strong>2. Do the map loop inside the child component and return the whole to the parent component</strong></p>
  
  <pre><code>class ItemsList extends React.Component {
    render() {      
        ));
          return (
            &lt;div id='items'&gt;
              &lt;Item
              id={item.id}
              title={item.title}
              /&gt;
            &lt;/div&gt;
          );
        } //render
  }
  
  class Item extends React.Component {
    render() {
      const item = this.props.items.map((item) =&gt;(
        &lt;li key={item.id}&gt;
            {item}
        &lt;/li&gt;
      ));
      return(item);
    }
  }
  </code></pre>
  
  <p>If i understand it correctly, one of the advantages of React is that it's a more "Team-friendly" way to work on an app because everyone can work on one component at a time without really interfering with somebody else work.</p>
  
  <p>But based on this, I would opt for option 2, because we touch the parent component as little as possible and focus more on the child component.</p>
  
  <p>But I also believe it's more smart to choose option 1, because we have all the data and bindings inside the parent component which makes it more structurized and less binding needy for the child component.</p>
  
  <p>Sorry if I'm still missing some vocabulary to explain this better for the experienced React developers - but I hope I made myself clear about this.</p>
  
  <p>Thanks for your time taken!</p>