https://github.com/awkaiser/react-tictactoe

Undefeatable tic tac toe: TypeScript, React, and React Hooks
https://github.com/awkaiser/react-tictactoe

es6 hooks hooks-api-react minimax react react-hooks react-hooks-demo react-hooks-tutorial tic-tac-toe tictactoe typescript webpack

Last synced: about 1 month ago
JSON representation

Undefeatable tic tac toe: TypeScript, React, and React Hooks

• Host: GitHub
• URL: https://github.com/awkaiser/react-tictactoe
• Owner: awkaiser
• License: mit
• Created: 2016-05-10T17:59:30.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2024-06-30T19:26:03.000Z (6 months ago)
• Last Synced: 2024-07-04T11:58:20.327Z (6 months ago)
• Topics: es6, hooks, hooks-api-react, minimax, react, react-hooks, react-hooks-demo, react-hooks-tutorial, tic-tac-toe, tictactoe, typescript, webpack
• Language: TypeScript
• Homepage: https://awkaiser.github.io/react-tictactoe/
• Size: 5.08 MB
• Stars: 7
• Watchers: 1
• Forks: 3
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Tic Tac Toe

Undefeatable tic tac toe (minimax algorithm) developed with ES6, React.js and React Hooks

[Play Tic Tac Toe online](https://awkaiser.github.io/react-tictactoe/)

## Another one?!

Tic Tac Toe apps have apparently replaced TODO lists in recent years. My implementation predates [the official "Intro to React" Tic Tac Toe tutorial](https://reactjs.org/tutorial/tutorial.html) by [~5 months](https://github.com/reactjs/reactjs.org/commit/aa9544bfac6603aa7e7ab978be97011ad4d64012#diff-3ccbede9e75746bc98284acd56d132a9) and takes a different approach. Over time, this project has become my "keep up with React best practices" test bed: its state management and user interactivity is just complex enough to kick the tires on new React releases and adjust as necessary.

## Docker + VS Code

If you have [Docker](https://www.docker.com/products/docker-desktop) and [VS Code](https://code.visualstudio.com/download) installed, you can work with this project as a [dev container](https://code.visualstudio.com/docs/remote/create-dev-container):

1. Clone project & open project directory in VS Code

3. Follow `devcontainer` auto-detection prompts or run `Remote-Containers: Reopen in Container` command

4. Once attached to remote container in VS Code, run `npm start` via [integrated VS Code terminal](https://code.visualstudio.com/docs/editor/integrated-terminal)

5. Open [http://localhost:3000](http://localhost:3000) in your browser

6. Modify project & see changes reflected live