Step 1 - Create Initial Universe Generation

gameOfLife.js

import { LightningElement, track } from 'lwc';

const DEFAULT_SIZE = 3;
const DEFAULT_COLOUR = {
    ALIVE: '#bb202d',
    DEAD: '#ffffff'
}
export default class GameOfLife extends LightningElement {
 
    columns = DEFAULT_SIZE;
    rows = DEFAULT_SIZE;
    columnWidth = 1;
    rowHeight = 1;
    @track grid = [];
    aliveColor = DEFAULT_COLOUR.ALIVE;
    deadColor = DEFAULT_COLOUR.DEAD;
 
 rendered = false;
 renderedCallback() {
     if (!this.rendered) {
           this.createWorld();
           this.rendered = true;
        }
  }
  createWorld() {
     // Set Initial Random 2D Array
     const universe = this.generateGrid(this.columns, this.rows, true);
     // console.table(universe);
     // Paint the initial Grid
     this.grid = this.renderGrid(universe);
  }

  // 2D Array generator with random toggle
  generateGrid(cols, rows, random = false) {
       // Cell initial state Zero Or One
       return new Array(cols).fill(null)
              .map(() => new Array(rows).fill(0)
                 .map(() => random ? Math.floor(Math.random() * 2) : 0));
      }
  }