Game of Life - Building One With React

Game of Life

Ever heard of Game of Life?
No, it's not a video game. Not even a board game. Actually, it's not a game at all since you can't play it - at least not in the traditional sense. There is no winner and it never ends. So why do people find it fascinating? 🙄

In March 1970, a British mathematician at University of Cambridge John Horton Conway created a unique model of computation (cellular automata) for a Mathematical Games column in Scientific American. It consisted of a 2D-grid randomly populated with identical "cells" and a set of rules that define each future generation based on grid's current state. And the rules were quite simple:
  1. Any live cell with fewer than two live neighbours dies, as if by underpopulation.
  2. Any live cell with two or three live neighbours lives on to the next generation.
  3. Any live cell with more than three live neighbours dies, as if by overpopulation.
  4. Any dead cell with exactly three live neighbours becomes a live cell, as if by reproduction.
By following these few straightforward rules, the game presents us with some very interesting patterns categorized by their behaviour:
  • Still lifesdon't change from one generation to the next (block, hive, loaf, boat, tub etc.)
  • Oscillators return to their initial state after a finite number of generations (blinker, toad, beacon, pulsar etc.)
  • Spaceships move across the grid (glider, light-weight, middle-weight & heavy-weight spaceship etc.)
So, now that we know what it is - feel free to take a look at my public "game-of-life" repo.
It was build using some of my favourite tools of trade:
  • npm as our package manager (good alternative: yarn)
  • React lib or more precisely: Create React App (boilerplate with already predefined config and dummy structure)
  • Jest for unit testing (TODO)
Enjoy! 😊