Dynamic table creation from React

App.js

import React, { useState } from 'react'
import './App.css'

function Cell( props ) {
  const [ state, setState ] = useState( props.alive )
  return <td class={ props.alive ? 'alive' : 'dead' }>r{props.row}c{props.col}</td>
}

function Table( props ) {

   function *colgen(rownum) {
      for( let col = 0; col < props.cols; ++col ) {
        yield Cell( { row: rownum, col: col, alive: false } )
      }
   }

   function *rowgen( ) {
      for( let row = 0; row < props.rows; ++row ) {
          yield <tr>{ Array.from( colgen(row) ) }</tr>
      }
   }

   let rows = Array.from( rowgen() )

   return <table><tbody>{rows}</tbody></table>

}

function App(props) {
   return Table( { rows:5, cols:4 } )
}