This repository contains a code for a TicTacToe frontend - a React SPA. It serves as extension of one of my older projects, TicTacToe implementation in C++ that has been modified to communicate with a browser. It operates in a very simple way. Upon entering user creates a new game, and receives URL address that they are expected to share with a person they want to play. Their opponent is expected to open the link and they are joining the game, rest is hopefully self explanatory.
This repository contains code for a TicTacToe frontend single page application written in React (with react-router and JSS). Backend is a little unusual - it is websocket only and the API doesn't contain even a single REST route, all communication happens on the websocket. Reasoning behind it is very simple: websocket would have to be setup anyway, so there was no reason not to use it.
As mentioned previously, backend used to be a self sufficient application, so all of the logic is done there - this application is strictly responsible for displaying information, and communicating user actions to the server.
There is only one requirement for host machine: npm has to be installed, preferably version 6 (stable at the time of commit).
Before proceeding with the following steps, please run:
$ npm install
And set the following environment variables:
REACT_APP_DOMAIN=<domain where the app is served>
REACT_APP_WEBSOCKET=<address of the server>
If you are unsure how to do that, create .env
file in a root folder of cloned repository, paste the above block of code and set required values.
NOTE Please make sure that REACT_APP_WEBSOCKET address starts with ws://
Don't forget to start the server! Instructions can be found in it's repository
To run the app in production environment simply run:
$ npm run start
To create production optimized build run
npm run build
New folder build will be created, containing production build of the application. Contents of that folder can be served using any static server