/tic-tac-toe

Project one WDI

Primary LanguageJavaScript

Overview

WDI - Project 1 Create a game of Tic-Tac-Toe


Goals (Real-World Application)

  • Build a web application from scratch, without a starter codebase
  • Use problem solving to determine game logic for a simple game
  • Separate HTML, CSS, and JavaScript files in your application
  • Build an application to a spec that someone else gives you
  • Build a dynamic game that allows two players to compete
  • Have a README.md file that explains your app

Technical Requirements

Your app must:

  • Render a game board in the browser
  • Switch turns between X and O (or whichever markers you select)
  • Visually display which side won if a player gets three in a row or show a draw/cat’s game if neither does
  • Optionally use a webservice, eg http://placehold.it, to load images
  • Have separate HTML / CSS / JavaScript files
  • Use a local storage system to simplify data storage and retrieval
  • Stick with KISS (Keep It Simple Stupid) and DRY (Don’t Repeat Yourself) principles
  • Use jQuery or pure javascript API for DOM manipulation
  • Be deployed somewhere where the rest of the world can see it
  • Use semantic markup for HTML and CSS (adhere to best practices)

Technologies used

  • HTML5, CSS3
  • JavaScript
  • Jquery Library
  • JSON (localStorage access)

Approach

  • Pen and paper mock up of core requirements
  • Created relevant folders and files
  • Created repo and link to GitHub
  • Reproduced game logic from mock up in Javascript
  • Applied styling via CSS
  • Integrated more features i.e. keeping score, identifying player and localStorage to keep high score

Unsolved Problems

  • Wrangling CSS
  • Completing round 2 of double or nothing. Specifically integrating the second game board and tracking the score.
  • Utilising Jquery library to fullest extent
  • Keeping it DRY

Future

  • Integrating AI opponent or multiplayer via multiple computers

Deliverables

  • README.md file explaining the technologies used, the approach taken, unsolved problems, etc

  • Link to Github repo: GitHub repo

  • Link to a hosted version of game: Tic-Tac-Toe


Timeline

Week 3, start of day 2 Requirements Explanation / Project Setup

Week 3, start of day 5 Project complete

week 3, end of day 5 Project presentation