Tic-Tac-Toe Web App
Live Demo
Source Code
The classic game with a 3x3 grid where the first player to get 3 in a row wins
Project DetailsInfo behind this project
The purpose of this project was to make a simple Javascript app that has a state. The game has a visual state and a virtual state, the virtual state contains the states of the squares as the game itself see's them, the visual state reflects the virtual state and marks the individual squares with an X or O, depending on who's turn it is.
Technologies UsedWhat engines, frameworks and tools were used
Hypertext Markup Language (HTML)
HTML is used to define the general hierarchy and relationships between elements on a webpage. HTML itself, usually doesn't look very presentable and looks like a something you'd find in the 90s, so you'll need to use CSS to add color.
CSS is used in combination with HTML, it is used to "paint" the canvas that was built with HTML. However, CSS is not a programming language and does not provide any programmable functionality.
Javascript can be utilized to provide functionality and programmable logic to webpages and/or servers assumming it is using a JS runtime on the server. With Javascript you can make a popup open to alert the user about unsaved changes or process a login request.
I used Javascript to ..
- .. listen for player square clicks
- .. check if the player or computer won
- .. plays a different chime depending if the player won, lost or got a draw
Git is a Version Control System (VCS) used to track changes to a codebase over time. GitHub is a centralized Git service owned by Microsoft that lets developers easily collaborate with each other. GitHub also offers other tools for development such as Boards (named GitHub Projects), Issues and automation.
This project pushed changed to a central repository where I kept my Web Projects. It is public, so you can see the source code here.