SH-39 #time 1d initialize blog post html5 canvas js libraries

source/posts/2014-07-06-html5_canvas_javascript_libraries.md

@@ -0,0 +1,163 @@
+---
+title: HTML5 Canvas Javascript Libraries
+date: 2014-07-06
+author: leylakapi
+tags: game, development, html5, canvas, javascript, libraries, frameworks, en
+---
+
+## Which libraries should we use in javascript for game development ?
+
+While I looking for javascript library, I found some javascript libraries are used for game development.
+This libraries :
+
+  * provide tools to create animations for game development,
+  * helped to find graphical objects for games,
+  * provide to useful functions which use in your game project  ...etc
+
+15 Useful javascript libraries for game development like below :
+
+  * [Canvas Advanced Animation Toolkit](http://hyperandroid.github.io/CAAT/)
+  * [Kinetic.js](http://kineticjs.com/)
+  * [Fabric.js](http://fabricjs.com/)
+  * [Crafty.js](http://craftyjs.com/)
+  * [Create.js](http://www.createjs.com/)
+  * [Easel.js](http://www.createjs.com/#!/EaselJS)
+  * [oCanvas](http://ocanvas.org/)
+  * [Paper.js](http://paperjs.org/)
+  * [Processing.js](http://processingjs.org/)
+  * [Three.js](http://threejs.org/)
+  * [Jaws.js](http://jawsjs.com/)
+  * [Impact.js](http://impactjs.com/)
+  * [Lime.js](http://www.limejs.com/)
+  * [Melon.js](http://melonjs.org/)
+  * [Joint.js](http://www.jointjs.com/)
+
+Let's continue to take info about html5 canvas javascript libraries.
+
+1- [Canvas Advanced Animation Toolkit](http://hyperandroid.github.io/CAAT/)
+
+  * CAAT is javascript animation toolkit.
+  * CAAT is a director-based scene graph manager
+  * CAAT provide useful and powerful animation environment
+  * CAAT is a platform and works with CSS, WebGL and Canvas.
+  * In addition, CAAT is not only create awesome scene and actors but also has facilities to managing audio.
+  * Open source code in [here](https://github.com/hyperandroid/CAAT)
+
+![CAAT](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/caat.jpg)
+
+2- [Kinetic.js](http://kineticjs.com/)
+
+  * Kinetic.js is HTML5 Canvas javascript framework that enable powerful animations,
+    rotations, transition, node nestings, layering, filtering, caching ..etc
+  * Open source code in [here](https://github.com/ericdrowell/KineticJS)
+
+![Kinetic](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/kineticjs.jpg)
+
+3- [Fabric.js](http://fabricjs.com/)
+
+  * Fabric.js provides to missing object model on canvas, as well as SVG parser.
+  * Also, it provides to animation, geometrical shape, graphics.
+  * Open source code in [here](https://github.com/kangax/fabric.js/)
+
+![Fabric](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/fabricjs.jpg)
+
+4- [Crafty.js](http://craftyjs.com/)
+
+  * Crafty provides to build prototypical or full-featured 2D html5 games.
+  * Crafty uses syntax similar to [jquery](http://jquery.com/) by having a selector
+  engine to select entities by their components.
+  * Open source code in [here](https://github.com/craftyjs/crafty/)
+
+![Crafty](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/craftyjs.jpg)
+
+5- [Create.js](http://www.createjs.com/)
+
+  * Create.js is comprehensive web editing interface for content management systems.
+  * It provide modern full browser-based html5 environment for managing content.
+  * OPen source code in [here](https://github.com/CreateJS/)
+
+![Create](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/create.jpg)
+
+6- [Easel.js](http://www.createjs.com/#!/EaselJS)
+
+  * Easel.js provide to working with canvas element easier.
+  * Also it provides shape based mouse interaction on elements.
+  * This javascript library is useful for games thanks to awesome graphics and generative arts.
+  * Open source code in [here](https://github.com/CreateJS/EaselJS/)
+
+![Easel](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/easyjs.jpg)
+
+7- [oCanvas](http://ocanvas.org/)
+
+  * OCanvas provide to working with object instead of pixels for html5 canvas elements.
+  * It provides to be faster and easier than writing pure javascript on the canvas.
+  * Open source code in [here](https://github.com/koggdal/ocanvas)
+
+![oCanvas](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/ocanvas.jpg)
+
+8- [Paper.js](http://paperjs.org/)
+
+  * Paper.js is vector graphics scripting framework that runs on top of html5 canvas.
+  * It offers to clean DOM and a lot of awesome functionality vector graphics, animations and images.
+
+![Paper](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/paper.jpg)
+
+9- [Processing.js](http://processingjs.org/)
+
+  * Processing.js provide to makes your data visualizations, digital arts, interactive animations,
+  educational graphs, games ..etc
+  * Open source code in [here](https://github.com/jeresig/processing-js)
+
+![Processing](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/processing.jpg)
+
+10- [Three.js](http://threejs.org/)
+
+  * Three.js is library that makes [WebGL](http://get.webgl.org/), 3D in the browser.
+  * it provides to make powerful 3D animations.
+  * Open source code in [here](https://github.com/mrdoob/three.js/)
+
+![Three](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/three.jpg)
+
+11- [Jaws.js](http://jawsjs.com/)
+
+  * Jaws.js is core functions.
+  * Jaws is 2D game development framework.
+  * It provide to make assets(images, musics, json data) in web-games as easy as possible.
+  * Open source code in [here](https://github.com/ippa/jaws)
+
+![Jaws](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/jaws.jpg)
+
+12- [Impact.js](http://impactjs.com/)
+
+  * Impact.js is a javascript game engine, it offer 2D animations, graphics, images for web and desktop games.
+  * It support on all html5 capable browsers and include `iPhone`, `iPod Touch` and `iPhone` .
+
+![Impact](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/impact.jpg)
+
+13- [Lime.js](http://www.limejs.com/)
+
+  * Lime.js offers to support  for all mobile platforms.
+  * It provide to support videos and better audio.
+  * Open source code in [here](https://github.com/digitalfruit/limejs)
+
+![Lime](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/lime.jpg)
+
+14- [Melon.js](http://melonjs.org/)
+
+  * Melon.js is a fresh-lightweight 2D sprite-based engine.
+  * It support multiple audio channel support.
+  * It integrated tiled map format.
+  * Open source code in [here](https://github.com/melonjs/melonJS)
+
+![Melon](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/melon.jpg)
+
+15- [Joint.js](http://www.jointjs.com/)
+
+  * Joint.js is a modern HTML 5 JavaScript library for visualization and interaction with diagrams and graphs.
+  * Joint js is known diagramming library in javascript libraries.
+  * Open source code in [here](https://github.com/DavidDurman/joint)
+
+![Joint](../assets/images/articles/2014-07-06-html5-canvas-javascript-libraries/joint.jpg)
+
+
+That' s all.