Calculator - Idea from The Odin Project

Live demo

Live Demo

Technologies

  • CSS3
  • Javascript
  • React.js

Project steps

  • Create Game Board
  • Allow Player add Mark in Game Board by onClick function
  • Disable Player re-click the selected grid
  • Check it is player turn or computer turn
  • If computer turn, computer add mark in Game Board
  • Store All the mark/selection into array
  • Computer & Player Selection should update the array
  • Check if computer & player win in their round. if no, change to next turn. If no one win and all grid are filled. This round draw.
  • A better style
  • Add reset button
  • Maybe a smarter computer player

Difficulties

  1. Stuck when computer complete their move and change to player turn
    • Redesign the logically workflow by writing on paper
  2. Tried to use count to control computer and player turn. But the count seems not update correctly
    • Using the remaining position length to determine. odd number will be player and even number will be computer
  3. Learnt how to create space between text by using '&nbsp ;'
  4. Stuggling on choosing color theme of the page