Battleship

objectives

• create browser-playable version of classic Battleship game
• practice Test Driven Development (first time), via Jest
• responsive design, including mobile

improve AI with two modes:

• evaluate probability of ship placement (build a heat map), update w/ intel from each turn (hit or miss)
• after a hit, target adjacent squares and continue on axis of successive hits (and after sinking ship, return to previous mode)

reflections

• initial foray into testing, with Jest, which took time to learn and required adjusting workflow (write test first, run it to make sure it failed, then write code, test, and refactor/continue)
• I enjoyed creating an AI that offers more of a challenge for the player (median game length: ~47 moves) as opposed to simply generating random shots (median length: ~97 moves). I gathered insights from posts by Nick Berry and Aydin Schwartz.
• added instructions and emojis to improve UX
• built w/ Javascript, Webpack, Jest, CSS

screenshots

• place fleet page
  
• let the battle begin!
  
• mobile version:
  
  

improvements

• a glitch where removing sunk ship coordinates from the hitsArray doesn't work perfectly. I'm not certain why/what is happening, as it appears to occasionally remove more hits (beyond the coordinates of the ship that was just sunk).