title: Pass props to a child component on page load - react with next.js
body: <p>I'm new to React and Next.js. I'm trying to pass down props to a child component from a fetch request to my backend (express server / MySQL database. The returned data is in json format and is currently being printed to my browser window. The child component is a ProductList, which contains the rendered Products.</p>
  
  <pre><code>import fetch from 'isomorphic-unfetch'
  
  import ProductList from '../components/ProductList/ProductList';
  
  const Index = () =&gt; (
  
      &lt;div&gt;
          &lt;ProductList products={products}/&gt;
      &lt;/div&gt;
  
  )
  Index.getInitialProps = async function () {
      const res = await fetch('http://localhost:3000');
      const data = await res.json();
      return {products : data}
  }
  
  export default Index;
  </code></pre>