Skip to content

carlosxl/connect-four

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

connect-four

A javascript plugin that insert a mini game "Connect Four" into web page in a <canvas> element.

Visit this wiki page for a detailed description of the game.

Demo

Take a quick look at the demo page.

Usage

Insert the following HTML snippet into your web page:

<div id="app"></div>

Add a script tag:

<script type="text/javascript" src="<path-to-your>/app.min.js"></script>

and that's it!

Customize and Re-build

If you want to customize or extend the game, patch the scripts in /src and run:

$ NODE_ENV=production webpack

to re-build the app.min.js.

While developing the app, run:

$ npm run dev

which will fire up a --hot --inline webpack-dev-server on your localhost:8080.

TODO

  1. Keep a game history so to support advanced actions like "undo" or "replay".
  2. Prettier UI.

References

react-konva: a JavaScript library for drawing complex canvas graphics using React.

This project also heavily uses ES2015 (or actually ES2015+) features with babel compiler. I found babel's introductory page a great place to get started to learn the cool features from ES2015.

About

A mini game implemented with React and Html5 Canvas

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published