DetectiveAzul / chess-react

React Single-Page Chess Game with network capabilities through the use of Socket.IO

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

xChess 1.0

xChess is a learning project I have developed in order to learn the tricks and secrets behind React JS. In a few fancy buzzword, xChess is a React Single-Page web application for playing chess powered with Socket.IO for network play, Express to handle RESTful routes that help the app to store/retrieve games on a MongoDB database and allowing multiple players to play multiple games at the same time, against other Human players or even a basic IA.

I have some libraries to ease a bit the process of creating the Chessboard and integrating it with Chess moves. If you are interested specifically on the source of this libraries, I totally recommend you to visit their own documentation:

For the notification system I used a React Component available from NPM itself:

And, of course, the more wide-known:

Chess APP screenshot

Instructions

To install a local version of xChess you need first to have installed NPM and MongoDB.

  • Install npm: $ brew install npm
  • Install mongodb: $ brew install mongodb
  • If prompted, install node
  • Download server $ git clone https://github.com/DetectiveAzul/chess-react-server
  • Go into the folder $ cd chess-react-server
  • Run npm packager $ npm install
  • Create development database: $ mongod
  • Run server on a new tab: $ npm start
  • $cd ..
  • Download client $ git clone https://github.com/DetectiveAzul/chess-react
  • Run npm packager $ npm install
  • Run client $ npm start

Run

  • Open Google Chrome and go to http://localhost:3000

About playing against AI

  • Just set up [AI] to true before moving a white piece. AI only plays with Black side, and its moved are triggered as soons as you drop your piece to a legal move. You can UNDO movements and train with it on the three difficulty levels.

About playing against Humans

  • Lobby only loads the list of games when mounting the components and when deleting games, so if you don't see your friends game, just reload the page.

About

React Single-Page Chess Game with network capabilities through the use of Socket.IO


Languages

Language:JavaScript 97.1%Language:CSS 1.9%Language:HTML 1.0%