Milestone-3: Grid game

Live Solution

• https://ameyadeokule.github.io/tictactoe/

Learning Competencies

At the end of this milestone you will learn

• Breaking down the problem
• Building web pages
• Creating efficient animations for web games
• Manipulating the document structure by using Document Object Model (DOM)
• Storing your application data in the client-side database
• Working with server and fetching data from it by manipulating it
• Process of developing a product

Problem Statement:

It's play time, people!
Many kids initial fascination with computers, like that of nerdy kids, had to do with computer games. They were drawn into the tiny simulated worlds that they could manipulate and in which stories (sort of) unfolded—more, I suppose, because of the way they projected their imagination into them than because of the possibilities they actually offered.
I don’t wish a career in game programming on anyone. Much like the music industry, the discrepancy between the number of eager young people wanting to work in it and the actual demand for such people creates a rather unhealthy environment. But writing games for fun is amusing.
In this milestone, you are going to create one of the following grid games.
We will use the browser DOM to display the game, and we’ll read user input by handling key events.

3.Tic-tac-toe

Tic-Tac-Toe is about Os and Xs or noughts and crosses . The rule of the game is very simple. On a 3x3 grid, a player has to match 3 consecutive Os or Xs horizontally/vertically/diagonally.
play the game here

Instructions

While working on a large project, it's a good idea to spend sometime planning. Some of the things you can plan are:

• Break down the product into multiple versions like 0.1, 0.2, 0.3 etc
  • For e.g. 0.1 could be only the CLI game, 0.2 could be 0.1 with Front end, 0.3 could be 0.2 with jQuery methods and so on..
• Decide what's your MVP, what are your stretch features, make a list of all features you would like to build
  • Each stage can have certain features
  • Every stage builds upon the features from the previous stage(s).
• Trello can be a brilliant tool to work with for this. You can divide feature by Day, progress etc. Figure what works for your team
• Decide how much time you would like to allocate to each stage. A Gantt chart is a useful tool for keeping track of these time frames. It shows how long each task should take, but it also shows which tasks can be done at the same time and which must be done sequentially.
• Keep the project on track. Review, revise and reallocate. Run through these three “Rs” on an ongoing basis.