This repository has got HTML, CSS, and mainly JavaScript files. It contains a solid introduction to Javascript.

Here is a cool snake game that I implemented with JavaScript:

Other helpful books and websites:

1. JavaScript: The Good Parts by Douglas Crockford (O’Reilly Media, 2008)

2. Eloquent JavaScript, 2nd Edition, by Marijn Haverbeke (No Starch Press, 2014)

3. JavaScript: The Definitive Guide, 4th Edition, by David Flanagan (O’Reilly Media, 2001)

4. The Mozilla Developer Network’s JavaScript resources: https://developer.mozilla.org/enUS/docs/Web/JavaScript/

5. Codecademy JavaScript courses: http://www.codecademy.com/en/tracks/javascript/

Web pages live on web servers. A SERVER stores all the HTML, CSS, and JavaScript for a web page, and it allows people to access the page from the Internet. One can write programs for the server (called server-side code) to make the server generate new HTML files each time a web page is loaded. For example, when you visit http://twitter.com/, a program runs on a server that finds the latest tweets for your feed, generates an HTML file containing those tweets, and sends that file to your browser. Node.js lets one write server-side code in JavaScript. More about Node.js:

• Node.js documentation: http://nodejs.org/
• The Node Beginner Book: http://www.nodebeginner.org/

To make interactive graphics in JavaScript, there are two main options: the canvas element and SVG.

A list of tutorials and games one can use to learn more on canvas:

• The Mozilla Developer Network’s Canvas Tutorial: https://developer.mozilla.org/enUS/docs/Web/API/Canvas_API/Tutorial/
• Code Monster from Crunchzilla: http://www.crunchzilla.com/code-monster/

SVG is an image format that lets one draw shapes and animate them without redrawing from scratch for each animation step. SVG programming can be difficult to get the hang of, but it’s much easier when one use the JavaScript library called Raphaël. Resources for learning Raphaël:

• Raphaël website: http://raphaeljs.com/
• An Introduction to the Raphaël JS Library: http://code.tutsplus.com/tutorials/an-introduction-tothe-raphael-js-library--net-7186/

To make a 2D drawing context one called canvas.getContext("2d"). It’s also possible to do 3D graphics using canvas. This is another one of those areas where it’s easier to use a library, the recommended one is three.js. Here are some resources for learning three.js:

• three.js Manual: http://threejs.org/docs/index.html#Manual
• The Beginner’s Guide to three.js: http://blog.teamtreehouse.com/the-beginners-guide-to-three-js/

One can even control robots using JavaScript! For example, the Parrot AR.Drone is a small flying helicopter that you can control using Node.js. Also check out Johnny-Five, a JavaScript library that lets you use Node.js to control devices such as the Arduino (a popular microcontroller that’s used in lots of homemade electronics and robotics projects). Here are some resources for learning how to control robots and other devices with JavaScript:

• node-ar-drone: https://github.com/felixge/node-ar-drone/
• NodeCopter: http://nodecopter.com/
• NodeBots: http://nodebots.io/
• Johnny-Five: https://github.com/rwaldron/johnny-five/

JavaScript also allows one to do advanced audio programming in web browsers using the Web Audio API (short for application programming interface). You can use the Web Audio API to make sound effects or even create your own music! Here are some resources for learning more about the Web Audio API:

• The Mozilla Developer Network’s Web Audio API: https://developer.mozilla.org/enUS/docs/Web/API/Web_Audio_API/
• HTML5 Rocks: Getting Started with Web Audio API:
• http://www.html5rocks.com/en/tutorials/webaudio/intro/

To do more game programming in JavaScript, one might want to try using a game engine. A game engine is a collection of code that handles a lot of the lower-level concerns of the game (like keyboard and mouse input), allowing you to concentrate on the parts that make your game different. Here are some resources you can check out to learn more about game programming and game engines:

• Crafty game engine: http://craftyjs.com/
• Pixi Renderer: https://github.com/GoodBoyDigital/pixi.js
• HTML5 Game Engines: http://html5gameengine.com/
• Udacity HTML5 Game Development: https://www.udacity.com/course/cs255
• 3D Game Programming for Kids by Chris Strom (Pragmatic Programmers, 2013)