Building tic-tac-toe game using ReactJs and Firebase

Written in reactjs 16, react-router 4, redux, nodejs and firebase.

Feel free to clone the repository here and I’d be happy to accomodate any suggestions or improvements. As for the Reactjs 16 new features, it was not really demonstrated on this project. Further improvements will be coming up highlighting Reactjs 16 new feautres. Redux was really not clearly demonstrated here as I was using firebaseconnect and it feels like not a very good library in demonstrating what Redux and how Redux should be used. My mistake… :-). I will create a different post just for Redux.

Tic-tac-toe is a paper-and-pencil game for two players, X and O, who take turns marking the spaces in a 3×3 grid. The player who succeeds in placing three of their marks in a horizontal, vertical, or diagonal row wins the game.

Demo

Stack

Reactjs
Redux
React-router v4
ES6
NodeJs
Firebase
Twitter Bootstrap (Flatly custom theme)

Play with your friends or play with AI

AI is using Minimax algorithim.

Let’s see if you can beat em… :-)

Installation

Clone the repository

git clone https://github.com/belmer/X-Tic-Tac-Toe.git

If NodeJs is not installed yet, please get it from here

After nodejs installation run the following command:

yarn install // To install all dependecies or
npm i // If your using npm package manager

Running

yarn start // Start Dev server and play... :-)

It should display which port is running. Usually at port 3000. On your browser visit http://localhost:3000

Note: Best viewed on Chrome browser… :-)

Production

To build for production, run:

npm run build

Note

If your experiencing any issues and you can’t run the program. Please check your nodejs installation. It’s most likely not going to work on older version of nodejs. I would advice installing nodejs version v8.0.0