Demo: http://sudoku.daiwei.lu
- Clone and cd into project dir.
- Run
npm install
(assume you have Node.js 0.10). - Run
bower install
to install client side dependencies. If you don't have bower, please install it withnpm install bower -g
. - Run
gulp serve
, gulp will fire local server and open webapp in default browser. If not you can manually openlocalhost:9000
in the browser you like. - Now you can play!!
- app: where client side source is stored.
- test: where client side specs are stored.
- gulpfile.js: gulp task config
- Node.js as development dependency to build the webapp.
- SVG to build UI
- Jade as template engine.
- SCSS as CSS preprocessor.
- Mocha and chai for testing framework.
- jQuery, lo-dash, hammer.js, normalize.css as client side dependencies.
- SVG is flexible, scaleable and has a relatively nice cross browser support (IE9+)
- jQuery is widely adopted and easy to use for DOM manipulations.
- lo-dash has varieties of helper methods to process arraies or collections.
- hammer.js provides touch gestures on touch enabled devices. In this app I used
tap
gesture on mobile device. - normalize.css resets style differences between browsers, provides a uniformed look.
- Jade and SCSS got chosen because it makes generating HTML and CSS nice and easy.
- I have to give up using a specific SVG manipulation library such as SVG.js, because I started with jQuery and switching will waste codes I already wrote.
- If I had a chance to use SVG.js, I could add more animations to the UI to make it flow better.
- Pop up number pad sometimes covers part of the board. Could be made to avoid certain areas of the board to provide better user experiences.
- cd into test dir
- Run
bower install
- Open
index.html
in the browser you want to run tests in.