[ { "path": ".gitignore", "content": "_site/\n*.DS_Store\nnode_modules\nnpm-debug.log\ndist/\n.tmp/\n" }, { "path": "Gruntfile.js", "content": "module.exports = function(grunt){\n\n // Loading i18n task\n require('./scripts/tasks/i18n')(grunt);\n // -- Init Configuration ---------------------------------------\n grunt.initConfig({\n\n application:{\n dev: {\n csspath:\"/assets/css/\",\n jspath:\"/assets/js/\",\n imgpath:\"/assets/img/\",\n\n },\n dist:{\n csspath:\"/assets/css/\",\n jspath:\"/assets/js/\",\n imgpath:\"/assets/img/\",\n }\n },\n uglify:{\n options: {\n compress: false,\n report: true,\n banner: '/* Minified on <%= grunt.template.date() %>*/\\n'\n },\n dev: {\n files: {\n '.tmp/public/assets/js/core.min.js': [\n 'public/assets/js/vendor/jquery.scrollstop.js',\n 'public/assets/js/vendor/jquery.lazyload.js',\n 'public/assets/js/core.js'\n ]\n }\n },\n dist: {\n files: {\n 'dist/public/assets/js/core.min.js': [\n 'public/assets/js/vendor/jquery.scrollstop.js',\n 'public/assets/js/vendor/jquery.lazyload.js',\n 'public/assets/js/core.js'\n ]\n }\n }\n },\n cssmin: {\n options: {\n banner: '/* Minified on <%= grunt.template.date() %>*/\\n'\n },\n dev: {\n files: {\n '.tmp/public/assets/css/core.min.css': [\n 'public/assets/css/normalize.css',\n 'public/assets/css/core.css'\n ]\n }\n },\n dist: {\n files: {\n 'dist/public/assets/css/core.min.css': [\n 'public/assets/css/normalize.css',\n 'public/assets/css/core.css'\n ]\n }\n }\n },\n copy: {\n dist: {\n files: [\n // includes files within path and its sub-directories\n {expand: true, src: ['public/**', '!**/*[.css|.js]'], dest: 'dist/'}\n ],\n },\n dev: {\n files: [\n // includes files within path and its sub-directories\n {expand: true, src: ['public/**', '!**/*[.css|.js]'], dest: '.tmp/'}\n ],\n },\n },\n clean: {\n dev: [\".tmp/\"],\n dist: [\"dist/\"]\n },\n connect: {\n dev: {\n options: {\n port: 9001,\n base: ['.tmp/public']\n }\n },\n dist: {\n options: {\n port: 9002,\n base: ['dist/public/'],\n keepalive:true\n }\n }\n },\n watch: {\n assets: {\n files: ['public/assets/css/*.css', 'public/assets/js/*.js', 'templates/**/*.html', 'i18n/**/*.json', 'i18n/**/*.html'],\n tasks:['build'],\n options: {\n livereload: true\n }\n }\n },\n imagemin: { // Task\n dynamic: { // Another target\n files: [{\n expand: true, // Enable dynamic expansion\n cwd: 'public/assets/img', // Src matches are relative to this path\n src: ['**/*.{png,jpg,gif}'], // Actual patterns to match\n dest: 'dist/public/assets/img' // Destination path prefix\n }]\n }\n }\n\n });\n\n // -- Load Plugins ----------------------------------------------\n grunt.loadNpmTasks('grunt-contrib-cssmin');\n grunt.loadNpmTasks('grunt-contrib-uglify');\n grunt.loadNpmTasks('grunt-contrib-connect');\n grunt.loadNpmTasks('grunt-contrib-watch');\n grunt.loadNpmTasks('grunt-contrib-copy');\n grunt.loadNpmTasks('grunt-contrib-imagemin');\n grunt.loadNpmTasks('grunt-contrib-clean');\n\n // -- Register Task ---------------------------------------------\n grunt.registerTask('server', ['clean:dev' ,'i18n', 'copy:dev','cssmin:dev', 'uglify:dev','connect:dev', 'watch']);\n grunt.registerTask('dist', ['clean:dist', 'i18n', 'copy:dist', 'cssmin:dist', 'uglify:dist', 'imagemin']);\n grunt.registerTask('build', ['clean:dev', 'i18n', 'copy:dev', 'cssmin:dev', 'uglify:dev']);\n grunt.registerTask('serverdist', ['connect:dist']);\n\n};\n" }, { "path": "LICENSE", "content": "Copyright (c) 2014 William Oliveira\n\nhttp://creativecommons.org/licenses/by-nc-sa/3.0/\n" }, { "path": "README.md", "content": "![](http://i.imgur.com/jaEbd80.png)\n\nFeel free to contribute!\n\n## Where?\n\n\n\n## Why?\n\nToday we have a bunch of websites running JavaScript. I think we need a place to put all the best practices and references together so we can share this (good) information and help keep the web more organized.\n\n## Who?\n\n[William Oliveira](http://github.com/gnuwilliam) - Open Source Developer\n\n[Allan Esquina](http://github.com/allanesquina) - Open Source Developer\n\n## License\n\n[Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License](http://creativecommons.org/licenses/by-nc-sa/3.0/)\n\n## Sponsor\n\n[![GoBacklog](https://i.imgur.com/7lJBAXA.png)](https://gobacklog.com)\n" }, { "path": "i18n/README.md", "content": "# Do you want this project in your language?\n\n### Feel free to contribute! :+1:\n\n\nTo translate this project to another language, you need to copy the ***default language directory*** and then translate it.\n- en-us/ - Default language.\n\nThe **.json file is the main file of translation's structure**, be sure that this file have the **same name of your parent directory**.\n\nThe application will export the files in **'Public/language'** name-based on json filename.\n" }, { "path": "i18n/ar-ar/ar-ar.json", "content": "{\n \"meta\": {\n \"title\": \"جافاسكريبت: الطريقة الصحيحة\",\n \"description\": \"A quick reference to best practices for writing JavaScript -- links to code patterns and tutorials from around the web\"\n },\n \"direction\": \"rtl\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"اختر طريقك\",\n \"links\": [{\n \"title\": \"لنبدأ\",\n \"url\": \"#getting-started\"\n }, {\n \"title\": \"طريقة كتابة شفرة جافاسكريب\",\n \"url\": \"#js-code-style\"\n }, {\n \"title\": \"الجوانب الجيدة\",\n \"url\": \"#the-good-parts\"\n }, {\n \"title\": \"ما يجب رؤيته\",\n \"url\": \"#must-see\"\n }, {\n \"title\": \"أنماط\",\n \"url\": \"#patterns\"\n }, {\n \"title\": \"أدوات الاختبار\",\n \"url\": \"#testing-tools\"\n }, {\n \"title\": \"أطر العمل\",\n \"url\": \"#frameworks\"\n }, {\n \"title\": \"محركات الألعاب\",\n \"url\": \"#game-engines\"\n }, {\n \"title\": \"أخبار\",\n \"url\": \"#news\"\n }, {\n \"title\": \"قراءة\",\n \"url\": \"#reading\"\n }, {\n \"title\": \"المدونات الصوتية (برودكاست)\",\n \"url\": \"#podcasts\"\n }, {\n \"title\": \"دروس فيديو\",\n \"url\": \"#screencasts\"\n }, {\n \"title\": \"من تتابع\",\n \"url\": \"#whotofollow\"\n }, {\n \"title\": \"مزودو «منصة حَوسَبة لخدمات البَرمَجة»\",\n \"url\": \"#paas\"\n }, {\n \"title\": \"مساعدون\",\n \"url\": \"#helpers\"\n }]\n },\n \"gettingStarted\": {\n \"title\": \"لنبدأ\",\n \"text\": \"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\": \"طريقة كتابة شفرة جافاسكريب\",\n \"text\": \"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\": {\n \"title\": \"الجوانب الجيدة\",\n \"text\": \"{{@link=partials/good-parts.html}}\"\n },\n \"mustSee\": {\n \"title\": \"ما يجب رؤيته\",\n \"videos\": [{\n \"title\": \"Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains\",\n \"url\": \"https://www.youtube.com/embed/QyUFheng6J0\"\n }]\n },\n \"patterns\": {\n \"title\": \"أنماط\",\n \"text\": \"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\": {\n \"title\": \"أدوات الاختبار\",\n \"text\": \"{{@link=partials/testing-tools.html}}\",\n \"links\": [{\n \"name\": \"Mocha\",\n \"url\": \"http://mochajs.org\",\n \"description\": \"Maintained by TJ Holowaychuk\"\n }, {\n \"name\": \"QUnit\",\n \"url\": \"http://qunitjs.com\",\n \"description\": \"Maintained by jQuery\"\n }, {\n \"name\": \"Jasmine\",\n \"url\": \"https://github.com/pivotal/jasmine\",\n \"description\": \"Maintained by Pivotal Labs\"\n }, {\n \"name\": \"Karma\",\n \"url\": \"http://karma-runner.github.io/\",\n \"description\": \"Maintained by the team behind AngularJS. Mostly by Vojta Jina\"\n }, {\n \"name\": \"Intern\",\n \"url\": \"http://theintern.io\",\n \"description\": \"Maintained by Sitepen\"\n }, {\n \"name\": \"Istanbul\",\n \"url\": \"http://gotwarlost.github.io/istanbul\",\n \"description\": \"A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\"\n }, {\n \"name\": \"Sinon.JS\",\n \"url\": \"http://sinonjs.org\",\n \"description\": \"Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Sinon.JS community\"\n }, {\n \"name\": \"DexterJS\",\n \"url\": \"https://github.com/leobalter/DexterJS\",\n \"description\": \"A test helper to mock functions and the XHR object, maintained by Leo Balter\"\n }, {\n \"name\": \"AVA\",\n \"url\": \"https://github.com/sindresorhus/ava\",\n \"description\": \"Test runner with asynchronous tests, maintained by Sindre Sorhus\"\n }, {\n \"name\": \"Jest\",\n \"url\": \"https://github.com/facebook/jest\",\n \"description\": \"Painless JavaScript Testing, maintained by Facebook\"\n }]\n },\n \"frameworks\": {\n \"title\": \"أطر العمل\",\n \"cat\": [{\n \"title\": \"فائدة عامة\",\n \"links\": [{\n \"name\": \"jQuery\",\n \"url\": \"http://jquery.com\",\n \"description\": \"jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\"\n }, {\n \"name\": \"YUI\",\n \"url\": \"http://yuilibrary.com\",\n \"description\": \"Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\"\n }, {\n \"name\": \"ZeptoJS\",\n \"url\": \"http://zeptojs.com\",\n \"description\": \"Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\"\n }, {\n \"name\": \"Dojo Toolkit\",\n \"url\": \"http://dojotoolkit.org\",\n \"description\": \"Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\"\n }, {\n \"name\": \"Underscore.js\",\n \"url\": \"http://underscorejs.org\",\n \"description\": \"Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\"\n }]\n }, {\n \"title\": \"MV*\",\n \"links\": [{\n \"name\": \"Backbone.js\",\n \"url\": \"http://backbonejs.org\",\n \"description\": \"Very popular JavaScript client-side framework, built by @jashkenas.\"\n }, {\n \"name\": \"Ember.js\",\n \"url\": \"http://emberjs.com\",\n \"description\": \"Built by @wycats, jQuery and Ruby on Rails core developer.\"\n }, {\n \"name\": \"Knockout.js\",\n \"url\": \"http://knockoutjs.com\",\n \"description\": \"Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\"\n }, {\n \"name\": \"Angular.js\",\n \"url\": \"http://angularjs.org\",\n \"description\": \"Built by Google, Angular.js is like a polyfill for the future of HTML.\"\n }, {\n \"name\": \"Angular\",\n \"url\": \"https://angular.io\",\n \"description\": \"One framework.Mobile & desktop. One way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.\"\n }, {\n \"name\": \"Cappuccino\",\n \"url\": \"http://www.cappuccino-project.org\",\n \"description\": \"Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\"\n }, {\n \"name\": \"JavaScript MVC\",\n \"url\": \"http://javascriptmvc.com/\",\n \"description\": \"JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\"\n }, {\n \"name\": \"Meteor\",\n \"url\": \"https://www.meteor.com\",\n \"description\": \"Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\"\n }, {\n \"name\": \"Spice.js\",\n \"url\": \"http://spicejs.github.io/spicejs/\",\n \"description\": \"Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\"\n }, {\n \"name\": \"Riot.js\",\n \"url\": \"http://www.riotjs.com/\",\n \"description\": \"Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\"\n }, {\n \"name\": \"CanJS\",\n \"url\": \"http://canjs.com\",\n \"description\": \"CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\"\n }]\n }, {\n \"title\": \"مكتبة\",\n \"links\": [{\n \"name\": \"React\",\n \"url\": \"http://facebook.github.io/react\",\n \"description\": \"Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\"\n }, {\n \"name\": \"Vue.js\",\n \"url\": \"http://www.vuejs.org\",\n \"description\": \"Is an MVVM library providing two-way data binding, HTML extended behaviour (through directives) and reactive components. By using native add-ons a developer can also have routing, AJAX, a Flux-like state management, form validation and more. Provides a helpful Chrome extension to inspect components built with Vue.\"\n }, {\n \"name\": \"Handlebars\",\n \"url\": \"http://handlebarsjs.com\",\n \"description\": \"Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\"\n }, {\n \"name\": \"Dust.js\",\n \"url\": \"http://linkedin.github.io/dustjs\",\n \"description\": \"Asynchronous templates for the browser and node.js.\"\n }]\n }, {\n \"title\": \"حيوية\",\n \"links\": [{\n \"name\": \"GSAP\",\n \"url\": \"http://greensock.com/\",\n \"description\": \"GSAP is the fastest full-featured scripted animation tool on the planet. It's even faster than CSS3 animations and transitions in many cases.\"\n }, {\n \"name\": \"Velocity.js\",\n \"url\": \"http://julian.com/research/velocity/\",\n \"description\": \"Velocity is an animation engine with the same API as jQuery's $.animate().\"\n }, {\n \"name\": \"Bounce.js\",\n \"url\": \"http://bouncejs.com/\",\n \"description\": \"Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.\"\n }, {\n \"name\": \"TweenJS\",\n \"url\": \"http://www.createjs.com/tweenjs\",\n \"description\": \"A simple but powerful JavaScript library for tweening and animating HTML5 and JavaScript properties.\"\n }, {\n \"name\": \"Move.js\",\n \"url\": \"http://visionmedia.github.io/move.js/\",\n \"description\": \"Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.\"\n }, {\n \"name\": \"Snap.svg\",\n \"url\": \"http://snapsvg.io/\",\n \"description\": \"SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen.\"\n }, {\n \"name\": \"Rekapi\",\n \"url\": \"http://rekapi.com/\",\n \"description\": \"Rekapi is a library for making canvas and DOM animations with JavaScript, as well as CSS @keyframe animations for modern browsers.\"\n }, {\n \"name\": \"Favico.js\",\n \"url\": \"http://lab.ejci.net/favico.js/\",\n \"description\": \"Make use of your favicon with badges, images or videos.\"\n }, {\n \"name\": \"Textillate.js\",\n \"url\": \"http://jschr.github.io/textillate/\",\n \"description\": \"Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.\"\n }, {\n \"name\": \"Motio\",\n \"url\": \"http://darsa.in/motio/\",\n \"description\": \"Motio is a small JavaScript library for simple but powerful sprite based animations and panning.\"\n }\n ]\n }]\n },\n \"gameEngines\": {\n \"title\": \"محركات الألعاب\",\n \"links\": [{\n \"name\": \"MelonJS\",\n \"url\": \"http://melonJS.org\",\n \"description\": \"MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\"\n }, {\n \"name\": \"ImpactJS\",\n \"url\": \"http://impactjs.com\",\n \"description\": \"ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\"\n }, {\n \"name\": \"LimeJS\",\n \"url\": \"http://limejs.com\",\n \"description\": \"LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\"\n }, {\n \"name\": \"Crafty\",\n \"url\": \"http://craftyjs.com\",\n \"description\": \"Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\"\n }, {\n \"name\": \"Cocos2d-HTML5\",\n \"url\": \"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\": \"Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\"\n }, {\n \"name\": \"Phaser\",\n \"url\": \"http://phaser.io\",\n \"description\": \"Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\"\n }, {\n \"name\": \"Goo\",\n \"url\": \"http://www.goocreate.com/learn\",\n \"description\": \"Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\"\n }, {\n \"name\": \"LycheeJS\",\n \"url\": \"http://lycheejs.org\",\n \"description\": \"LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\"\n }, {\n \"name\": \"Quintus\",\n \"url\": \"http://html5quintus.com\",\n \"description\": \"Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\"\n }, {\n \"name\": \"KiwiJS\",\n \"url\": \"http://www.kiwijs.org\",\n \"description\": \"Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\"\n }, {\n \"name\": \"PandaJS\",\n \"url\": \"http://www.pandajs.net\",\n \"description\": \"Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\"\n }, {\n \"name\": \"Rot.js\",\n \"url\": \"https://github.com/ondras/rot.js\",\n \"description\": \"Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\"\n }, {\n \"name\": \"Isogenic\",\n \"url\": \"http://www.isogenicengine.com/\",\n \"description\": \"Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \"\n }, {\n \"name\": \"WhitestormJS\",\n \"url\": \"https://github.com/WhitestormJS/whitestorm.js\",\n \"description\": \"Super-fast 3D framework for Web Applications & Games. Based on Three.js. Includes integrated physics support and ReactJS integration.\"\n }]\n },\n \"news\": {\n \"title\": \"أخبار\",\n \"cat\": [{\n \"title\": \"مواقع\",\n \"links\": [{\n \"name\": \"JavaScript.com\",\n \"url\": \"http://javascript.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Echo JS\",\n \"url\": \"http://www.echojs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"The Treehouse Show\",\n \"url\": \"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\": \"\"\n }, {\n \"name\": \"/r/javascript on Reddit\",\n \"url\": \"http://www.reddit.com/r/javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Open Web Platform Daily Digest\",\n \"url\": \"http://webplatformdaily.org\",\n \"description\": \"\"\n }, {\n \"name\": \"Badass JavaScript\",\n \"url\": \"http://badassjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"AngularJS Daily\",\n \"url\": \"http://paper.li/gwinnem/1390553142\",\n \"description\": \"\"\n }]\n }, {\n \"title\": \"قائمة بريدية\",\n \"links\": [{\n \"name\": \"JavaScript Weekly\",\n \"url\": \"http://javascriptweekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"A Drip of JavaScript\",\n \"url\": \"http://designpepper.com/a-drip-of-javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Ember Weekly\",\n \"url\": \"http://emberweekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Node Weekly\",\n \"url\": \"http://nodeweekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Meteor Weekly\",\n \"url\": \"http://meteorhacks.com/meteor-weekly\",\n \"description\": \"\"\n }, {\n \"name\": \"Grunt Weekly\",\n \"url\": \"https://twitter.com/gruntweekly\",\n \"description\": \"\"\n }, {\n \"name\": \"Gamedev.js Weekly\",\n \"url\": \"http://weekly.gamedevjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"HTML5 Weekly\",\n \"url\": \"http://html5weekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"UDGWebDev Weekly\",\n \"url\": \"http://udgwebdev.com/newsletter\",\n \"description\": \"\"\n }, {\n \"name\": \"The React Newsletter\",\n \"url\": \"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\": \"\"\n }]\n }]\n },\n \"reading\": {\n \"title\": \"قراءة\",\n \"cat\": [{\n \"title\": \"مقالات\",\n \"credit\": true,\n \"box\": false,\n \"links\": [{\n \"name\": \"Understanding JavaScript OOP\",\n \"url\": \"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\": \"by Quildreen Motta\"\n }, {\n \"name\": \"Understanding “Prototypes” in JavaScript\",\n \"url\": \"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\": \"by Yehuda Katz\"\n }, {\n \"name\": \"Prototypes and Inheritance in JavaScript\",\n \"url\": \"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\": \"by Scott Allen\"\n }, {\n \"name\": \"Partial Application in JavaScript\",\n \"url\": \"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\": \"by Ben Alman\"\n }, {\n \"name\": \"Getting Over jQuery\",\n \"url\": \"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\": \"by Nico Bevacqua\"\n }, {\n \"name\": \"A Dive Into Plain JavaScript\",\n \"url\": \"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\": \"by Viljami S.\"\n }, {\n \"name\": \"A Deeper Look at Objects in JavaScript\",\n \"url\": \"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\": \"by Kirupa Chinnathambi\"\n }, {\n \"name\": \"Introduction to Easing in JavaScript\",\n \"url\": \"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\": \"by Kirupa Chinnathambi\"\n }, {\n \"name\": \"How to Learn JavaScript Properly\",\n \"url\": \"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\": \"by JavaScript Is Sexy\"\n }, {\n \"name\": \"How to Start with JavaScript\",\n \"url\": \"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\": \"by Ju Gonçalves\"\n }]\n }, {\n \"title\": \"كتب\",\n \"credit\": true,\n \"box\": false,\n \"links\": [{\n \"name\": \"Eloquent JavaScript\",\n \"url\": \"http://eloquentjavascript.net\",\n \"description\": \"by Marijn Haverbeke\"\n }, {\n \"name\": \"JavaScript: The Definitive Guide\",\n \"url\": \"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\": \"by David Flanagan\"\n }, {\n \"name\": \"JavaScript: The Good Parts\",\n \"url\": \"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\": \"by Douglas Crockford\"\n }, {\n \"name\": \"JavaScript Patterns\",\n \"url\": \"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\": \"by Stoyan Stefanov\"\n }, {\n \"name\": \"JavaScript Testing Recipes\",\n \"url\": \"http://jstesting.jcoglan.com\",\n \"description\": \"by James Coglan\"\n }, {\n \"name\": \"Professional JavaScript for Web Developers\",\n \"url\": \"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\": \"by Nicholas C. Zakas\"\n }, {\n \"name\": \"High Performance JavaScript\",\n \"url\": \"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\": \"by Nicholas C. Zakas\"\n }, {\n \"name\": \"Human JavaScript\",\n \"url\": \"http://humanjavascript.com\",\n \"description\": \"by Henrik Joreteg\"\n }, {\n \"name\": \"Object Oriented JavaScript\",\n \"url\": \"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\": \"by Stoyan Stefanov\"\n }, {\n \"name\": \"Pro JavaScript Design Patterns\",\n \"url\": \"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\": \"by Dustin Diaz\"\n }, {\n \"name\": \"Learning JavaScript Design Patterns\",\n \"url\": \"https://addyosmani.com/resources/essentialjsdesignpatterns/book/\",\n \"description\": \"by Addy Osmani\"\n }, {\n \"name\": \"Secrets of the JavaScript Ninja\",\n \"url\": \"http://jsninja.com\",\n \"description\": \"by John Resig\"\n }, {\n \"name\": \"JavaScript Application Design\",\n \"url\": \"http://bevacqua.io/bf\",\n \"description\": \"by Nicolas Bevacqua\"\n }, {\n \"name\": \"Speaking JavaScript\",\n \"url\": \"http://speakingjs.com\",\n \"description\": \"by Axel Rauschmayer\"\n }, {\n \"name\": \"Test-Driven JavaScript Development\",\n \"url\": \"http://tddjs.com\",\n \"description\": \"by Christian Johansen\"\n }, {\n \"name\": \"You Don't Know JS\",\n \"url\": \"https://github.com/getify/You-Dont-Know-JS\",\n \"description\": \"by Kyle Simpson\"\n }, {\n \"name\": \"You Might Not Need jQuery\",\n \"url\": \"http://youmightnotneedjquery.com\",\n \"description\": \"by Ryan Burgess\"\n }, {\n \"name\": \"JavaScript Garden\",\n \"url\": \"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\": \"by Ivo Wetzel\"\n }, {\n \"name\": \"Effective JavaScript\",\n \"url\": \"http://effectivejs.com\",\n \"description\": \"by David Herman\"\n }, {\n \"name\": \"JavaScript Allongé\",\n \"url\": \"https://leanpub.com/javascriptallongesix\",\n \"description\": \"by Reginald Braithwaite\"\n }, {\n \"name\": \"Exploring ES6\",\n \"url\": \"http://exploringjs.com/es6/\",\n \"description\": \"by Axel Rauschmayer\"\n }, {\n \"name\": \"JSBooks\",\n \"url\": \"http://jsbooks.revolunet.com\",\n \"description\": \"by DevFreeBooks\"\n }]\n }, {\n \"title\": \"كتب رقمية مجانية\",\n \"credit\": false,\n \"box\": true,\n \"links\": [{\n \"name\": \"JSBooks\",\n \"url\": \"http://jsbooks.revolunet.com\",\n \"description\": \"\"\n }, {\n \"name\": \"DevFreeBooks\",\n \"url\": \"http://devfreebooks.org\",\n \"description\": \"\"\n }]\n }, {\n \"title\": \"بوابات\",\n \"credit\": false,\n \"box\": true,\n \"links\": [{\n \"name\": \"JavaScript.com\",\n \"url\": \"https://www.javascript.com\",\n \"description\": \"\"\n }, {\n \"name\": \"HTML5 Rocks\",\n \"url\": \"http://www.html5rocks.com\",\n \"description\": \"\"\n }, {\n \"name\": \"W3Fools\",\n \"url\": \"http://www.w3fools.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Mozilla Developer Network\",\n \"url\": \"http://developer.mozilla.org/docs/JavaScript\",\n \"description\": \"\"\n }, {\n \"name\": \"Web Platform\",\n \"url\": \"http://docs.webplatform.org/wiki/javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Smashing Magazine\",\n \"url\": \"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Node School\",\n \"url\": \"http://nodeschool.io\",\n \"description\": \"\"\n }, {\n \"name\": \"How to Node\",\n \"url\": \"http://howtonode.org\",\n \"description\": \"\"\n }, {\n \"name\": \"Felix’s Node.js Beginners Guide\",\n \"url\": \"http://nodeguide.com/beginner.html\",\n \"description\": \"\"\n }]\n }]\n },\n \"podcasts\": {\n \"title\": \"مدونات صوتية (برودكاست)\",\n \"links\": [{\n \"name\": \"JavaScript Jabber\",\n \"url\": \"https://devchat.tv/js-jabber/\",\n \"description\": \"\"\n }, {\n \"name\": \"Node Up\",\n \"url\": \"http://nodeup.com\",\n \"description\": \"\"\n }, {\n \"name\": \"5 Minutes of JavaScript\",\n \"url\": \"https://fivejs.codeschool.com\",\n \"description\": \"\"\n }, {\n \"name\": \"The Meteor Podcast\",\n \"url\": \"http://www.meteorpodcast.com\",\n \"description\": \"\"\n }, {\n \"name\": \"JSConf\",\n \"url\": \"https://www.youtube.com/user/jsconfeu\",\n \"description\": \"\"\n }, {\n \"name\": \"JavaScript Air\",\n \"url\": \"http://javascriptair.com/\",\n \"description\": \"\"\n }]\n },\n \"screencasts\": {\n \"title\": \"دروس فيديو\",\n \"links\": [{\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },{\n \"name\": \"Egghead\",\n \"img\": \"egghead.svg\",\n \"url\": \"https://egghead.io\",\n \"description\": \"\"\n }, {\n \"name\": \"DevFreeCasts\",\n \"img\": \"devfreecasts.png\",\n \"url\": \"http://devfreecasts.org\",\n \"description\": \"\"\n }, {\n \"name\": \"tagtree.tv\",\n \"img\": \"tagtree.png\",\n \"url\": \"https://tagtree.tv/\",\n \"description\": \"\"\n }, {\n \"name\": \"frontndmasters.com\",\n \"img\": \"frontendmasters.svg\",\n \"url\": \"http://frontendmasters.com\",\n \"description\": \"\"\n }]\n },\n \"whoToFollow\": {\n \"title\": \"من تتابع\"\n },\n \"paasProviders\": {\n \"title\": \"مزودو «منصة حَوسَبة لخدمات البَرمَجة»\",\n \"links\": [{\n \"name\": \"Heroku\",\n \"url\": \"http://heroku.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Modulus\",\n \"url\": \"https://modulus.io\",\n \"description\": \"\"\n }, {\n \"name\": \"Nodejitsu\",\n \"url\": \"http://nodejitsu.com\",\n \"description\": \"\"\n }, {\n \"name\": \"OpenShift\",\n \"url\": \"https://www.openshift.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Getup\",\n \"url\": \"http://getupcloud.com/en/\",\n \"description\": \"\"\n }, {\n \"name\": \"Windows Azure\",\n \"url\": \"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\": \"\"\n }]\n },\n \"helpers\": {\n \"title\": \"مساعدون\",\n \"links\": [{\n \"name\": \"npm\",\n \"img\": \"npm.png\",\n \"url\": \"https://npmjs.org\",\n \"description\": \"\"\n }, {\n \"name\": \"bower\",\n \"img\": \"bower-logo.png\",\n \"url\": \"http://bower.io\",\n \"description\": \"\"\n }, {\n \"name\": \"yeoman\",\n \"img\": \"yeoman-logo.png\",\n \"url\": \"http://yeoman.io\",\n \"description\": \"\"\n }, {\n \"name\": \"grunt\",\n \"img\": \"grunt-logo.png\",\n \"url\": \"http://gruntjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"gulp\",\n \"img\": \"gulp.png\",\n \"url\": \"http://gulpjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"brunch\",\n \"img\": \"brunch-logo.png\",\n \"url\": \"http://brunch.io\",\n \"description\": \"\"\n }, {\n \"name\": \"Browser compilation library\",\n \"img\": \"broccoli-logo.png\",\n \"url\": \"https://github.com/broccolijs/broccoli\",\n \"description\": \"\"\n }, {\n \"name\": \"Webpack\",\n \"img\": \"webpack-logo.png\",\n \"url\": \"https://webpack.github.io/\",\n \"description\": \"\"\n }, {\n \"name\": \"Rollup\",\n \"img\": \"rollup-logo.png\",\n \"url\": \"http://rollupjs.org/\",\n \"description\": \"\"\n }, {\n \"name\": \"Browserify\",\n \"img\": \"browserify-logo.png\",\n \"url\": \"http://browserify.org/\",\n \"description\": \"\"\n }, {\n \"name\": \"todo mvc\",\n \"img\": \"todomvc-logo.png\",\n \"url\": \"http://todomvc.com\",\n \"description\": \"\"\n }]\n },\n \"footer\": {\n \"credit\": \"إنشاء وصيانة\",\n \"contributors\": \"مساهمون\",\n \"contribDesc\": \"هذا المشروع لم يكن موجودا لولا هؤلاء المساهمون الرائعون. شكرا لكم لجعل هذا حقيقيا!\",\n \"licence\": \"{{@link=partials/licence.html}}\"\n },\n \"languages\": [{\n \"url\": \"pt-br\",\n \"name\": \"Português\"\n }, {\n \"url\": \"ko-kr\",\n \"name\": \"한국어\"\n }, {\n \"url\": \"es-es\",\n \"name\": \"Español\"\n }, {\n \"url\": \"de-de\",\n \"name\": \"German\"\n }, {\n \"url\": \"en-us\",\n \"name\": \"English\"\n }, {\n \"url\": \"zh-tw\",\n \"name\": \"繁體中文\"\n }, {\n \"url\": \"zh-cn\",\n \"name\": \"简体中文\"\n }, {\n \"url\": \"fa-ir\",\n \"name\": \"فارسی\"\n }, {\n \"url\": \"ru-ru\",\n \"name\": \"Русский\"\n }, {\n \"url\": \"ar-ar\",\n \"name\": \"العربية\"\n }]\n}\n" }, { "path": "i18n/ar-ar/partials/code-style.html", "content": "

اصطلاحات

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

التضميد

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n" }, { "path": "i18n/ar-ar/partials/getting-started.html", "content": "

عن

\n\n

\n أُنشِئت من طرف ناتسكوب في سنة 1995 بصفتها ملحقا للـHTML من أجل متصفح ناتسكوب 2.0، كان لجافاسكريبت وظيفة رئيسة هي معالجة ملفات HTML والتَّحقق من النماذج.\n\n قبل اكتساب هذا الاسم المشهور جدا هذه الأيام، كانت جافاسكريبت تسمى موشا. عندما شحنت لأول مرة إصدارات بيتا، كانت تسمى رسميا لايفسكريبت، وأخيرا، عندما تم إصدارها من طرف Sun Microsystems، كانت قد صبغت بالاسم الذي تُعرف به اليوم.\n\n بسبب التشابه في الاسماء، خلط الناس جافاسكريبت بجافا. مع أن كليهما لديه بنية معجمية للبرمجة، فإنهما ليسا نفس اللغة.\n\n مختلفة عن C، C# وجافا، جافاسكريبت هي لغة مُفَسّرة (interpreted language). هذا يعني أنها تحتاج «مفسّرا» (interpreter). في حالة جافاسكريبت، المُفسِّر هو المتصفِّح.\n

\n\n

النسخة الحالية

\n\n

\n معيار جافاسكريبت هي إيكماسكريبت (ECMAScript). اعتبارا من 2012، كل المتصفحات الحديثة تدعم بشكل كامل إيكماسكريبت 5.1. المتصفحات القديمة تدعم على الأقل إيكماسكريبت 3. اعتبارا من 2015 تمت الموافقة على مواصفات ES6/ES2015. بعد دورة الإصدار الجديدة، تم اعتماد ES7/ES2016 في شهر يونيو/حزيران (جوان أو الشهر السادس من شهور السنة الشمسية) 2016. ألق نظرة على مواصفة لغة إيكماسكريبت 2016 على Ecma International.\n

\n\n

\n A good reference to versions, references and news about JavaScript can be found at the Mozilla Developer Network.\n

\n\n

الـDOM

\n\n

\n The Document Object Model (DOM) is an API for HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript. See more at Mozilla Developer Network - DOM.\n

\n" }, { "path": "i18n/ar-ar/partials/good-parts.html", "content": "

كائنية التوجه

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

الدوال المجهولة

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

المجال والرفع

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

رابط الدالة

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

دالة الإغلاق

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\nIt is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n

الوضع الصارم

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

دالة التعبير المستدعاة على الفور

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/ar-ar/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n جافاسكريبت: الطريقة الصحيحة\n من قبل William Oliveira.\n
مرخص من طرف Creative Commons Attribution-NonCommercial 4.0 International License.\n
مرتكز على عمل فيhttp://jstherightway.org.\n

\n" }, { "path": "i18n/ar-ar/partials/patterns.html", "content": "

وصف

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

أنماط التصميم

\n\n
\n \n
\n\n

\n أنماط التصميم التكوينية\n

\n\n
\n \n
\n\n

\n أنماط التصميم الهيكلية\n

\n\n
\n \n
\n\n

\n أنماط التصميم السلوكية\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n" }, { "path": "i18n/ar-ar/partials/testing-tools.html", "content": "

وصف

\n\n

.هناك العديد من المكتبات وأطر العمل لعمل الاختبارات في جافاسكريبت

\n" }, { "path": "i18n/ar-ar/partials/welcome.html", "content": "

هاي، أنت!

\n\n

\n هذا دليل يهدف إلى تعريف المطورين الجدد بجافاسكريبت ومساعدة المطورين ذوي الخبرة في تعلم مزيد من ممارساتها المستحسنة.\n

\n\n

\n بالرغم من الاسم، هذا الدليل على يعني لزوما «الطريقة الوحيدة» للعمل بجافاسكريبت.\n

\n\n

\n لقد قمنا فقط بتجميع المقالات، نصائح، والخدع من المطورين ووضعها هنا. بما أنها أشخاص استثنائيين، يمكننا القول أنها «الطريقة الصحيحة»، أو أفضل طريق للعمل.\n

\n" }, { "path": "i18n/de-de/de-de.json", "content": "{\n \"meta\": {\n \"title\":\"JS: Der richtige Weg\",\n \"description\":\"Eine kurze Übersicht an Best-Practices für das Programmieren mit JavaScript -- Links zu Entwurfsmustern und Tutorials aus dem Web\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"Wähle deinen Weg\",\n \"links\": [\n {\n \"title\":\"Erste Schritte\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"JavaScript Code-Style\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"Die Vorteile\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"Entwurfsmuster\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"Testwerkzeuge\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"Frameworks\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"Spiele-Engines\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"Neuigkeiten\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"Literatur\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"Podcasts\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"Screencasts\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"Wem ist zu folgen\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"PaaS-Anbieter\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"Helferlein\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"ERSTE SCHRITTE\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"JS CODE-STYLE\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"DIE VORTEILE\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"ENTWURFSMUSTER\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"TESTWERKZEUGE\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"wird gewartet von TJ Holowaychuk\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"wird gewartet von jQuery\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"wird gewartet von Pivotal Labs\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"wird gewartet von dem Team hinter AngularJS. Am meisten durch Vojta Jina\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"wird gewartet von Sitepen\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"Ein JavaScript Code-Coverage-Tool, geschrieben in JavaScript. Wird gewartet von Krishnan Anantheswaran\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"Eigenständige Test-Spies, Stubs und Mocks für JavaScript. Keine Abhängigkeiten, funktioniert mit beliebigen Unit-Test-Frameworks. Erstellt von der Sinon.JS Community\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"Ein Test-Helferlein, um Mocks von Funktionen und dem XHR-Objekt zu erstellen, gewartet von Leo Balter\"\n },\n {\n \"name\":\"AVA\",\n \"url\":\"https://github.com/sindresorhus/ava\",\n \"description\":\"Test Runner mit asynchronen Tests, gewartet von Sindre Sorhus\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"FRAMEWORKS\",\n \"cat\":[\n {\n \"title\":\"ALLGEMEINER ZWECK\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery ist eine schnelle, kleine und featurereiche JavaScript-Bibliothek. Erstellt von John Resig.\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"Erstellt von Yahoo!, YUI ist eine freie, quelloffene JavaScript- und CSS-Bibliothek für die Erstellung von interaktiven Webanwendungen. Die Weiterentwicklung wurde seit dem 29. August 2014 gestoppt..\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto ist eine minimalistische Javascript-Bibliothek für moderne Browser mit einer weitestgehend jQuery-kompatiblen API. Wenn du bereits jQuery verwendest, weißt du bereits, wie man Zepto benutzt.\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo ist ein freies, quelloffenes JavaScript-Toolkit zum Erstellen von hochperformanten Webanwendungen. Projektsponsoren umfassen unter anderem IBM und SitePen.\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js ist eine JavaScript-Bibliothek, die unterschiedlichste hilfreiche und funktionale Programmhelferlein bietet, ohne die eingebauten Objekte zu verändern.\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"Sehr beliebtes clientseitiges JavaScript-Framework, erstellt von @jashkenas.\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"Erstellt von @wycats, jQuery und den Ruby on Rails-Hauptentwicklern.\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"Vereinfacht dynamische JavaScript-UIs, indem es dem Model-View-View Model (MVVM)-Schema folgt.\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"Erstellt von Google, Angular.js ist eine Art Polyfill für die Zukunft von HTML.\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"Ein framework.Mobile & desktop. Eine Möglichkeit, Anwendungen mit Angular zu erstellen und Ihren Code und Fähigkeiten zu verwenden, um Anwendungen für jedes Deployment-Ziel zu erstellen. Für Web, mobiles Web, native mobile und native Desktop.\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino ist ein quelloffenes Framework, welches die Erstellung von Desktop-Caliber-Anwendungen, die im Webbrowser laufen, vereinfacht.\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC ist ein quelloffenes Framework, welches die besten Ideen aus der jQuery-Entwicklung beinhaltet.\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor ist eine quelloffene Plattform zum Erstellen von qualitativ hochwertigen Web-Apps in kürzester Zeit, egal ob du ein erfahrerener Entwickler bist oder gerade erst angefangen hast.\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://spicejs.github.io/spicejs/\",\n \"description\":\"Spice ist ein extrem minimales (< 3k) und flexibles MVC-Framework für JavaScript. Spice kann leicht in bestehende Anwendungen integriert werden und arbeitet gut mit anderen Technologien wie jQuery, pjax, turbolinks, node oder womit auch immer du arbeitest, zusammen\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot ist eine unglaublich schnelle, mächtige und zugleich kleine clientseitige (MV*) Bibliothek zum Erstellen von umfangreichen Webanwendungen. Trotz der kleinen Größe sind alle wichtigen Bausteine vorhanden: eine Template-Engine, ein Router, eine Event-Bibliothek und ein striktes MVP-Muster, um Dinge organisiert zu halten.\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS ist ein JavaScript-Framework, welches die Entwicklung von komplexen Anwendungen einfach und schnell macht. Einfach zu erlernen, klein und eine flexible Anwendungsstruktur, dazu moderne Features wie Custom Tags und Two-Way-Binding.\"\n }\n ]\n },\n {\n \"title\":\"Bibliotheken\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"Erstellt von Facebook. React ist eine JavaScript-Bibliothek zum Erstellen von User Interfaces von Facebook und Instagram. React wird von vielen als das V in MVC angesehen.\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars bietet die Mächtigkeit, semantische Templates effektiv ohne Frust zu erstellen.\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"Asynchrone Templates für den Browser und node.js.\"\n }\n ]\n },\n {\n \"title\":\"Animation\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity ist eine Animations-Engine mit derselben API wie jQuerys $.animate().\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js ist ein Werkzeug und eine JS-Bibliothek, mit dem man schöne CSS3 getriebene Animationen erstellen kann.\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"Eine einfache aber mächtige JavaScript-Bibliothek für das Animieren und Tweenen von HTML5- und JavaScript-Objekten.\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js ist eine kleine JavaScript-Bibliothek, die das Erstellen von CSS3 getriebenen Animationen extrem einfach und elegant macht.\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG ist ein ausgezeichneter Weg, um interaktive, auflösungsunabhängige Vektorgrafiken zu erstellen, die auf allen Bildschirmgrößen gut aussehen.\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi ist eine Bibliothek zum Erstellen sowohl von Canvas- und DOM-Animationen mit JavaScript als auch von CSS @keyframe-Animationen für moderne Browser.\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"Mach Gebrauch von deinem Favicon mit Badges, Bildern oder Videos.\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js kombiniert einige geniale Bibliotheken, um ein einfach zu verwendendes Plugin zum Zuweisen von CSS3-Animationen zu jeglichen Texten zur Verfügung zu stellen.\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio ist eine kleine JavaScript-Bibliothek für einfache aber umfangreiche auf Sprites basierende Animationen und Panning.\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"SPIELE-ENGINES\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS ist eine freie, leichtgewichtige HTML5 Spiele-Engine. Die Engine verwendet ein tiled Map-Format, welches das Leveldesign vereinfacht.\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS ist eine der eher länger bewährten HTML5 Spiele-Engines, deren erste Veröffentlichung bis Ende 2010 zurückreicht. Sie wird sehr gut gewartet und regelgemäßig geupdatet und hat eine große Community, die sie unterstützt. Es existieren sowohl umfangreiche Dokumentationen als auch zwei Bücher zum Thema Spieleentwicklung mit dieser Engine.\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS ist ein HTML5 Spiele-Framework zum Erstellen von schnellen, native-experience Spielen für alle modernen Touchscreens und Desktop-Browser.\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty ist eine Spiele-Engine, welche von Ende 2010 stammt. Crafty ermöglicht einen einfachen Einstieg in das Erstellen von JavaScript-Spielen.\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-HTML5 ist ein quelloffenes 2D Web-Spiele-Framework, veröffentlicht unter der MIT Lizenz. Es ist eine HTML5-Version von dem Cocos2d-x Projekt. Das Ziel der Cocos2d-HTML5- Entwicklung ist, Cocos2d plattformunabhängig von Browsern und nativen Anwendungen zu machen.\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser basiert stark auf Flixel. Es wird gewartet von Richard Davey (Photon Storm), der in der HTML5-Community bereits seit Jahren sehr aktiv ist.\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo ist eine 3D JavaScript-Spiele-Engine, die komplett auf WebGL/HTML5 aufbaut.\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS ist eine JavaScript-Spiele-Bibliothek, die eine Komplettlösung für das Prototyping und die Entwicklung von HTML5 Canvas, WebGL oder nativen OpenGL(ES) basierten Spielen innerhalb des Browsers oder einer nativen Umgebung bietet.\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus ist eine HTML5-Spiele-Engine, die einen modularen und leichtgewichtigen Ansatz mit einer prägnanten JavaScript-freundlichen Syntax verfolgt.\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js ist eine lustige und freundliche quelloffene HTML5-Spiele-Engine. Manche bezeichnen es als WordPress der HTMl5-Spiele-Engines.\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js ist eine HTML5-Spiele-Engine mit Canvas und WebGL-Rendering für mobile Endgeräte und für den Desktop.\"\n },\n {\n \"name\":\"Rot.js\",\n \"url\":\"https://github.com/ondras/rot.js\",\n \"description\":\"Rot.js ist eine Sammlung von JavaScript Bibliotheken, die einen bei der Rogue-like Entwicklung in der Browserumgebung unterstützen soll.\"\n }\n ]\n },\n \"news\":{\n \"title\":\"Neuigkeiten\",\n \"cat\":[\n {\n \"title\":\"Webseiten\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Newsletter\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"Literatur\",\n \"cat\":[\n {\n \"title\":\"Artikel\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Understanding JavaScript OOP\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"von Quildreen Motta\"\n },\n {\n \"name\":\"Understanding \\\"Prototypes\\\" in JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"von Yehuda Katz\"\n },\n {\n \"name\":\"Prototypes and Inheritance in JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"von Scott Allen\"\n },\n {\n \"name\":\"Partial Application in JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"von Ben Alman\"\n },\n {\n \"name\":\"Getting Over jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"von Nico Bevacqua\"\n },\n {\n \"name\":\"A Dive Into Plain JavaScript\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"von Viljami S.\"\n },\n {\n \"name\":\"A Deeper Look at Objects in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"von Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introduction to Easing in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"von Kirupa Chinnathambi\"\n },\n {\n \"name\":\"How to Learn JavaScript Properly\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"von JavaScript Is Sexy\"\n },\n {\n \"name\":\"How to Start with JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"von Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"Bücher\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Eloquent JavaScript\",\n \"url\":\"http://eloquentjavascript.net\",\n \"description\":\"von Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: The Definitive Guide\",\n \"url\":\"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\":\"von David Flanagan\"\n },\n {\n \"name\":\"JavaScript: The Good Parts\",\n \"url\":\"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\":\"von Douglas Crockford\"\n },\n {\n \"name\":\"JavaScript Patterns\",\n \"url\":\"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\":\"von Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"von James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"von Nicholas C. Zakas\"\n },\n {\n \"name\":\"High Performance JavaScript\",\n \"url\":\"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\":\"von Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"von Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"von Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"von Dustin Diaz\"\n },\n {\n \"name\":\"Learning JavaScript Design Patterns\",\n \"url\":\"https://addyosmani.com/resources/essentialjsdesignpatterns/book/\",\n \"description\":\"von Addy Osmani\"\n },\n {\n \"name\":\"Secrets of the JavaScript Ninja\",\n \"url\":\"http://jsninja.com\",\n \"description\":\"von John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"von Nicolas Bevacqua\"\n },\n {\n \"name\":\"Speaking JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"von Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"von Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"von >Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"von Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"von Ivo Wetzel\"\n },\n {\n \"name\":\"Effective JavaScript\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"von David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascript-allonge\",\n \"description\":\"von Reginald Braithwaite\"\n },\n {\n \"name\":\"Exploring ES6\",\n \"url\":\"http://exploringjs.com/es6/\",\n \"description\":\"von Axel Rauschmayer\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"von DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"Kostenlose E-Books\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Portale\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix's Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"Podcasts\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"http://javascriptjabber.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n },\n {\n \"name\":\"JavaScript Air\",\n \"url\":\"http://javascriptair.com/\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"Screencasts\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"Wem ist zu folgen\"\n },\n \"paasProviders\":{\n \"title\":\"PaaS-Anbieter\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com/en/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"Helferlein\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"Webpack\",\n \"img\":\"webpack-logo.png\",\n \"url\":\"https://webpack.github.io/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Rollup\",\n \"img\":\"rollup-logo.png\",\n \"url\":\"http://rollupjs.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browserify\",\n \"img\":\"browserify-logo.png\",\n \"url\":\"http://browserify.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"Erstellt und gewartet von\",\n \"contributors\":\"Mitwirkende\",\n \"contribDesc\":\"Dieses Projekt wäre ohne die Hilfe von diesen großartigen Personen nicht zustande gekommen. Vielen Dank, dass ihr es ermöglicht!\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n }\n}\n" }, { "path": "i18n/de-de/partials/code-style.html", "content": "

Richtlinien

\n\n

\n Auch JavaScript hat, so wie jede Programmiersprache, viele unterschiedliche Leitfäden für den Code-Style. Der womöglich am meisten verwendete und weiterempfohlene ist der Google Code-Style-Guide für JavaScript, aber wir empfehlen dir Idiomatic.js zu lesen.\n

\n\n

Code-Analyse (Linting)

\n\n

\n Mittlerweile hat sich als Tool für die Code-Analyse (Linting) von JavaScript-Code JSHint bewährt. Wir empfehlen euch, euren Code-Style und Entwurfsmuster durchgehend mit einem Lint-Tool zu überprüfen.\n

\n" }, { "path": "i18n/de-de/partials/getting-started.html", "content": "

ÜBER

\n\n

\n Erstellt von Netscape im Jahre 1995 als eine Erweiterung von HTML für den Netscape Navigator 2.0, waren die grundlegenden Funktionen von JavaScript die Manipulation von HTML-Dokumenten und die Formularvalidierung.\n\n Bevor der Name zu seinem heutigen Bekanntheitsgrad gelangt ist, wurde JavaScript früher Mocha genannt. Als zunächst Beta-Versionen davon erschienen sind, wurde es offiziell LiveScript gennant und schließlich, als es von Sun Microsystems veröffentlicht wurde, hat es den heutigen Namen angenommen.\n\n Wegen der ähnlichen Namen, wird JavaScript oft mit Java verwechselt. Obwohl beide die lexikalische Struktur einer Programmiersprache haben, handelt es nicht um dieselbe Programmiersprache.\n\n Anders als C, C# und Java, ist JavaScript eine interpretierte Programmiersprache. Sie braucht also einen \"Interpreter\". Im Fall von JavaScript, ist der Browser der Interpreter.\n

\n\n

AKTUELLE VERSION

\n\n

\n Der JavaScript-Standard ist ECMAScript. Nach dem Stand von 2012 unterstützen alle modernen Browser ECMAScript 5.1 vollständig. Ältere Browser unterstützen zumindest ECMAScript 3. Nach dem Stand vom Juni 2015 wurde die Spezifikation für ES6/ES2015 verabschiedet. Die ECMAScript 2015 Spezifikation ist verfügbar auf Ecma International.\n

\n\n

\n Eine gute Sammlung für Versionen, Referenzen und Neuigkeiten über JavaScript findet man im Mozilla Developer Network.\n

\n\n

DAS DOM

\n\n

\n Das Document Object Model (DOM) ist eine API für HTML- und XML-Dokumente. Es liefert eine strukturelle Representation des Dokuments. Damit ist es möglich, den Inhalt und die visuelle Präsentation des Dokuments mit einer Skriptsprache wie JavaScript zu verändern. Erfahre mehr unter Mozilla Developer Network - DOM.\n

\n" }, { "path": "i18n/de-de/partials/good-parts.html", "content": "

Objektorientiert

\n\n

\n JavaScript hat große Möglichkeiten für objektorientierte Programmierung auch wenn es einige Diskussionen bezüglich der Unterschiede von objektorientierten JavaScript zu anderen Programmiersprachen gegeben hat.\n

\n\n

\n Quelle: Einführung in objektorientiertes JavaScript\n

\n\n

Anonyme Funktionen

\n\n

\n Anonyme Funktionen sind Funktionen, die dynamisch zur Laufzeit deklariert werden. Sie werden anonyme Funktionen genannt, weil ihnen im Gegensatz zu normalen Funktionen kein Name vergeben wird.\n

\n\n

\n Quelle: JavaScript anonymous functions\n

\n\n

Funktionen als First-Class-Objekte

\n\n

\n Funktionen sind in JavaScript First-Class-Objekte. Das bedeutet, dass JavaScript-Funktionen einfach nur ein spezieller Typ von Objekten sind, die wie normale Objekte behandelt werden.\n

\n\n

\n Quelle: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n Viele Frontend-Entwickler haben ihre erste Erfahrung mit einer Skript- und/oder interpretierten Sprache mit JavaScript gemacht. Für jene Entwickler mag das Konzept und die Folgen von Variablen mit \"loose typing\" eher zweiter Natur sein. Jedoch hat der rasant steigende Bedarf nach modernen Webapplikationen zur Folge, dass viele Backend-Entwickler in clientseitige Technologien eintauchen. Viele von ihnen kommen aus einem Bereich, in dem Sprachen mit \"strong typing\" wie z.B. C# oder Java verbreitet sind und sind daher nicht vertraut mit der Freiheit und zugleich den möglichen Fallstricken, die das Arbeiten mit \"loose typing\" mit sich bringen.\n

\n\n

\n Quelle: Understanding Loose Typing in JavaScript\n

\n\n

Scoping und Hoisting

\n\n

\n Scoping: In JavaScript sind Funktionen unsere de facto Trennzeichen von Gültigkeitsbereichen (Scopes) für das Deklarieren von Variablen, was wiederum bedeutet, dass die üblichen Blöcke von Schleifen und Bedingungen (wie if, for, while, switch und try) keinen neuen Gültigkeitsbereich (Scope) erzeugen wie in vielen anderen Sprachen. Daher teilen sich diese Blöcke denselben Gültigkeitsbereich wie die Funktion, von der sie umgeben werden. Auf diese Weise kann es gefährlich sein, Variablen innerhalb von Blocks zu definieren, weil es so scheinen mag, als ob die Variable nur zu dem Block gehöre.\n

\n\n

\n Hoisting: Während der Laufzeit werden alle Variablen- und Funktionen-Deklarationen an den Beginn jeder Funktion (ihren Gültigkeitsbereich) gestellt - dieses Verfahren ist als \"Hoisting\" bekannt. Vor diesem Hintergrund ist es eine gute Praxis, Variablen allesamt in der ersten Zeile zu deklarieren, um falschen Erwartungen mit Variablen vorzubeugen, die später deklariert wurden, aber bereits vorher einen Wert beinhalten. Für viele Entwickler, die aus einer Sprache mit blockweisen Gültigkeitsbereichen kommen, ist dies ein häufiger Fallstrick.\n

\n\n

\n Quelle: JavaScript Scoping and Hoisting\n

\n\n

Bindung von Funktionen (Function binding)

\n\n

\n\n Die Bindung von Funktionen ist sehr wahrscheinlich das kleinste Problem beim Einstieg in JavaScript. Wenn man jedoch eine Lösung für das Problem sucht, wie man den Kontext vom Schlüsselwort this in einer anderen Funktion beibehält, dann wird man wahrscheinlich auf Function.prototype.bind() kommen.\n

\n\n

\n Quelle: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure-Funktionen

\n\n

\n Closures sind Funktionen, die auf unabhängige (freie) Variablen verweisen. In anderen Worten: Die Funktion, welche innerhalb einer Closure definiert wurde, merkt sich, in welcher Umgebung sie erstellt wurde.\nDies ist ein wichtiges Konzept, welches man verstehen sollte, weil es während der Entwicklung hilfreich sein kann, um bspw. private Methoden zu emulieren. Es kann ebenfalls dabei helfen, häufige Fehler zu vermeiden, wie bspw. Closures in Schleifen zu erstellen.\n

\n\n

\n Quelle: Closures (Funktionsabschlüsse)\n

\n\n

Strikter Modus

\n\n

\n ECMAScript 5's strikter Modus (Strict Mode) ist eine Möglichkeit, um eine etwas eingeschränktere Variante von JavaScript zu betreten. Der strikte Modus ist nicht einfach nur ein untergeordneter Modus: er hat absichtlich eine andere Semantik als normaler Code. Bei Browsern, die den strikten Modus nicht unterstützen, wird sich Code im strikten Modus anders verhalten als bei Browsern mit Unterstützung. Daher sollte man sich nicht auf den strikten Modus verlassen, ohne die relevanten Aspekte des Modus auf die Unterstützung der entsprechenden Features zu testen. Es kann auch neben Code für den strikten Modus zusätzlich noch Code für den nicht-strikten Modus existieren, damit Skripte bei Möglichkeit den strikten Modus verwenden können.\n

\n\n

\n Quelle: Strict Mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n Ein unmittelbar aufgerufener Funktionsausdruck (Immediately-Invoked Function Expression - IIFE) ist ein Muster, welches einen lexikalischen Gültigkeitsbereich mittels einer JavaScript-Funktion erzeugt. Diese Ausdrücke können dazu genutzt werden, das Hoisting von Variablen innerhalb eines Blocks zu verhindern, sich gegen das Zumüllen der globalen Umgebung zu schützen und zeitgleich öffentlichen Zugang zu Methoden zu schaffen, während die Variablen nur innerhalb ihrer Funktion aufgerufen werden können, also privat bleiben.

\n\n Dieses Muster wurde oft als selbstausführende anonyme Funktion (self-executing anonymous function) bezeichnet, jedoch hat @cowboy (Ben Alman) den Begriff IIFE als semantisch passenderen Begriff für das Muster eingeführt.\n

\n\n

\n Quelle: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/de-de/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: Der richtige Weg von William Oliveira.
Lizenziert unter einer Creative Commons Namensnennung - Nicht kommerziell 4.0 International Lizenz.
Basierend auf der Arbeit an http://jstherightway.org.\n

\n" }, { "path": "i18n/de-de/partials/patterns.html", "content": "\n

Beschreibung

\n\n

\n Während JavaScript einige exklusive Entwurfsmuster besitzt, können viele klassische Entwurfsmuster ebenfalls implementiert werden.\n

\n\n

\n Ein guter Weg, mehr darüber zu erfahren, ist Addy Osmani’s frei erhältliches Buch \"Learning JavaScript Design Patterns\", auf dem die meisten der unten aufgelisteten Links basieren.\n

\n\n

Entwurfsmuster

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV*-Patterns

\n\n
\n Es gibt einige Implementierungen des traditionellen MVC-Patterns und einige Abwandlungen dessen in JavaScript.\n
\n\n
\n \n
\n" }, { "path": "i18n/de-de/partials/testing-tools.html", "content": "

Beschreibung

\n\n

Verschiedene Bibliotheken und Frameworks, um Tests in JavaScript auszuführen.

\n" }, { "path": "i18n/de-de/partials/welcome.html", "content": "

Hey, du!

\n\n

\n Dies ist ein Leitfaden, der Entwicklern beim Einstieg in JavaScript helfen soll und erfahrenen Entwicklern mit Best-Practices helfen soll.\n

\n\n

\n Trotz des Namens steht dieser Leitfaden nicht für \"den einzigen Weg\", den man mit JavaScript gehen kann.\n

\n\n

\n Wir sammeln lediglich all diese Artikel, Tipps und Tricks von namhaften Entwicklern und fügen sie hier ein. Da sie von ausgezeichneten Leuten stammen, können wir sagen, dass es \"der richtige Weg\" oder der beste Weg ist.\n

\n" }, { "path": "i18n/en-us/en-us.json", "content": "{\n \"meta\": {\n \"title\": \"JS: The Right Way\",\n \"description\": \"A quick reference to best practices for writing JavaScript -- links to code patterns and tutorials from around the web\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"Choose your path\",\n \"links\": [{\n \"title\": \"Getting Started\",\n \"url\": \"#getting-started\"\n }, {\n \"title\": \"JavaScript Code Style\",\n \"url\": \"#js-code-style\"\n }, {\n \"title\": \"The Good Parts\",\n \"url\": \"#the-good-parts\"\n }, {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n }, {\n \"title\": \"Patterns\",\n \"url\": \"#patterns\"\n }, {\n \"title\": \"Testing Tools\",\n \"url\": \"#testing-tools\"\n }, {\n \"title\": \"Frameworks\",\n \"url\": \"#frameworks\"\n }, {\n \"title\": \"Game Engines\",\n \"url\": \"#game-engines\"\n }, {\n \"title\": \"News\",\n \"url\": \"#news\"\n }, {\n \"title\": \"Reading\",\n \"url\": \"#reading\"\n }, {\n \"title\": \"Podcasts\",\n \"url\": \"#podcasts\"\n }, {\n \"title\": \"Screencasts\",\n \"url\": \"#screencasts\"\n }, {\n \"title\": \"Who to follow\",\n \"url\": \"#whotofollow\"\n }, {\n \"title\": \"PaaS Providers\",\n \"url\": \"#paas\"\n }, {\n \"title\": \"Helpers\",\n \"url\": \"#helpers\"\n }]\n },\n \"gettingStarted\": {\n \"title\": \"GETTING STARTED\",\n \"text\": \"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\": \"JS CODE STYLE\",\n \"text\": \"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\": {\n \"title\": \"THE GOOD PARTS\",\n \"text\": \"{{@link=partials/good-parts.html}}\"\n },\n \"mustSee\": {\n \"title\": \"MUST SEE\",\n \"videos\": [{\n \"title\": \"Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains\",\n \"url\": \"https://www.youtube.com/embed/QyUFheng6J0\"\n }]\n },\n \"patterns\": {\n \"title\": \"PATTERNS\",\n \"text\": \"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\": {\n \"title\": \"TESTING TOOLS\",\n \"text\": \"{{@link=partials/testing-tools.html}}\",\n \"links\": [{\n \"name\": \"Mocha\",\n \"url\": \"http://mochajs.org\",\n \"description\": \"Maintained by TJ Holowaychuk\"\n }, {\n \"name\": \"QUnit\",\n \"url\": \"http://qunitjs.com\",\n \"description\": \"Maintained by jQuery\"\n }, {\n \"name\": \"Jasmine\",\n \"url\": \"https://github.com/pivotal/jasmine\",\n \"description\": \"Maintained by Pivotal Labs\"\n }, {\n \"name\": \"Karma\",\n \"url\": \"http://karma-runner.github.io/\",\n \"description\": \"Maintained by the team behind AngularJS. Mostly by Vojta Jina\"\n }, {\n \"name\": \"Intern\",\n \"url\": \"http://theintern.io\",\n \"description\": \"Maintained by Sitepen\"\n }, {\n \"name\": \"Istanbul\",\n \"url\": \"http://gotwarlost.github.io/istanbul\",\n \"description\": \"A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\"\n }, {\n \"name\": \"Sinon.JS\",\n \"url\": \"http://sinonjs.org\",\n \"description\": \"Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Sinon.JS community\"\n }, {\n \"name\": \"DexterJS\",\n \"url\": \"https://github.com/leobalter/DexterJS\",\n \"description\": \"A test helper to mock functions and the XHR object, maintained by Leo Balter\"\n }, {\n \"name\": \"AVA\",\n \"url\": \"https://github.com/sindresorhus/ava\",\n \"description\": \"Test runner with asynchronous tests, maintained by Sindre Sorhus\"\n }, {\n \"name\": \"Jest\",\n \"url\": \"https://github.com/facebook/jest\",\n \"description\": \"Painless JavaScript Testing, maintained by Facebook\"\n }]\n },\n \"frameworks\": {\n \"title\": \"FRAMEWORKS\",\n \"cat\": [{\n \"title\": \"GENERAL PURPOSE\",\n \"links\": [{\n \"name\": \"jQuery\",\n \"url\": \"http://jquery.com\",\n \"description\": \"jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\"\n }, {\n \"name\": \"YUI\",\n \"url\": \"http://yuilibrary.com\",\n \"description\": \"Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\"\n }, {\n \"name\": \"ZeptoJS\",\n \"url\": \"http://zeptojs.com\",\n \"description\": \"Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\"\n }, {\n \"name\": \"Dojo Toolkit\",\n \"url\": \"http://dojotoolkit.org\",\n \"description\": \"Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\"\n }, {\n \"name\": \"Underscore.js\",\n \"url\": \"http://underscorejs.org\",\n \"description\": \"Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\"\n }]\n }, {\n \"title\": \"MV*\",\n \"links\": [{\n \"name\": \"Backbone.js\",\n \"url\": \"http://backbonejs.org\",\n \"description\": \"Very popular JavaScript client-side framework, built by @jashkenas.\"\n }, {\n \"name\": \"Ember.js\",\n \"url\": \"http://emberjs.com\",\n \"description\": \"Built by @wycats, jQuery and Ruby on Rails core developer.\"\n }, {\n \"name\": \"Knockout.js\",\n \"url\": \"http://knockoutjs.com\",\n \"description\": \"Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\"\n }, {\n \"name\": \"Angular.js\",\n \"url\": \"http://angularjs.org\",\n \"description\": \"Built by Google, Angular.js is like a polyfill for the future of HTML.\"\n }, {\n \"name\": \"Angular\",\n \"url\": \"https://angular.io\",\n \"description\": \"One framework.Mobile & desktop. One way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.\"\n }, {\n \"name\": \"Cappuccino\",\n \"url\": \"http://www.cappuccino-project.org\",\n \"description\": \"Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\"\n }, {\n \"name\": \"JavaScript MVC\",\n \"url\": \"http://javascriptmvc.com/\",\n \"description\": \"JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\"\n }, {\n \"name\": \"Meteor\",\n \"url\": \"https://www.meteor.com\",\n \"description\": \"Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\"\n }, {\n \"name\": \"Spice.js\",\n \"url\": \"http://spicejs.github.io/spicejs/\",\n \"description\": \"Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\"\n }, {\n \"name\": \"Riot.js\",\n \"url\": \"http://www.riotjs.com/\",\n \"description\": \"Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\"\n }, {\n \"name\": \"CanJS\",\n \"url\": \"http://canjs.com\",\n \"description\": \"CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\"\n }]\n }, {\n \"title\": \"Library\",\n \"links\": [{\n \"name\": \"React\",\n \"url\": \"http://facebook.github.io/react\",\n \"description\": \"Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\"\n }, {\n \"name\": \"Vue.js\",\n \"url\": \"http://www.vuejs.org\",\n \"description\": \"Is an MVVM library providing two-way data binding, HTML extended behaviour (through directives) and reactive components. By using native add-ons a developer can also have routing, AJAX, a Flux-like state management, form validation and more. Provides a helpful Chrome extension to inspect components built with Vue.\"\n }, {\n \"name\": \"Handlebars\",\n \"url\": \"http://handlebarsjs.com\",\n \"description\": \"Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\"\n }, {\n \"name\": \"Dust.js\",\n \"url\": \"http://linkedin.github.io/dustjs\",\n \"description\": \"Asynchronous templates for the browser and node.js.\"\n }]\n }, {\n \"title\": \"Animation\",\n \"links\": [{\n \"name\": \"GSAP\",\n \"url\": \"http://greensock.com/\",\n \"description\": \"GSAP is the fastest full-featured scripted animation tool on the planet. It's even faster than CSS3 animations and transitions in many cases.\"\n }, {\n \"name\": \"Velocity.js\",\n \"url\": \"http://julian.com/research/velocity/\",\n \"description\": \"Velocity is an animation engine with the same API as jQuery's $.animate().\"\n }, {\n \"name\": \"Bounce.js\",\n \"url\": \"http://bouncejs.com/\",\n \"description\": \"Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.\"\n }, {\n \"name\": \"TweenJS\",\n \"url\": \"http://www.createjs.com/tweenjs\",\n \"description\": \"A simple but powerful JavaScript library for tweening and animating HTML5 and JavaScript properties.\"\n }, {\n \"name\": \"Move.js\",\n \"url\": \"http://visionmedia.github.io/move.js/\",\n \"description\": \"Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.\"\n }, {\n \"name\": \"Snap.svg\",\n \"url\": \"http://snapsvg.io/\",\n \"description\": \"SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen.\"\n }, {\n \"name\": \"Rekapi\",\n \"url\": \"http://rekapi.com/\",\n \"description\": \"Rekapi is a library for making canvas and DOM animations with JavaScript, as well as CSS @keyframe animations for modern browsers.\"\n }, {\n \"name\": \"Favico.js\",\n \"url\": \"http://lab.ejci.net/favico.js/\",\n \"description\": \"Make use of your favicon with badges, images or videos.\"\n }, {\n \"name\": \"Textillate.js\",\n \"url\": \"http://jschr.github.io/textillate/\",\n \"description\": \"Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.\"\n }, {\n \"name\": \"Motio\",\n \"url\": \"http://darsa.in/motio/\",\n \"description\": \"Motio is a small JavaScript library for simple but powerful sprite based animations and panning.\"\n }, {\n \"name\": \"Between.js\",\n \"url\": \"https://github.com/sasha240100/between.js\",\n \"description\": \"Lightweight JavaScript (ES6) tweening engine\"\n }]\n }]\n },\n \"gameEngines\": {\n \"title\": \"GAME ENGINES\",\n \"links\": [{\n \"name\": \"MelonJS\",\n \"url\": \"http://melonJS.org\",\n \"description\": \"MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\"\n }, {\n \"name\": \"ImpactJS\",\n \"url\": \"http://impactjs.com\",\n \"description\": \"ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\"\n }, {\n \"name\": \"LimeJS\",\n \"url\": \"http://limejs.com\",\n \"description\": \"LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\"\n }, {\n \"name\": \"Crafty\",\n \"url\": \"http://craftyjs.com\",\n \"description\": \"Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\"\n }, {\n \"name\": \"Cocos2d-HTML5\",\n \"url\": \"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\": \"Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\"\n }, {\n \"name\": \"Phaser\",\n \"url\": \"http://phaser.io\",\n \"description\": \"Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\"\n }, {\n \"name\": \"Goo\",\n \"url\": \"http://www.goocreate.com/learn\",\n \"description\": \"Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\"\n }, {\n \"name\": \"LycheeJS\",\n \"url\": \"http://lycheejs.org\",\n \"description\": \"LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\"\n }, {\n \"name\": \"Quintus\",\n \"url\": \"http://html5quintus.com\",\n \"description\": \"Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\"\n }, {\n \"name\": \"KiwiJS\",\n \"url\": \"http://www.kiwijs.org\",\n \"description\": \"Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\"\n }, {\n \"name\": \"PandaJS\",\n \"url\": \"http://www.pandajs.net\",\n \"description\": \"Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\"\n }, {\n \"name\": \"Rot.js\",\n \"url\": \"https://github.com/ondras/rot.js\",\n \"description\": \"Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\"\n }, {\n \"name\": \"Isogenic\",\n \"url\": \"http://www.isogenicengine.com/\",\n \"description\": \"Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \"\n }, {\n \"name\": \"WhitestormJS\",\n \"url\": \"https://github.com/WhitestormJS/whitestorm.js\",\n \"description\": \"Super-fast 3D framework for Web Applications & Games. Based on Three.js. Includes integrated physics support and ReactJS integration.\"\n }]\n },\n \"news\": {\n \"title\": \"News\",\n \"cat\": [{\n \"title\": \"Websites\",\n \"links\": [{\n \"name\": \"JavaScript.com\",\n \"url\": \"http://javascript.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Echo JS\",\n \"url\": \"http://www.echojs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"The Treehouse Show\",\n \"url\": \"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\": \"\"\n }, {\n \"name\": \"/r/javascript on Reddit\",\n \"url\": \"http://www.reddit.com/r/javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Open Web Platform Daily Digest\",\n \"url\": \"http://webplatformdaily.org\",\n \"description\": \"\"\n }, {\n \"name\": \"Badass JavaScript\",\n \"url\": \"http://badassjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"AngularJS Daily\",\n \"url\": \"http://paper.li/gwinnem/1390553142\",\n \"description\": \"\"\n }]\n }, {\n \"title\": \"Newsletter\",\n \"links\": [{\n \"name\": \"JavaScript Weekly\",\n \"url\": \"http://javascriptweekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"A Drip of JavaScript\",\n \"url\": \"http://designpepper.com/a-drip-of-javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Ember Weekly\",\n \"url\": \"http://emberweekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Node Weekly\",\n \"url\": \"http://nodeweekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Meteor Weekly\",\n \"url\": \"http://meteorhacks.com/meteor-weekly\",\n \"description\": \"\"\n }, {\n \"name\": \"Grunt Weekly\",\n \"url\": \"https://twitter.com/gruntweekly\",\n \"description\": \"\"\n }, {\n \"name\": \"Gamedev.js Weekly\",\n \"url\": \"http://weekly.gamedevjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"HTML5 Weekly\",\n \"url\": \"http://html5weekly.com\",\n \"description\": \"\"\n }, {\n \"name\": \"UDGWebDev Weekly\",\n \"url\": \"http://udgwebdev.com/newsletter\",\n \"description\": \"\"\n }, {\n \"name\": \"The React Newsletter\",\n \"url\": \"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\": \"\"\n }]\n }]\n },\n \"reading\": {\n \"title\": \"Reading\",\n \"cat\": [{\n \"title\": \"Articles\",\n \"credit\": true,\n \"box\": false,\n \"links\": [{\n \"name\": \"Understanding JavaScript OOP\",\n \"url\": \"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\": \"by Quildreen Motta\"\n }, {\n \"name\": \"Understanding “Prototypes” in JavaScript\",\n \"url\": \"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\": \"by Yehuda Katz\"\n }, {\n \"name\": \"Prototypes and Inheritance in JavaScript\",\n \"url\": \"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\": \"by Scott Allen\"\n }, {\n \"name\": \"Partial Application in JavaScript\",\n \"url\": \"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\": \"by Ben Alman\"\n }, {\n \"name\": \"Getting Over jQuery\",\n \"url\": \"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\": \"by Nico Bevacqua\"\n }, {\n \"name\": \"A Dive Into Plain JavaScript\",\n \"url\": \"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\": \"by Viljami S.\"\n }, {\n \"name\": \"A Deeper Look at Objects in JavaScript\",\n \"url\": \"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\": \"by Kirupa Chinnathambi\"\n }, {\n \"name\": \"Introduction to Easing in JavaScript\",\n \"url\": \"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\": \"by Kirupa Chinnathambi\"\n }, {\n \"name\": \"How to Learn JavaScript Properly\",\n \"url\": \"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\": \"by JavaScript Is Sexy\"\n }, {\n \"name\": \"How to Start with JavaScript\",\n \"url\": \"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\": \"by Ju Gonçalves\"\n }]\n }, {\n \"title\": \"Books\",\n \"credit\": true,\n \"box\": false,\n \"links\": [{\n \"name\": \"Eloquent JavaScript\",\n \"url\": \"http://eloquentjavascript.net\",\n \"description\": \"by Marijn Haverbeke\"\n }, {\n \"name\": \"JavaScript: The Definitive Guide\",\n \"url\": \"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\": \"by David Flanagan\"\n }, {\n \"name\": \"JavaScript: The Good Parts\",\n \"url\": \"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\": \"by Douglas Crockford\"\n }, {\n \"name\": \"JavaScript Patterns\",\n \"url\": \"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\": \"by Stoyan Stefanov\"\n }, {\n \"name\": \"JavaScript Testing Recipes\",\n \"url\": \"http://jstesting.jcoglan.com\",\n \"description\": \"by James Coglan\"\n }, {\n \"name\": \"Professional JavaScript for Web Developers\",\n \"url\": \"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\": \"by Nicholas C. Zakas\"\n }, {\n \"name\": \"High Performance JavaScript\",\n \"url\": \"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\": \"by Nicholas C. Zakas\"\n }, {\n \"name\": \"Human JavaScript\",\n \"url\": \"http://humanjavascript.com\",\n \"description\": \"by Henrik Joreteg\"\n }, {\n \"name\": \"Object Oriented JavaScript\",\n \"url\": \"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\": \"by Stoyan Stefanov\"\n }, {\n \"name\": \"Pro JavaScript Design Patterns\",\n \"url\": \"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\": \"by Dustin Diaz\"\n }, {\n \"name\": \"Learning JavaScript Design Patterns\",\n \"url\": \"https://addyosmani.com/resources/essentialjsdesignpatterns/book/\",\n \"description\": \"by Addy Osmani\"\n }, {\n \"name\": \"Secrets of the JavaScript Ninja\",\n \"url\": \"http://jsninja.com\",\n \"description\": \"by John Resig\"\n }, {\n \"name\": \"JavaScript Application Design\",\n \"url\": \"http://bevacqua.io/bf\",\n \"description\": \"by Nicolas Bevacqua\"\n }, {\n \"name\": \"Speaking JavaScript\",\n \"url\": \"http://speakingjs.com\",\n \"description\": \"by Axel Rauschmayer\"\n }, {\n \"name\": \"Test-Driven JavaScript Development\",\n \"url\": \"http://tddjs.com\",\n \"description\": \"by Christian Johansen\"\n }, {\n \"name\": \"You Don't Know JS\",\n \"url\": \"https://github.com/getify/You-Dont-Know-JS\",\n \"description\": \"by Kyle Simpson\"\n }, {\n \"name\": \"You Might Not Need jQuery\",\n \"url\": \"http://youmightnotneedjquery.com\",\n \"description\": \"by Ryan Burgess\"\n }, {\n \"name\": \"JavaScript Garden\",\n \"url\": \"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\": \"by Ivo Wetzel\"\n }, {\n \"name\": \"Effective JavaScript\",\n \"url\": \"http://effectivejs.com\",\n \"description\": \"by David Herman\"\n }, {\n \"name\": \"JavaScript Allongé\",\n \"url\": \"https://leanpub.com/javascriptallongesix\",\n \"description\": \"by Reginald Braithwaite\"\n }, {\n \"name\": \"Exploring ES6\",\n \"url\": \"http://exploringjs.com/es6/\",\n \"description\": \"by Axel Rauschmayer\"\n }, {\n \"name\": \"JSBooks\",\n \"url\": \"http://jsbooks.revolunet.com\",\n \"description\": \"by DevFreeBooks\"\n }]\n }, {\n \"title\": \"Free E-Books\",\n \"credit\": false,\n \"box\": true,\n \"links\": [{\n \"name\": \"JSBooks\",\n \"url\": \"http://jsbooks.revolunet.com\",\n \"description\": \"\"\n }, {\n \"name\": \"DevFreeBooks\",\n \"url\": \"http://devfreebooks.org\",\n \"description\": \"\"\n }]\n }, {\n \"title\": \"Portals\",\n \"credit\": false,\n \"box\": true,\n \"links\": [{\n \"name\": \"JavaScript.com\",\n \"url\": \"https://www.javascript.com\",\n \"description\": \"\"\n }, {\n \"name\": \"HTML5 Rocks\",\n \"url\": \"http://www.html5rocks.com\",\n \"description\": \"\"\n }, {\n \"name\": \"W3Fools\",\n \"url\": \"http://www.w3fools.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Mozilla Developer Network\",\n \"url\": \"http://developer.mozilla.org/docs/JavaScript\",\n \"description\": \"\"\n }, {\n \"name\": \"Web Platform\",\n \"url\": \"http://docs.webplatform.org/wiki/javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Smashing Magazine\",\n \"url\": \"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\": \"\"\n }, {\n \"name\": \"Node School\",\n \"url\": \"http://nodeschool.io\",\n \"description\": \"\"\n }, {\n \"name\": \"How to Node\",\n \"url\": \"http://howtonode.org\",\n \"description\": \"\"\n }, {\n \"name\": \"Felix’s Node.js Beginners Guide\",\n \"url\": \"http://nodeguide.com/beginner.html\",\n \"description\": \"\"\n }]\n }]\n },\n \"podcasts\": {\n \"title\": \"Podcasts\",\n \"links\": [{\n \"name\": \"JavaScript Jabber\",\n \"url\": \"https://devchat.tv/js-jabber/\",\n \"description\": \"\"\n }, {\n \"name\": \"Node Up\",\n \"url\": \"http://nodeup.com\",\n \"description\": \"\"\n }, {\n \"name\": \"5 Minutes of JavaScript\",\n \"url\": \"https://fivejs.codeschool.com\",\n \"description\": \"\"\n }, {\n \"name\": \"The Meteor Podcast\",\n \"url\": \"http://www.meteorpodcast.com\",\n \"description\": \"\"\n }, {\n \"name\": \"JSConf\",\n \"url\": \"https://www.youtube.com/user/jsconfeu\",\n \"description\": \"\"\n }, {\n \"name\": \"JavaScript Air\",\n \"url\": \"http://javascriptair.com/\",\n \"description\": \"\"\n }]\n },\n \"screencasts\": {\n \"title\": \"Screencasts\",\n \"links\": [{\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },{\n \"name\": \"Egghead\",\n \"img\": \"egghead.svg\",\n \"url\": \"https://egghead.io\",\n \"description\": \"\"\n }, {\n \"name\": \"DevFreeCasts\",\n \"img\": \"devfreecasts.png\",\n \"url\": \"http://devfreecasts.org\",\n \"description\": \"\"\n }, {\n \"name\": \"Tagtree\",\n \"img\": \"tagtree.png\",\n \"url\": \"http://tagtree.io/\",\n \"description\": \"\"\n }, {\n \"name\": \"frontndmasters.com\",\n \"img\": \"frontendmasters.svg\",\n \"url\": \"http://frontendmasters.com\",\n \"description\": \"\"\n }]\n },\n \"whoToFollow\": {\n \"title\": \"Who To Follow\"\n },\n \"paasProviders\": {\n \"title\": \"PaaS Provider\",\n \"links\": [{\n \"name\": \"Heroku\",\n \"url\": \"http://heroku.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Modulus\",\n \"url\": \"https://modulus.io\",\n \"description\": \"\"\n }, {\n \"name\": \"Nodejitsu\",\n \"url\": \"http://nodejitsu.com\",\n \"description\": \"\"\n }, {\n \"name\": \"OpenShift\",\n \"url\": \"https://www.openshift.com\",\n \"description\": \"\"\n }, {\n \"name\": \"Getup\",\n \"url\": \"http://getupcloud.com/en/\",\n \"description\": \"\"\n }, {\n \"name\": \"Windows Azure\",\n \"url\": \"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\": \"\"\n }]\n },\n \"helpers\": {\n \"title\": \"Helpers\",\n \"links\": [{\n \"name\": \"npm\",\n \"img\": \"npm.png\",\n \"url\": \"https://npmjs.org\",\n \"description\": \"\"\n }, {\n \"name\": \"bower\",\n \"img\": \"bower-logo.png\",\n \"url\": \"http://bower.io\",\n \"description\": \"\"\n }, {\n \"name\": \"yeoman\",\n \"img\": \"yeoman-logo.png\",\n \"url\": \"http://yeoman.io\",\n \"description\": \"\"\n }, {\n \"name\": \"grunt\",\n \"img\": \"grunt-logo.png\",\n \"url\": \"http://gruntjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"gulp\",\n \"img\": \"gulp.png\",\n \"url\": \"http://gulpjs.com\",\n \"description\": \"\"\n }, {\n \"name\": \"brunch\",\n \"img\": \"brunch-logo.png\",\n \"url\": \"http://brunch.io\",\n \"description\": \"\"\n }, {\n \"name\": \"Browser compilation library\",\n \"img\": \"broccoli-logo.png\",\n \"url\": \"https://github.com/broccolijs/broccoli\",\n \"description\": \"\"\n }, {\n \"name\": \"Webpack\",\n \"img\": \"webpack-logo.png\",\n \"url\": \"https://webpack.github.io/\",\n \"description\": \"\"\n }, {\n \"name\": \"Rollup\",\n \"img\": \"rollup-logo.png\",\n \"url\": \"http://rollupjs.org/\",\n \"description\": \"\"\n }, {\n \"name\": \"Browserify\",\n \"img\": \"browserify-logo.png\",\n \"url\": \"http://browserify.org/\",\n \"description\": \"\"\n }, {\n \"name\": \"todo mvc\",\n \"img\": \"todomvc-logo.png\",\n \"url\": \"http://todomvc.com\",\n \"description\": \"\"\n }]\n },\n \"footer\": {\n \"credit\": \"Created and maintained by\",\n \"contributors\": \"Contributors\",\n \"contribDesc\": \"This project wouldn't exist without these amazing contributors. Thank you guys for making this real!\",\n \"licence\": \"{{@link=partials/licence.html}}\"\n },\n \"languages\": [{\n \"url\": \"pt-br\",\n \"name\": \"Português\"\n }, {\n \"url\": \"ko-kr\",\n \"name\": \"한국어\"\n }, {\n \"url\": \"es-es\",\n \"name\": \"Español\"\n }, {\n \"url\": \"de-de\",\n \"name\": \"German\"\n }, {\n \"url\": \"en-us\",\n \"name\": \"English\"\n }, {\n \"url\": \"zh-tw\",\n \"name\": \"繁體中文\"\n }, {\n \"url\": \"zh-cn\",\n \"name\": \"简体中文\"\n }, {\n \"url\": \"fa-ir\",\n \"name\": \"فارسی\"\n }, {\n \"url\": \"ru-ru\",\n \"name\": \"Русский\"\n }]\n}\n" }, { "path": "i18n/en-us/partials/code-style.html", "content": "

Conventions

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

Linting

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n" }, { "path": "i18n/en-us/partials/getting-started.html", "content": "

ABOUT

\n\n

\n Created by Netscape in 1995 as an extension of HTML for Netscape Navigator 2.0, JavaScript had as its main function the manipulation of HTML documents and form validation.\n\n Before winning this name so famous nowadays, JavaScript was called Mocha. When it first shipped in beta releases, it was officially called LiveScript and finally, when it was released by Sun Microsystems, was baptized with the name by which it is known today.\n\n Because of the similar names, people confuse JavaScript with Java. Although both have the lexical structure of programming, they are not the same language.\n\n Different from C, C# and Java, JavaScript is an interpreted language. It means that it needs an \"interpreter\". In case of JavaScript, the interpreter is the browser.\n

\n\n

CURRENT VERSION

\n\n

\n The JavaScript standard is ECMAScript. As of 2012, all modern browsers fully support ECMAScript 5.1. Older browsers support at least ECMAScript 3. As of June 2015 the spec for ES6/ES2015 has been approved. Following the new annual release cycle, ES7/ES2016 has been adopted in June 2016. See the ECMAScript 2016 Language Specification at Ecma International.\n

\n\n

\n A good reference to versions, references and news about JavaScript can be found at the Mozilla Developer Network.\n

\n\n

THE DOM

\n\n

\n The Document Object Model (DOM) is an API for HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript. See more at Mozilla Developer Network - DOM.\n

\n" }, { "path": "i18n/en-us/partials/good-parts.html", "content": "

Object Oriented

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

Anonymous Functions

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

Function Binding

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\nIt is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n

Strict mode

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/en-us/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n" }, { "path": "i18n/en-us/partials/patterns.html", "content": "\n

Description

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

Design Patterns

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n" }, { "path": "i18n/en-us/partials/testing-tools.html", "content": "

Description

\n\n

Various libraries and frameworks to do tests in JavaScript.

\n" }, { "path": "i18n/en-us/partials/welcome.html", "content": "

Hey, you!

\n\n

\n This is a guide intended to introduce new developers to JavaScript and help experienced developers learn more about its best practices.\n

\n\n

\n Despite the name, this guide doesn't necessarily mean \"the only way\" to do JavaScript.\n

\n\n

\n We just gather all the articles, tips, and tricks from top developers and put it here. Since it comes from exceptional folks, we could say that it is \"the right way\", or the best way to do so.\n

\n" }, { "path": "i18n/es-es/es-es.json", "content": "{\n \"meta\": {\n \"title\":\"JS: La forma correcta\",\n \"description\":\"Una referencia a las mejores prácticas para escribir código JavaScript -- enlaces de patrones de código y tutoriales alrededor de la web\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"Elije tu camino\",\n \"links\": [\n {\n \"title\":\"Primeros Pasos\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"Estilo de Código de JavaScript\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"Las Buenas Partes\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"Patrones\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"Herramientas de Pruebas\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"Frameworks\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"Motores de Juego\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"Noticias\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"Lecturas\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"Podcasts\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"Videotutoriales\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"A quien seguir?\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"Proveedores PaaS\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"Ayudantes\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"PRIMEROS PASOS\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"ESTILO DE CODIGO DE JS\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"LAS BUENAS PARTES\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"PATRONES\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"HERRAMIENTAS DE PRUEBAS\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"Mantenido por TJ Holowaychuk.\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"Mantenido por jQuery.\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"Mantenido por Pivotal Labs.\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"Mantenido por el equipo detrás de AngularJS. Mayormente por Vojta Jina.\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"Mantenido por Sitepen.\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"Una herramienta de cobertura de código JavaScript escrita en JavaScript, mantenida por Krishnan Anantheswaran.\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"Espias de pruebas autónomos, stubs y mocks para JavaScript. Sin ependencias, trabaja con cualquier framework de pruebas unitarias. Creado por Sinon.JS community.\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"Un ayudante para simular funciones y objetos XHR, mantenido por Leo Balter.\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"FRAMEWORKS\",\n \"cat\":[\n {\n \"title\":\"PROPOSITO GENERAL\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery es una libreria hecha en Javascript rápida, pequeña, y abundante en características. Construida por John Resig.\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"Creado por Yahoo!, YUI es una libreria Javascript y CSS de código abierto para construir aplicaciones web altamente interactivas. Apartir del 29 de Agosto del 2014 se detuvo el desarrollo del framework.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto es una libreria JavaScript minimalista para navegadores modernos con una API en gran parte compatible con jQuery. Si usas jQuery, estas listo para conocer como se usa Zepto.\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo dispone de una serie de herramientas Javascript gratuitas, de código abierto para construir aplicaciones web de alto rendimento. IBM y SitePen son patrocinadores del proyecto.\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js es una libreria JavaScript que nos proporciona una serie de utilidades de la programación funcional sin necesidad de extender de alguno de los objetos preconstruidos.\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"Creado por @wycats, jQuery y personas del equipo de desarrollo de Ruby on Rails.\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com/\",\n \"description\":\"Framework javascript del lado del cliente muy popular, Construido por @jashkenas.\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"Simplifica la creación de UI dinámicas en JavaScript aplicando el patrón Model-View-View Model (MVVM).\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"Construido por Google, Angular.js es como un polyfill para el HTML del futuro.\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"Un framework.Mobile y escritorio. Una forma de crear aplicaciones con Angular y usar su código y habilidades para crear aplicaciones para cada meta de implementación. Para web, web móvil, teléfono móvil nativo y escritorio nativo.\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino es un framework de código abierto que hace fácil la contrucción de aplicaciones del calibre de aplicaciones desktop pero que se ejecutaran en un navegador web.\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC es un framework de código abierto que contiene las mejores ideas del desarrollo con jQuery.\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor es una plataforma de código abierto para construir aplicaciones web de alta calidad en corto tiempo, ideal para programadores avanzados, y también para programadores que hasta ahora estan comenzando.\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://spicejs.github.io/spicejs/\",\n \"description\":\"Spice es un framework MVC flexible y extremadamente leve(< 3k) para javascript. Spice fue construido para ser agregado fácilmente a cualquier aplicación existente y para coexistir con otras tecnologías tales como jQuery, pjax, turbolinks, node o cualquier otra libreria existente.\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot es una libreria (MV*) incriblemente rápida, poderosa y aún así ligera del lado del cliente para contruir aplicacione web de gran escala. A pesar de ser tan ligera cuenta con todas las funcionalidades necesarias: un motor de plantillas, enrutador, libreria para el control de eventos y un patrón MVP estricto para mantener todo organizado.\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS es un framework Javascript que hace el desarrollo de aplicaciones complejas sencillo y rápido. De fácil aprendizaje, pequeña, y sin forzar a utilizar ninguna estructura de aplicación, cuenta con características modernas como custom tags (etiquetas html customizadas) y 2-way binding (Vinculación de doble vía).\"\n }\n ]\n },\n {\n \"title\":\"Librerias\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react/s\",\n \"description\":\"Creada por Facebook. React es una libreria para crear interfaces de usuarios utilizada por Facebook e Instagram. Muchas personas tienen a pensar en React como el componente V (La vista) en el módelo MVC.\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com/\",\n \"description\":\"Handlebars provee el poder necesario para permitir la construción de plantillas semanticas sin ninguna fustración.\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs/\",\n \"description\":\"Plantillas asincronas para el navegador y node.js\"\n }\n ]\n },\n {\n \"title\":\"Animación\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity es un motor de animaciones que hace uso de la misma API de JQuery $.animate().\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js es una herramienta y una libreria de JS que permite crear poderosas animaciones CSS3.\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"Una libreria de Javascript simple pero poderosa para interpolar y animar elementos de HTML5 y de JavaScript.\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js es una pequeña libreria de JavaScript que permite crear animaciones CSS3 extremadamente simples y elegantes.\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG es una excelente forma de crear vectores gráficos interactivos, independientes de la resolución, los cuales luciran geniales en cualquier tamaño de pantalla.\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi es una libreria para crear animaciones en el canvas y en el DOM con Javascript, permitiendo también animaciones CSS utilizando @keyframe para los navegadores modernos.\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"Realiza tu favicon con banderillas, imagenes o videos.\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js hace uso de algunas librerias increibles para proveer un plugin sencillo para realizar animaciones CSS3 en cualquier texto.\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio es una pequeña libreria JavaScript para crear animacione simples y poderosas basadas en sprites.\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"MOTORES DE JUEGO\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS es un motor de juegos en HTML5 gratuito y ligero. El motor integra el formato de mapa de baldosas haciendo el diseño de niveles muy fácil.\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS es uno de los mas probados y verdaderos motores de juegos en HTML5. Su publicación inicial se remonta a finales del 2010. Se encuentra muy bien mantenido y actualizado, y tiene toda una comunidad de gran tamaño que lo respalda. Existe suficiente documentación - incluso dos libros para la creación juegos con el motor ImpactJS.\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS is en un framework para la creación rápida de juegos en HTML5, creando una experiencia nativa en los navegadores modernos, tanto para dispositivos moviles como para dispositivos de escritorio.\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty es un motor de juegos creado a finales del 2010. Crafty hace que sea realmente fácil la creación de juegos con JavaScript.\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5 es un framework de juegos web 2D, liberado bajo licencia MIT. Este es una versión en HTML5 del proyecto Cocos2d-x. Cocos2d-html5 se enfoca en hacer que Cocos2d sea compatible en todas las plataformas, navegadores y applicaciones nativas.\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser se encuentra basado basado fuertemente en Flixel. Es mantenido por Richard Davey (Photon Storm) quien ha sido muy activo en la comunidad de HTML5 durante años.\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo en es un motor de juegos 3D en JavaScript enteramente construido en WebGL/HTML5\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS es una libreria para juegos en JavaScript que ofrece un solución completa para prototipar y desarrollar juegos basados en el Canvas de HTML5, WebGL u OpenGL(ES) nativo dentro del Navegador Web o ambientes nativos.\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus es un motor de juego HTML5 diseñado para ser modular y ligero, con una syntaxis concisa y amigable en JavaScript.\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js es un Motor de Juegos divertido y amigable en HTML5 de Código Abierto. Algunas personas lo llaman el WordPress de los motores de juegos de HTML5\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js es un motor de juegos en HTML5 para moviles y escritorios con renderizado en Canvas y WebGL.\"\n }\n ]\n },\n \"news\":{\n \"title\":\"Noticias\",\n \"cat\":[\n {\n \"title\":\"Sitios Web\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Boletín\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"Lectura\",\n \"cat\":[\n {\n \"title\":\"Artículos\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Entendiendo programación orientada a objetos en JavaScript\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"por Quildreen Motta\"\n },\n {\n \"name\":\"Entendiendo “Prototypes” en JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"por Yehuda Katz\"\n },\n {\n \"name\":\"Prototipos y Herencia en JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"por Scott Allen\"\n },\n {\n \"name\":\"Aplicación Parcial en JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"por Ben Alman\"\n },\n {\n \"name\":\"Atravesando jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"por Nico Bevacqua\"\n },\n {\n \"name\":\"Una sumergida en JavaScript puro\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"por Viljami S.\"\n },\n {\n \"name\":\"Un Vista en Profundidad a Objetos en JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"por Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introducción al Easing(Flexibilización) en JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"por Kirupa Chinnathambi\"\n },\n {\n \"name\":\"¿Cómo Aprender JavaScript Apropiadamente?\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"por JavaScript Is Sexy\"\n },\n {\n \"name\":\"¿Cómo Comenzar con JavaScript?\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"por Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"Libros\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Eloquent Javascript\",\n \"url\":\"http://eloquentjavascript.net/\",\n \"description\":\"por Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: La Guía Definitiva\",\n \"url\":\"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\":\"por David Flanagan\"\n },\n {\n \"name\":\"JavaScript: Las Partes Buenas\",\n \"url\":\"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\":\"por Douglas Crockford\"\n },\n {\n \"name\":\"Patrones en JavaScript\",\n \"url\":\"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\":\"por Stoyan Stefanov\"\n },\n {\n \"name\":\"Formulas de Pruebas en JavaScript\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"by James Coglan\"\n },\n {\n \"name\":\"JavaScript para Desarrolladores Web Profesionales\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"por Nicholas C. Zakas\"\n },\n {\n \"name\":\"JavaScript de Alto Rendimiento\",\n \"url\":\"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\":\"por Nicholas C. Zakas\"\n },\n {\n \"name\":\"JavaScript Humano\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"por Henrik Joreteg\"\n },\n {\n \"name\":\"JavaScript Orientado a Objetos\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"por Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Patrones de Diseño\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"por Dustin Diaz\"\n },\n {\n \"name\":\"Secretos del JavaScript Ninja\",\n \"url\":\"http://jsninja.com\",\n \"description\":\"por John Resig\"\n },\n {\n \"name\":\"Diseño de Aplicaciones en JavaScript\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"por Nicolas Bevacqua\"\n },\n {\n \"name\":\"Hablando de JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"por Axel Rauschmayer\"\n },\n {\n \"name\":\"Desarrollo de JavaScript Basado en Pruebas\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"por Christian Johansen\"\n },\n {\n \"name\":\"No conoces JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"por >Kyle Simpson\"\n },\n {\n \"name\":\"Quizas no necesitas jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"por Ryan Burgess\"\n },\n {\n \"name\":\"Jardín JavaScript\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"por Ivo Wetzel\"\n },\n {\n \"name\":\"JavaScript Efectivo\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"por David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascript-allonge\",\n \"description\":\"por Reginald Braithwaite\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"por DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"E-Books Gratuitos\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com/\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Portales\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Red de Desarrolladores de Mozilla\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Plataforma Web\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Escuela de Node\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"¿Cómo hacer Node?\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"La guía de Node.js de Felix\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"Podcasts\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"http://javascriptjabber.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Arriba Node\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutos de JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"Videotutoriales\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io/\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontendmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"¿A quién seguir?\"\n },\n \"paasProviders\":{\n \"title\":\"Proveedores PaaS\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"Ayudantes\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"Creado y mantenido por\",\n \"contributors\":\"Colaboradores\",\n \"contribDesc\":\"Este proyecto no existiría sin estos maravillosos colaboradores. Muchas gracias muchachos por hacer esto real!\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n }\n}\n" }, { "path": "i18n/es-es/partials/code-style.html", "content": "

Convenciones

\n\n

\n Como todo lenguaje, JavaScript tiene muchas guías de estilo. Quizas la más usada y recomendada es la Guía de Estilo de Google para JavaScript, pero nosotros te recomendamos leer Idiomatic.js.\n

\n\n

Linting

\n\n

\n Actualmente la mejor herramienta para realizar linting (análisis) del código en JavaScript es JSHint. Nosotros recomendamos que siempre que sea posible se verifique el estilo y los patrones del código con una herramienta de análisis del código.\n

\n" }, { "path": "i18n/es-es/partials/getting-started.html", "content": "

ACERCA

\n\n

\n Creado por Netscape en 1995 como una extensión de HTML para Netscape Navigator 2.0, JavaScript ha tenido como función principal la manipulación de los documentos HTML y la validación de formularios.\n\n Antes de ganar su nombre muy famoso en estos días, JavaScript fue llamado Mocha. Cuando fue lanzada su primera publicación beta, fue oficialmente llamado LiveScript y finalmente, cuando fue publicado por Sun Microsystems, fue bautizado con el nombre por el cual es conocido hoy.\n\n A causa de los nombres similares, las personas confunden JavaScript con Java. Aunque ambos tienen la estructura léxica de programación, ellos son lenguajes muy diferentes.\n\n Diferente de C, C# y Java, JavaScript es un lenguaje interpretado. Significa que este requiere un \"interpreter\". En el caso de JavaScript, el interpreter es el navegador.\n

\n\n

VERSION ACTUAL

\n\n

\n El estándar de JavaScript es ECMAScript. A partir del 2012, todos los navegadores modernos soportan completamente ECMAScript 5.1. Los navegadores antiguos soportan al menos ECMAScript 3. En Junio de 2015 la especificación para la versión ES6/ES2015 fue aprobada. Puedes revisar las especificaciones de la version 2015 de ECMAScript en Ecma International.\n

\n\n

\n Una buena referencia sobre las versiones, documentación, noticias y demás sobre JavaScript puede encontrarse en la Red de Desarrolladores de Mozilla.\n

\n\n

EL DOM

\n\n

\n El Modelo de Objetos del Documento (DOM) es un API para documentos HTML y XML. Este prevee una representación estructural del documento, permitiéndole modificar su contenido y presentación visual mediante el uso de un lenguaje de scripting tal como JavaScript. Ver mas en Red de Desarrolladores de Mozilla - DOM.\n

\n" }, { "path": "i18n/es-es/partials/good-parts.html", "content": "

Orientado a Objetos

\n\n

\n JavaScript tiene un fuerte enfoque de programación orientada a objetos, a pesar de algunos debates que tienen lugar debido a las diferencias de la orientacion a objetos en Javascript comparado con otros lenguajes.\n

\n\n

\n Fuente: Introducción a JavaScript Orientado a Objetos\n

\n\n

Anonymous Functions (Funciones Anónimas)

\n\n

\n Funciones anómimas que son declaradas dinámicamente en tiempo de ejecución. Son llamadas anónimas porque no poseen un nombre de la misma manera que las funciones normales.\n

\n\n

\n Fuente: Funciones anónimas\n

\n\n

Functions as First-class Objects (Funciones de Objetos de primera clase)

\n\n

\n Las funciones en JavaScript son objetos de primera clase. Esto significa que las funciones son simplemente un tipo de objeto especial, con las cuales se pueden hacer las mismas cosas que cualquier otro objeto podria hacer.\n

\n\n

\n Fuente: Las funciones son objetos de primera clase en JavaScript\n

\n\n

Loose Typing (Tipado Blando)

\n\n

\n Para muchos desarrolladores front-end, JavaScript fue su primera experiencia en lenguajes de scripting y/o interpretados. Para estos desarrolladores, el concepto y las implicaciones de las variables de tipado blando quizas son de segunda naturaleza. Como siempre, el crecimiento explosivo en demanda para aplicaciones web modernas, ha resultado en un crecimiento en el número de desarrolladores back-end que han tenido que meter sus manos en tecnologías del lado del cliente. Muchos de estos programadores llegan experiencia en lenguajes de tipado fuerte, tales como C# o Java, y le resultan desconocidas las libertades y las potenciales trampas envueltas en el trabajo con variables de tipado blando.\n

\n\n

\n Fuente: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting (Alcance y Elevación)

\n\n

\n Scoping o Alcance: En JavaScript, las funciones son nuestras delimitadoras del alcance de facto al momento de la declaración de variables, lo cual significa que los bloques que son de bucles y condicionales (tales como if, for, while, switch y try) NO delimitan el alcance, a diferencia de la mayoría de otros lenguajes. Por lo tanto, estos bloques compartirán el mismo alcance que la función que las contiene. De esta forma, podría ser peligroso declarar variables dentro de bloques si se requiere que las variables sólo sean vistas en el bloque que pertenecen.\n

\n\n

\n Hoisting o Elevación: En ejecución, todas las declaraciones var y function son movidas para el comienzo de cada función (su alcance) - esto es conocido como Elevación. Dicho esto, es buena practica declarar todas las variables juntas en la primera línea, con el fín de evitar falsas expectativas con las variables que han sido declaradas luego de la asignación de su valor - esto es un problema común con programadores que llegan de lenguajes con alcance de bloques.\n

\n\n

\n Fuente: Alcance y Elevación en JavaScript\n

\n\n

Function Binding (Función de Vinculación)

\n\n

\n La Función de Vinculación es probablemente la última de las preocupaciones de un principiante con JavaScript, pero cuando se entiende que necesita una solución al problema de cómo mantener el contexto de 'this' dentro de otra función, entonces puede darse cuenta que de hecho necesita de la función bind Function.prototype.bind().\n

\n\n

\n Fuente: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function (Función de Clausura)

\n\n

\n Las Clausuras o closures son funciones que hacen referencia a variables independientes (libres). En otras palabras, la función definida en el closure 'recuerda' el ambiente en el cual esta fue creado.\nEsto es un importante concepto para entender, así como útil durante el desarrollo, por ejemplo emular métodos privados. Esto puede también ayuda a aprender como evitar errores, como crear closures en bucles.\n

\n\n

\n Fuente: MDN - Clausuras\n

\n\n

Strict mode (Modo Estricto)

\n\n

\n El modo estricto de ECMAScript 5 es una manera de optar por una forma restringida de JavaScript. El modo estricto no es solo un subconjunto: este tiene intencionalmente una semántica diferente del código normal. Los navegadores que no soportan el modo estricto correran el código de forma distinta con aquellos navegadores que lo soportan, entonces no confie en el modo estricto sin realizar una prueba de características, asegurando el soporte de los aspectos relevantes del modo estricto. El código en modo estricto y en modo no estrícto pueden coexistir, de esta forma, scripts pueden optar entrar al modo estrícto de forma incremental.\n

\n\n

\n Fuente: MDN - Modo Estricto\n

\n\n

Immediately-Invoked Function Expression (IIFE) (Expresión de Función Inmediatamente Invocada)

\n\n

\n Una expresión de función inmediatamente invocada es un patrón el cual produce un scope lexico usando las funciones de scoping de Javascript. La Expresión de función imadiatamente invocada puede ser usada para evitar el hoisting de las variables con los bloques, protege contra la contaminación del ambiente global y simultáneamente permite acceder a los métodos publicos al tiempo que conserva la privacidad en las variables definidas dentro de la función.

\n Este patrón ha sido referido como una función anónima autoejecutable, pero @cowboy (Ben Alman) introduce el termino IIFE como un término semántico más exacto para el patrón.\n

\n\n

\n Fuente: Expresión de Función Inmediatamente Invocada (IIFE)\n

\n" }, { "path": "i18n/es-es/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: La Forma Correcta por William Oliveira.
Licenciado bajo Creative Commons Attribution-NonCommercial 4.0 International License.
Basado en el trabjo en http://jstherightway.org.\n

\n" }, { "path": "i18n/es-es/partials/patterns.html", "content": "\n

Descripción

\n\n

\n Mientras JavaScript contiene patrones de diseño que son exclusivos para el lenguaje, muchos patrones de diseño de otros lenguajes pueden ser también implementados.\n

\n\n

\n Una buena forma de aprender acerca de estos patrones es el libro de Addy Osmani de código abierto Aprender Patrones de Diseño en JavaScript. Los enlaces referenciados son (en su mayoría) basados en este.\n

\n\n

Patrones de Diseño

\n\n
\n \n
\n\n

\n Patrones de Diseño Creacionales\n

\n\n
\n \n
\n\n

\n Patrones de Diseno Estructural\n

\n\n
\n \n
\n\n

\n Patrones de Diseno de Comportamiento\n

\n\n

Patrones MV*

\n\n
\n Existen algunas implementaciones del tradicional patron MVC y sus variaciones en JavaScript.\n
\n\n
\n \n
\n" }, { "path": "i18n/es-es/partials/testing-tools.html", "content": "

Descripción

\n\n

Varias librerias y frameworks para realizar pruebas en JavaScript.

\n" }, { "path": "i18n/es-es/partials/welcome.html", "content": "

Oye, tú!

\n\n

\n Esta es una guía que busca introducir a nuevos desarrolladores en JavaScript y que busca también que los desarrolladores más experimentados conozcan un poco más sobre las mejores prácticas.\n

\n\n

\n A pesar del nombre de esta guía, no significa que sea necesariamente \"la única forma\" para realizar JavaScript.\n

\n\n

\n Nosotros solo hemos reunidos todos los artículos, consejos, y trucos de los principales desarrolladores y colocado aquí. Ya que viene de personas excepcionales, nosotros podemos decir que esta es la \"la forma correcta\", la mejor forma de escribir código en JavaScript.\n

\n" }, { "path": "i18n/fa-ir/fa-ir.json", "content": "{\n \"meta\": {\n \"title\":\"جاوااسکریپت: از راه درستش\",\n \"description\":\"یک مرجع سریع به بهترین شیوه برای برنامه‌نویسی جاوااسکریپت -- پیوند به الگوها و آموزش‌های سراسر وب\"\n },\n \"direction\": \"rtl\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"مسیر خود را انتخاب کنید\",\n \"links\": [\n {\n \"title\":\"شروع\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"سَبک کدنویسی در جاوااسکریپت\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"قسمت‌های خوب\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"الگوها\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"ابزارهای تست\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"چارچوب‌ها (فرم‌ورک‌ها)\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"موتور‌های بازی\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"اخبار\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"مطالعه بیشتر\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"پادکست‌ها\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"اسکرین‌کست‌ها\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"از چه کسی پیروی کنیم\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"ارائه دهنده‌های PaaS (بستر به عنوان سرویس)\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"کمک‌ها\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"GETTING STARTED\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"JS CODE STYLE\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"THE GOOD PARTS\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"PATTERNS\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"TESTING TOOLS\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"Maintained by TJ Holowaychuk\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"Maintained by jQuery\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"Maintained by Pivotal Labs\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"Maintained by the team behind AngularJS. Mostly by Vojta Jina\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"Maintained by Sitepen\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Sinon.JS community\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"A test helper to mock functions and the XHR object, maintained by Leo Balter\"\n },\n {\n \"name\":\"AVA\",\n \"url\":\"https://github.com/sindresorhus/ava\",\n \"description\":\"Test runner with asynchronous tests, maintained by Sindre Sorhus\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"FRAMEWORKS\",\n \"cat\":[\n {\n \"title\":\"GENERAL PURPOSE\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"Very popular JavaScript client-side framework, built by @jashkenas.\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"Built by @wycats, jQuery and Ruby on Rails core developer.\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"Built by Google, Angular.js is like a polyfill for the future of HTML.\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"One framework.Mobile & desktop. One way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://spicejs.github.io/spicejs/\",\n \"description\":\"Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\"\n }\n ]\n },\n {\n \"title\":\"Library\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"Asynchronous templates for the browser and node.js.\"\n }\n ]\n },\n {\n \"title\":\"Animation\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity is an animation engine with the same API as jQuery's $.animate().\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"A simple but powerful JavaScript library for tweening and animating HTML5 and JavaScript properties.\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen.\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi is a library for making canvas and DOM animations with JavaScript, as well as CSS @keyframe animations for modern browsers.\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"Make use of your favicon with badges, images or videos.\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio is a small JavaScript library for simple but powerful sprite based animations and panning.\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"GAME ENGINES\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\"\n },\n {\n \"name\":\"Rot.js\",\n \"url\":\"https://github.com/ondras/rot.js\",\n \"description\":\"Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\"\n }\n ]\n },\n \"news\":{\n \"title\":\"News\",\n \"cat\":[\n {\n \"title\":\"Websites\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Newsletter\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"Reading\",\n \"cat\":[\n {\n \"title\":\"Articles\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Understanding JavaScript OOP\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"by Quildreen Motta\"\n },\n {\n \"name\":\"Understanding “Prototypes” in JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"by Yehuda Katz\"\n },\n {\n \"name\":\"Prototypes and Inheritance in JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"by Scott Allen\"\n },\n {\n \"name\":\"Partial Application in JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"by Ben Alman\"\n },\n {\n \"name\":\"Getting Over jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"by Nico Bevacqua\"\n },\n {\n \"name\":\"A Dive Into Plain JavaScript\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"by Viljami S.\"\n },\n {\n \"name\":\"A Deeper Look at Objects in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"by Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introduction to Easing in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"by Kirupa Chinnathambi\"\n },\n {\n \"name\":\"How to Learn JavaScript Properly\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"by JavaScript Is Sexy\"\n },\n {\n \"name\":\"How to Start with JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"by Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"Books\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Eloquent JavaScript\",\n \"url\":\"http://eloquentjavascript.net\",\n \"description\":\"by Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: The Definitive Guide\",\n \"url\":\"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\":\"by David Flanagan\"\n },\n {\n \"name\":\"JavaScript: The Good Parts\",\n \"url\":\"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\":\"by Douglas Crockford\"\n },\n {\n \"name\":\"JavaScript Patterns\",\n \"url\":\"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\":\"by Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"by James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"by Nicholas C. Zakas\"\n },\n {\n \"name\":\"High Performance JavaScript\",\n \"url\":\"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\":\"by Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"by Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"by Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"by Dustin Diaz\"\n },\n {\n \"name\":\"Learning JavaScript Design Patterns\",\n \"url\":\"https://addyosmani.com/resources/essentialjsdesignpatterns/book/\",\n \"description\":\"by Addy Osmani\"\n },\n {\n \"name\":\"Secrets of the JavaScript Ninja\",\n \"url\":\"http://jsninja.com\",\n \"description\":\"by John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"by Nicolas Bevacqua\"\n },\n {\n \"name\":\"Speaking JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"by Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"by Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"by Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"by Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"by Ivo Wetzel\"\n },\n {\n \"name\":\"Effective JavaScript\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"by David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascriptallongesix\",\n \"description\":\"by Reginald Braithwaite\"\n },\n {\n \"name\":\"Exploring ES6\",\n \"url\":\"http://exploringjs.com/es6/\",\n \"description\":\"by Axel Rauschmayer\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"by DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"Free E-Books\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Portals\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix’s Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"Podcasts\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"https://devchat.tv/js-jabber/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n },\n {\n \"name\":\"JavaScript Air\",\n \"url\":\"http://javascriptair.com/\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"Screencasts\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"Who To Follow\"\n },\n \"paasProviders\":{\n \"title\":\"PaaS Provider\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com/en/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"Helpers\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"Webpack\",\n \"img\":\"webpack-logo.png\",\n \"url\":\"https://webpack.github.io/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Rollup\",\n \"img\":\"rollup-logo.png\",\n \"url\":\"http://rollupjs.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browserify\",\n \"img\":\"browserify-logo.png\",\n \"url\":\"http://browserify.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"Created and maintained by\",\n \"contributors\":\"Contributors\",\n \"contribDesc\":\"This project wouldn't exist without these amazing contributors. Thank you guys for making this real!\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n },\n \"languages\": [\n {\"url\":\"pt-br\",\"name\":\"Português\"},\n {\"url\":\"ko-kr\",\"name\":\"한국어\"},\n {\"url\":\"es-es\",\"name\":\"Español\"},\n {\"url\":\"de-de\",\"name\":\"German\"},\n {\"url\":\"en-us\",\"name\":\"English\"},\n {\"url\":\"zh-tw\",\"name\":\"繁體中文\"},\n {\"url\":\"zh-cn\",\"name\":\"简体中文\"},\n {\"url\":\"fa-ir\",\"name\":\"فارسی\"},\n {\"url\":\"ru-ru\",\"name\":\"Русский\"}\n ]\n}\n" }, { "path": "i18n/fa-ir/partials/code-style.html", "content": "

Conventions

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

Linting

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n" }, { "path": "i18n/fa-ir/partials/getting-started.html", "content": "

درباره

\n\n

\n جاوااسکریپت در سال ۱۹۹۵ توسط نت‌اسکیپ (Netscape) جهت گسترش HTML برای Netscape Navigator 2.0 ایجاد شده است، جاوااسکریپت به عنوان عملکرد اصلی به کار گیری documents در HTML و همچنین اعتبار سنجی فرم بود.\n\n جاوااسکریپت را در ابتدا آقای برندان ایچ (Brendan Eich) در شرکت نت‌اسکیپ با نام Mocha طراحی نمود. این نام بعدا در نسخه بتا به LiveScript و نهایتاً به جاوااسکریپت تغییر یافت.\n\n علیرغم اشتباه عمومی، زبان جاوا اسکریت با زبان جاوا متفاوت است، اگر چه هر دو زبان برنامه‌نویسی هستند.\n\n\n

\n\n

نسخه کنونی

\n\n

\n استاندارد جاوااسکریپت اکمااسکریپت (ECMAScript) است که از سال ۲۰۱۲ تمامی مرورگر‌های مدرن استاندارد اکمااسکریپت نسخه ۵.۱ را به صورت کامل پشتیبانی می‌کنند، همچنین مرورگر‌های قدیمی‌تر نسخه ۳ از اکمااسکریپت را پشتیبانی می‌کنند. از ماه June سال ۲۰۱۵ اکمااسکریپت ۶ (ES6) یا همان اکمااسکریپت ۲۰۱۵ (ES2015) مورد قبول واقع شده است.توضیحات تکمیلی در مورد اکمااسکریپت ۶ را می توانید در Ecma International مشاهده نمایید.\n

\n\n

\n Mozilla Developer Networkمرجع خوبی برای نسخه‌ها، منابع و اخبار جاوااسکریپت می‌باشد.\n

\n\n

DOM

\n\n

\n مدل شیءگرای سند یا دام (DOM - Document Object Model) یک API برای HTML و XHTML می باشد که قابلیت تغییرات محتوا را فراهم می‌کند. توضیحات بیشتر در Mozilla Developer Network - DOM می‌باشد.\n

\n" }, { "path": "i18n/fa-ir/partials/good-parts.html", "content": "

Object Oriented

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

Anonymous Functions

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

Function Binding

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\nIt is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n

Strict mode

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/fa-ir/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n" }, { "path": "i18n/fa-ir/partials/patterns.html", "content": "\n

Description

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

Design Patterns

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n" }, { "path": "i18n/fa-ir/partials/testing-tools.html", "content": "

Description

\n\n

Various libraries and frameworks to do tests in JavaScript.

\n" }, { "path": "i18n/fa-ir/partials/welcome.html", "content": "

خوش‌آمدید!

\n\n

\n بهرتین شیوه‌های معرفی جاوااسکریپت به توسعه‌دهنده‌های جدید و کمک به توسعه‌دهنده‌های با تجربه، در این راهنما در نظر گرفته شده است.\n

\n\n

\n با توجه به نام انتخاب شده، این راهنما لزما به معنی \"تنها راه\" یادگیری جاوااسکریپت نیست.\n

\n\n

\n ما فقط تمامی مقاله‌ها، نکته‌ها و ترفند‌ها را از توسعه‌دهنده‌های برتر در اینجا جمع‌آوری کردیم، به دلیل اینکه این مجموعه استثنایی است ما به آن \"از راه درستش\" (the right way) می‌گوییم.\n

\n" }, { "path": "i18n/ko-kr/README.md", "content": "# 한국어 번역에 참여하는 방법\n\n기본 룰\n-------\n\n1. 파일의 indentation, syntax가 손상되지 않도록 신경쓰면서 문장을 번역합니다.\n2. 번역된 문장은 반드시 존댓말이어야합니다.\n3. [부산대 맞춤법 검사기](http://speller.cs.pusan.ac.kr/)를 통과하도록 합시다. 다만, 라이브러리/프레임워크 이름이나, IT방면에서 고유어 수준으로 사용되는 단어는 제외합니다. (프레임워크, 템플릿 등)\n4. `grunt server`로 실행해본 후 실제 사이트에 문제가 없는지 확인해봅니다.\n5. PR을 올린 후 반드시 1명 이상 다른 사람의 리뷰를 받아서 문장이 어색한지 않은지 확인 받습니다.\n\n\n단어 규칙\n---------\n\n다음 단어들은 다음과 같이 통일합니다. 단, 책 이름, 게시물 이름 등의 외부 리소스의 제목에는 적용하지 않습니다.\n\n| 권장하지 않는 단어 | 권장하는 단어 | 비고 |\n|--------------------|---------------|------|\n| 자바스크립트, JS, Javascript | JavaScript | 대소문자에 유의해주세요 |\n| 오픈 소스 | 오픈소스 | 일관성을 위한 통일입니다 |\n| 어플리케이션 | 애플리케이션 | 맞춤법 관련 |\n| 브라우져 | 브라우저 | 맞춤법 관련 |\n| 데스크탑 | 데스크톱 | 맞춤법 관련 |\n| UI, 유저 인터페이스 | 사용자 인터페이스 | 일관성을 위한 통일입니다 |\n| 블럭 | 블록 | 맞춤법 관련 |\n| html5 | HTML5 | 단, 라이브러리명이 소문자인 경우는 제외 |\n| css | CSS | 단, 라이브러리명이 소문자인 경우는 제외 |\n| 현대적인, modern | 모던 | 일관성을 위한 통일입니다 |\n| 꼼수, trick | 트릭 | 일관성을 위한 통일입니다 |\n\n\n인명\n----\n\n읽는 방법을 정확히 알 수 없으므로 인명은 모두 번역하지 않습니다.\n\n\n인용\n----\n\n본문에서 링크하고 있는 내용의 전체 번역본이 있는 경우에 한하여 번역본을 링크합니다.\n번역본을 링크할 경우에는 그 제목도 번역본의 제목과 일치시켜주세요.\n" }, { "path": "i18n/ko-kr/ko-kr.json", "content": "{\n \"meta\": {\n \"title\":\"JS: The Right Way\",\n \"description\":\"JavaScript를 작성할 때 있어서 최고의 방법들에 대한 간편한 참고문헌입니다. 웹에 있는 코드 패턴들과 튜토리얼들의 링크를 포함하고 있습니다.\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"어디부터 보시겠습니까?\",\n \"links\": [\n {\n \"title\":\"시작하기\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"JavaScript 코딩 스타일\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"알면 좋은 것들\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"패턴\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"테스팅 도구\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"프레임워크\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"게임 엔진\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"뉴스\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"읽을거리\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"팟캐스트\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"스크린캐스트\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"팔로우 추천\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"PaaS 공급자\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"도움이 되는 프로그램\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"시작하기\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"JavaScript 코딩 스타일\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"알면 좋은 것들\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"패턴\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"테스팅 도구\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"TJ Holowaychuk이 관리하고 있습니다.\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"jQuery가 관리하고 있습니다.\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"Pivotal Labs가 관리하고 있습니다.\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"AngularJS팀이 뒤에서 관리하고 있습니다. 주로 Vojta Jina가 관리하고 있습니다.\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"Sitepen이 관리하고 있습니다.\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"JavaScript로 작성된 JavaScript 코드 커버리지 측정 도구입니다. Krishnan Anantheswaran이 관리하고 있습니다.\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"JavaScript 테스트를 위한 Spy, Stub, Mock을 제공합니다. 의존성이 없고, 어느 유닛 테스트 프레임워크와도 동작합니다. Sinon.JS 커뮤니티가 만들었습니다.\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"Mock 함수와 XHR 객체를 제공하는 테스트 도우미입니다. Leo Balter가 관리하고 있습니다.\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"프레임워크\",\n \"cat\":[\n {\n \"title\":\"범용\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery는 작고 빠르며, 풍부한 기능을 가지고 있는 JavaScript 라이브러리로 John Resig이 만들었습니다.\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"Yahoo!가 제작한 YUI는 자유 오픈소스 JavaScript, CSS 라이브러리로 상호작용하는 웹 애플리케이션을 제작하는 데 사용됩니다. 2014년 8월 29일 이후로 새로운 개발이 진행되지 않고 있습니다.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto는 현대적 웹 브라우저를 위한, jQuery에 호환성을 가진 API를 제공하는 소형 JavaScript 라이브러리입니다. jQuery를 사용할 줄 안다면 Zepto를 어떻게 사용하는지 이미 알고 있는 겁니다.\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo는 고성능의 웹 애플리케이션을 만들기 위한 자유, 오픈소스 JavaScript Toolkit입니다. 이 프로젝트의 후원자에는 IBM과 SitePen이 포함되어 있습니다.\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js는 내장 객체를 확장하지 않고도 유용한 함수형 프로그래밍 도우미를 사용할 수 있도록 돕는 JavaScript 라이브러리입니다.\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"@jashkenas가 만든 아주 유명한 JavaScript 클라이언트 측 프레임워크입니다.\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"jQuery와 Ruby on Rails 코어 개발자인 @wycats가 만들었습니다.\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"Model-View-View Model (MVVM)를 적용하여 동적인 JavaScript 사용자 인터페이스 개발을 간소화시켜줍니다.\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"Google이 개발한 Angular.js는 마치 미래의 HTML을 위한 polyfill 같습니다.\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"프레임 워크입니다. 모바일 및 데스크톱입니다. Angular로 응용 프로그램을 만들고 코드와 기술을 사용하여 각 배포 목표에 맞는 응용 프로그램을 만드는 한 가지 방법입니다. 웹, 모바일 웹, 기본 휴대 전화 및 기본 데스크탑 용.\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino는 데스크톱 앱 품질의 웹 애플리케이션을 쉽게 개발할 수 있게 해주는 오픈소스 프레임워크입니다.\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC는 jQuery 개발에 쓰이는 최고의 아이디어를 포함한 오픈소스 프레임워크입니다.\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor는 당신이 숙련된 개발자이건, 처음 시작한 개발자이건 상관없이 짧은 시간 안에 최고 품질의 웹 애플리케이션을 만들게 도와주는 오픈소스 플랫폼입니다.\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://www.3den.org/spicejs\",\n \"description\":\"Spice는 아주 작고 (< 3k) 유연한 MVC JavaScript 프레임워크입니다. Spice는 이미 존재하는 애플리케이션에 쉽게 추가할 수 있고, jQuery, pjax, turbolinks, node 혹은 당신이 쓰는 어떤 기술들과도 같이 연동하기 쉽게 만들어졌습니다.\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot은 엄청나게 빠르고 강력하지만 아주 작으며, 대규모의 웹 애플리케이션 개발을 위한 클라이언트 (MV*) 라이브러리입니다. 아주 작은 크기에도 불구하고 템플릿 엔진, 라우터, 이벤트 라이브러리, 엄격한 MVP 패턴 같은 모든 필요한 요소를 갖추고 있습니다.\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS는 복잡한 애플리케이션을 쉽고 빠르게 개발할 수 있도록 해주는 JavaScript 프레임워크입니다. 배우기 쉽고 작으며 대단하진 않지만, 커스텀 태그나 양방향 바인딩 같은 최신 기능을 지원합니다.\"\n }\n ]\n },\n {\n \"title\":\"라이브러리\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"Facebook이 공개한 React는 Facebook과 Instagram의 사용자 인터페이스를 만드는 데 사용된 JavaScript 라이브러리입니다. 많은 사람이 MVC의 V로써 React를 선택하고 있습니다.\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars는 의미론적인 템플릿을 효과적으로 만들 수 있게 해주는 라이브러리입니다.\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"브라우저와 node.js를 위한 비동기 템플릿 라이브러리입니다.\"\n }\n ]\n },\n {\n \"title\":\"애니메이션\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity는 jQuery의 $.animate()와 같은 API를 가지고 있는 애니메이션 엔진입니다.\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js는 아름다운 CSS3 애니메이션 제작을 가능하게 하는 툴인 동시에 JavaScript 라이브러리입니다.\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"HTML5와 JavaScript 프로퍼티의 tweening과 애니메이션을 지원하는 간단하지만 강력한 JavaScript 라이브러리입니다.\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js는 CSS3기반 애니메이션을 아주 간단하고 우아하게 만들 수 있는 작은 JavaScript 라이브러리입니다.\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG는 스크린 사이즈와 해상도에 독립적이면서 상호작용하는 벡터 그래픽을 만드는 훌륭한 방법입니다.\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi는 canvas와 DOM 애니메이션을 만들기 위한 JavaScript 라이브러리입니다. 또한, 모던 브라우저를 위한 @keyframe 애니메이션도 지원합니다.\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"배지, 이미지, 비디오와 함께 favicon을 사용하세요.\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js는 몇몇 멋진 라이브러리들을 통합하여 어떤 텍스트에든 CSS3 애니메이션을 적용가능하게 해주는 사용하기 편리한 플러그인입니다.\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio는 간단하지만 강력한 스프라이트 기반의 애니메이션과 panning을 지원하는 JavaScript 라이브러리입니다.\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"게임 엔진\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS는 무료이며 경량화된 HTML5 게임 엔진입니다. MelonJS는 tiled map format을 사용하여 레벨 디자인을 하기 쉽게 도와줍니다.\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS는 2010년 말에 소개된 HTML5 게임 엔진입니다. ImpactJS는 꾸준히 업데이트되고 관리되고 있으며 대형 커뮤니티가 지원하고 있습니다. 많은 개발 문서가 있으며 ImpactJS를 이용해 게임을 제작하는 책도 있습니다.\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS는 모든 모던 터치스크린/데스크톱 브라우저에서 빠르고 네이티브 애플리케이션에 가까운 게임을 개발할 수 있게 도와주는 HTML5 게임 프레임워크입니다.\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty는 2010년에 선보인 게임 엔진입니다. Crafty는 아주 쉽게 JavaScript 게임 개발을 시작할 수 있게 도와줍니다.\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5는 MIT 라이센스의 오픈소스 웹 2D 게임 프레임워크입니다. Cocos2d-html5는 Cocos2d-x 프로젝트의 HTML5 버전으로써 브라우저와 네이티브 환경을 아우르는 Cocos2d 크로스 플랫폼을 만드는 데 집중하고 있습니다.\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser는 Flixel에 기반을 두고 있습니다. 수년 동안 HTML5 커뮤니티에서 왕성하게 활동해 온 Richard Davey (Photon Storm)가 Phaser를 관리하고 있습니다.\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo는 WebGL/HTML5 기반으로 제작된 3D JavaScript 게임 엔진입니다.\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS는 JavaScript 게임 라이브러리입니다. 웹 브라우저와 네이티브 환경에서 HTML5 Canvas, WebGL 또는 native OpenGL(ES) 기반 게임의 프로토타이핑과 배포를 위한 통합 솔루션을 제공합니다.\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus는 모듈화/경량화를 위해 디자인된 간결화 된 JavaScript 문법을 사용하는 HTML5 게임 엔진입니다.\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js는 재미있고 친근한 HTML5 게임 엔진입니다. 몇몇 사람들은 HTML5 게임 엔진 계의 워드프레스라고 부릅니다.\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js는 Canvas와 WebGL 렌더링을 사용하는 모바일/데스크톱용 HTML5 게임 엔진입니다.\"\n }\n ]\n },\n \"news\":{\n \"title\":\"뉴스\",\n \"cat\":[\n {\n \"title\":\"웹사이트\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"뉴스레터\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"읽을거리\",\n \"cat\":[\n {\n \"title\":\"게시물\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Understanding JavaScript OOP\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"저자: Quildreen Motta\"\n },\n {\n \"name\":\"Understanding “Prototypes” in JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"저자: Yehuda Katz\"\n },\n {\n \"name\":\"Prototypes and Inheritance in JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"저자: Scott Allen\"\n },\n {\n \"name\":\"Partial Application in JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"저자: Ben Alman\"\n },\n {\n \"name\":\"Getting Over jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"저자: Nico Bevacqua\"\n },\n {\n \"name\":\"A Dive Into Plain JavaScript\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"저자: Viljami S.\"\n },\n {\n \"name\":\"A Deeper Look at Objects in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"저자: Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introduction to Easing in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"저자: Kirupa Chinnathambi\"\n },\n {\n \"name\":\"How to Learn JavaScript Properly\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"저자: JavaScript Is Sexy\"\n },\n {\n \"name\":\"How to Start with JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"저자: Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"책\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"자바스크립트 개론\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8960773867\",\n \"description\":\"저자: Marijn Haverbeke\"\n },\n {\n \"name\":\"자바스크립트 완벽 가이드 (절판)\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8966260683\",\n \"description\":\"저자: David Flanagan\"\n },\n {\n \"name\":\"더글라스 크락포드의 자바스크립트 핵심 가이드\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8979145985\",\n \"description\":\"저자: Douglas Crockford\"\n },\n {\n \"name\":\"자바스크립트 코딩 기법과 핵심 패턴\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8966260152\",\n \"description\":\"저자: Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes (원서)\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"저자: James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers (원서)\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"저자: Nicholas C. Zakas\"\n },\n {\n \"name\":\"High Performance JavaScript 자바스크립트 성능 최적화\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8979148550\",\n \"description\":\"저자: Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript (원서)\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"저자: Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript (원서)\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"저자: Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns (원서)\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"저자: Dustin Diaz\"\n },\n {\n \"name\":\"자바스크립트 닌자 비급\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8966261078\",\n \"description\":\"저자: John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design (원서)\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"저자: Nicolas Bevacqua\"\n },\n {\n \"name\":\"자바스크립트를 말하다\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8968481199\",\n \"description\":\"저자: Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development (원서)\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"저자: Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS (원서)\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"저자: Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery (원서)\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"저자: Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden (한국어 번역판)\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/ko/\",\n \"description\":\"저자: Ivo Wetzel\"\n },\n {\n \"name\":\"이팩티브 자바스크립트\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8966260853\",\n \"description\":\"저자: David Herman\"\n },\n {\n \"name\":\"함수형 자바스크립트\",\n \"url\":\"http://www.aladin.co.kr/shop/wproduct.aspx?ISBN=8968480796\",\n \"description\":\"저자: Michael Fogus\"\n },\n {\n \"name\":\"JavaScript Allongé (원서)\",\n \"url\":\"https://leanpub.com/javascript-allonge\",\n \"description\":\"저자: Reginald Braithwaite\"\n },\n {\n \"name\":\"JSBooks (원서)\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"저자: DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"무료 E-Book\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"포탈\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix’s Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"팟캐스트\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"http://javascriptjabber.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"스크린캐스트\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"팔로우 추천\"\n },\n \"paasProviders\":{\n \"title\":\"PaaS 공급자\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com/en/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"도움이 되는 프로그램\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"만들고 고친 사람들: \",\n \"contributors\":\"기여자들\",\n \"contribDesc\":\"이 프로젝트는 놀라운 기여자분들 없이는 존재할 수 없었을 겁니다. 이 문서를 만들어준 모두에게 정말 감사합니다!\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n }\n}\n" }, { "path": "i18n/ko-kr/partials/code-style.html", "content": "

컨벤션 (코드 작성 규칙)

\n\n

\n 다른 언어들과 마찬가지로 JavaScript에도 다양한 코딩 스타일 규칙이 있습니다. 아마도 가장 많은 이들이 사용하고, 추천하는 것은 구글 JavaScript 코드 스타일 규칙일 것입니다. 하지만 우리는 당신에게 Idiomatic.js 를 읽어볼 것을 추천합니다.\n

\n\n

린팅 (코드 스타일 검사)

\n\n

\n 요즘 JavaScript 코드 검사를 위한 가장 좋은 도구는 JSHint입니다. 우리는 당신이 어디서든지 린트 도구로 코드 스타일과 패턴 점검을 하는 것을 추천합니다.\n

\n" }, { "path": "i18n/ko-kr/partials/getting-started.html", "content": "

JavaScript란?

\n\n

\n JavaScript는 1995년에 Netscape Navigator 2.0의 확장 기능으로써 Netscape사에 의해 개발되었습니다. JavaScript의 주사용 목적은 HTML의 조작과 입력 서의 검사였습니다.\n\n 이 이름이 지금처럼 유명해지기 전에는 JavaScript는 Mocha라고 불렸습니다. 베타 버전이 배포되었을 때는 공식적으로 LiveScript라 불리었고, Sun Microsystems에 의해 정식 버전이 배포되었을 때는 우리가 지금 알고 있는 이름으로 변경되었습니다.\n\n 비슷한 이름 때문에 Java와 JavaScript를 혼동하는 사람들이 많습니다. 두 언어 모두 프로그래밍 언어적인 어휘 구조로 되어 있지만 같은 언어는 아닙니다.\n\n C, C#, Java와는 다르게, JavaScript는 인터프리터 언어입니다. 인터프리터가 필요하다는 뜻인데, JavaScript의 경우 인터프리터는 브라우저입니다.\n

\n\n

현재 버전

\n\n

\n JavaScript의 표준은 ECMAScript입니다. 2012년 현재, 모든 모던 브라우저는 ECMAScript 5.1을 완벽히 지원합니다. 조금 더 오래된 브라우저는 최소 ECMAScript 3를 지원합니다. 2015년 6월 현재, ES6/ES2015의 사양이 승인되었습니다. ECMAScript 2015 언어 사양은 Ecma International에서 자세히 볼 수 있습니다.\n

\n\n

\n 자바스크립트에 대한 정보, 참고자료, 뉴스 등은 Mozilla Developer Network에서 볼 수 있습니다.\n

\n\n

DOM

\n\n

\n 문서 객체 모델(DOM)은 HTML과 XML 문서의 API입니다. DOM은 문서의 구조를 표현하고, 문서의 내용을 수정할 수 있게 하며, JavaScript 등의 스크립트 언어로 시각화하여 보여줄 수 있습니다. 더 많은 정보는 Mozilla Developer Network - DOM을 참조하세요.\n

\n" }, { "path": "i18n/ko-kr/partials/good-parts.html", "content": "

객체지향

\n\n

\n JavaScript는 객체지향 프로그래밍에 강력한 호환성을 제공하고 있지만, 그런데도 타 객체 지향 언어와 비교했을 때 다른 점으로 인해 자주 논의됩니다.\n

\n\n

\n 참고: Introduction to Object-Oriented JavaScript\n

\n\n

익명 함수

\n\n

\n 익명 함수는 실행 시간 중에 동적으로 선언되는 함수입니다. 이런 함수를 익명함수라 하는데 다른 평범한 함수와는 달리 이름이 주어지지 않기 때문입니다.\n

\n\n

\n 참고: JavaScript anonymous functions\n

\n\n

1급 객체로서의 함수

\n\n

\n JavaScript에서 함수는 1급 객체입니다. 다시 말해 JavaScript 함수는 특별한 타입의 객체로, 일반적인 객체가 할 수 있는 모든 일을 할 수 있다는 뜻입니다.\n

\n\n

\n 참고: Functions are first class objects in JavaScript\n

\n\n

느슨한 타입

\n\n

\n 많은 Front-end 개발자들에게 JavaScript는 처음으로 접하는 인터프리터 언어이자 스크립트 언어입니다. 이 개발자들에게 느슨한 타입의 변수라는 개념과 논리적 함축은 아주 자연스러운 것입니다. 하지만 모던 웹 애플리케이션에 대한 수요가 폭발적으로 증가함에 따라 클라이언트 측 기술에 발을 디딘 Back-end 개발자들도 점점 많아지고 있는데, C#이나 Java 같은 강한 타입의 언어에 친숙한 이 사람들에게는 느슨한 타입의 변수들이 주는 자유로움이나 잠재적인 함정들이 익숙하지 않습니다.\n

\n\n

\n 참고: Understanding Loose Typing in JavaScript\n

\n\n

스코핑과 호이스팅

\n\n

\n 스코핑: JavaScript에서는 함수가 사실상의 변수들의 스코프 범위입니다. 그 말인즉슨, 루프나 조건문(if, for, while, switch, try 같은)의 블록은 다른 언어들과는 다르게 스코프 범위가 아닙니다. 그러므로 함수와 그 함수 내에 있는 블록들은 같은 스코프를 사용합니다. 따라서 변수가 블록 내에서만 존재 할거라 생각하고 변수를 선언하는 것은 위험할 수도 있습니다.\n

\n\n

\n 호이스팅: 실행을 시작하면 모든 변수와 함수의 선언은 각 함수(스코프)의 가장 위로 옮겨집니다. 이것이 바로 호이스팅(hoisting)입니다. 이것 때문에, 첫 줄 이후에 선언된 변수들은 호이스팅으로 인해 선언한 곳 전부터 존재하게 됩니다. 실수를 피하고자 모든 변수를 제일 첫 줄에 함께 선언하는 것은 좋은 습관입니다. 이것은 블록 스코프 기반 언어를 사용하던 프로그래머들이 흔하게 겪는 문제입니다.\n

\n\n

\n 참고: JavaScript Scoping and Hoisting\n

\n\n

함수 바인딩

\n\n

\n 함수 바인딩은 처음 JavaScript를 시작할 때에는 거의 신경 쓸 일이 없을지도 모릅니다. 하지만 다른 함수 내에서 this의 context를 유지해야 할 일이 생겼을 때 당신이 정말 필요로 하는 것은 Function.prototype.bind()라는 걸 알게 될 겁니다.\n

\n\n

\n 참고: Understanding JavaScript’s Function.prototype.bind\n

\n\n

클로저 함수

\n\n

\n 클로저는 독립적인(자유로운) 변수들을 가리키는 함수입니다. 다시 말하자면, 클로저 안에서 정의한 함수는 그 함수가 만들어진 환경을 '기억'합니다. private 메소드를 흉내 내는 것 이외에도 개발 시에 유용하게 쓰이는 개념이므로 이해하는 것이 중요합니다. 또한, 반복문 안에서 클로저를 생성하는 것처럼, 흔히 하는 실수들을 어떻게 피할 수 있는지 배우는 데도 도움이 됩니다.\n

\n\n

\n 참고: MDN - Closures\n

\n\n

Strict 모드

\n\n

\n ECMAScript 5의 strict 모드는 JavaScript의 제한된 변형을 사용하는 방법입니다. 단순히 부분집합은 아닙니다: 의도적으로 일반 코드와 다른 의미를 가집니다. Strict 모드를 지원하지 않는 브라우저는 지원하는 브라우저와 다르게 Strict 모드 코드를 실행하므로, Strict 모드에 대해 적절하게 지원되는지 기능 테스트가 없다면 신뢰할 수 없습니다. Strict 모드와 비 Strict 모드의 코드는 동시에 존재할 수 있으므로, 계속해서 Strict 모드를 명시해야 합니다.\n

\n\n

\n 참고: MDN - Strict mode\n

\n\n

즉시 실행 함수 표현(Immediately-Invoked Function Expression; IIFE)

\n\n

\n 즉시 실행 함수 표현은 JavaScript의 함수 스코핑을 사용해서 렉시컬 스코프를 생성하는 패턴입니다. 즉시 실행 함수 표현은 블록 내에서 변수가 호이스팅되는걸 방지하거나 전역 환경이 오염되는 것을 보호하는 데 사용되기도 하며, 동시에 함수 내에서 정의된 변수를 private로 만들며 메소드만 접근하도록 만들 수도 있습니다.\n 이 패턴은 자기실행 익명 함수(self-executing anonymous function)이라고 불리기도 하지만, @cowboy (Ben Alman)이 패턴에 대해 의미상으로 더 정확한 단어로 IIFE를 소개했습니다.\n

\n\n

\n 참고: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/ko-kr/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
이 저작물은 크리에이티브 커먼즈 저작자표시-비영리-동일조건변경허락 4.0 국제 라이선스에 따라 이용할 수 있습니다.
원문: http://jstherightway.org.\n

\n" }, { "path": "i18n/ko-kr/partials/patterns.html", "content": "\n

설명

\n\n

\n JavaScript는 자기만의 독자적인 디자인 패턴을 가지고 있는 한편, 많은 고전적인 디자인 패턴 또한 구현할 수 있습니다.\n

\n\n

\n JavaScript 디자인 패턴에 대해 배우는 좋은 방법은 Addy Osmani의 오픈소스 책 Learning JavaScript Design Patterns와 아래에 있는 중요한 패턴들의 문서를 기본으로 삼는 것입니다.\n

\n\n

디자인 패턴

\n\n
\n \n
\n\n

\n 생성패턴\n

\n\n
\n \n
\n\n

\n 구조패턴\n

\n\n
\n \n
\n\n

\n 행위패턴\n

\n\n

MV* 패턴

\n\n
\n JavaScript로 구현된 전통적인 MVC 패턴 구현과 그 변종들입니다.\n
\n\n
\n \n
\n" }, { "path": "i18n/ko-kr/partials/testing-tools.html", "content": "

설명

\n\n

JavaScript로 작성된 프로그램을 테스트하는 데에 필요한 여러 가지 라이브러리들과 프레임워크들을 소개합니다.

\n" }, { "path": "i18n/ko-kr/partials/welcome.html", "content": "

저기요!

\n\n

\n 이 안내 문서는 JavaScript를 처음 시작하는 개발자와 더 나은 방법들을 익히고자 하는 숙련된 개발자 모두를 위해 작성되었습니다.\n

\n\n

\n 이 문서의 이름과 달리, 이 안내 문서는 JavaScript를 하기 위한 \"유일한 길\"을 의미하지는 않습니다.\n

\n\n

\n 우리는 단지 실력 있는 개발자들로부터 모든 기사, 팁, 트릭을 여기 한 페이지에 모아놓았을 뿐입니다. 비범한 사람들에게서 나온 것들이기 때문에, 이것이 \"정석\", 또는 가장 좋은 방법이라고 이야기할 수 있습니다.\n

\n" }, { "path": "i18n/pt-br/partials/code-style.html", "content": "

Convenções

\n\n

\n Assim como todas as linguagens, JavaScript tem muitos guias de estilo de código. Talvez o mais usado e recomendado seja o Google Code Style Guide for JavaScript, mas recomendamos a leitura do Idiomatic.js.\n

\n\n

Análise de código (Linting)

\n\n

\n Nos dias de hoje, a melhor ferramenta para analise de código em JavaScript é o JSHint. Nós recomendamos que sempre que possível você verifique o seu estilo de código e padrões com uma ferramenta de análise (Lint Tool).\n

\n" }, { "path": "i18n/pt-br/partials/getting-started.html", "content": "

SOBRE

\n\n

\n Criado pela Netscape em 1995 como uma extensão do HTML para o navegador Netscape Navigator 2.0, o JavaScript teve como função principal a manipulação de documentos HTML e a validação de formulários.\n\n Antes de ganhar seu nome tão famoso hoje em dia, o JavaScript foi chamado de Mocha. Quando saiu pela primeira vez em uma versão beta foi chamado oficialmente de LiveScript e finalmente quando foi liberado pela Sun Microsystems foi batizado pelo nome que hoje nós conhecemos.\n\n Devido à similaridade de nomes, algumas pessoas confundem o JavaScript com o Java. Embora ambos tenham a estrutura léxica da programação, elas não são a mesma linguagem.\n\n Diferente do C, C# e do Java, o JavaScript é uma linguagem interpretada. Isso significa que ele precisa de um \"interpretador\". No caso do JavaScript, o interpretador é o navegador.\n

\n\n

VERSÃO ATUAL

\n\n

\n O padrão do JavaScript é o ECMAScript. Em 2012 todos os navegadores modernos passaram a dar suporte ao ECMAScript 5.1. Navegadores antigos suportam pelo menos o ECMAScript 3. Uma sexta revisão desses padrões está em andamento.\n

\n\n

\n Uma boa referência para versões, referências e novidades sobre o JavaScript pode ser encontrada no\n Mozilla Developer Network.\n

\n\n

O DOM

\n\n

\n O Modelo de Objetos de Documentos é uma API para documentos HTML e XML. Ele fornece uma representação estrutural do documento, permitindo que você modifique seu conteúdo e sua apresentação visual usando linguagens de script como o JavaScript. Leia mais em Mozilla Developer Network - Referência do DOM.\n

\n" }, { "path": "i18n/pt-br/partials/good-parts.html", "content": "

Orientação a Objetos

\n\n

\n JavaScript tem fortes capacidades de programação orientada a objetos, apesar de ocorrerem algumas discussões devido às diferenças da orientação a objetos no JavaScript em comparação com outras linguagens.\n

\n\n

\n Fonte: Introdução ao JavaScript Orientado a Objeto\n

\n\n

Funções anônimas

\n\n

\n Funções anônimas são funções que são declaradas dinamicamente em tempo de execução. Elas são chamadas de funções anônimas devido ao fato de não receberem um nome, como as funções tradicionais.\n

\n\n

\n Fonte: JavaScript anonymous functions\n

\n\n

Funções como objetos de primeira classe

\n\n

\n Funções em JavaScript são funções de primeira classe. Isso significa que no JavaScript as funções são um tipo especial de objeto que podem fazer todas as coisas que um objeto normal pode fazer.\n

\n\n

\n Fonte: Functions are first class objects in JavaScript\n

\n\n

Tipagem fraca

\n\n

\n Para muitos desenvolvedores front-end, o JavaScript foi o primeiro gostinho de uma linguagem de script e/ou de linguagem interpretada. Para esses desenvolvedores, os conceitos e implicações de variáveis de tipagem fraca podem ser naturais. Entretanto, o crescimento explosivo na demanda por aplicações web modernas resultou no crescimento do número de desenvolvedores back-end que tiveram que enfiar seus pés nas tecnologias de client-side. Muitos desses desenvolvedores estão chegando com conhecimentos de uma linguagem fortemente tipada, como c# ou Java, e não estão familiarizados com a liberdade e as armadilhas envolvidas em trabalhar com variáveis de tipagem fraca.\n

\n\n

\n Fonte: Understanding Loose Typing in JavaScript\n

\n\n

Escopos e elevação (hoisting)

\n\n

\n Escopos: Em JavaScript, funções são nosso delimitador de escopo de facto para declaração de variáveis, o que significa que blocos usuais de loops e estruturas condicionais (como if, for, while, switch e try) NÃO delimitam escopos, diferente de muitas outras linguagens. Portanto, esses blocos irão compartilhar do mesmo escopo que a função que os contém. Dessa forma, pode ser perigoso declarar variáveis dentro de blocos, já que irá parecer que a variável pertence apenas ao bloco.\n

\n\n

\n Elevação (hoisting): Em tempo de execução, todas as variáveis e declarações de funções são movidas para o início de cada função (seu próprio escopo) - isso é conhecido como elevação (hoisting). Dito isso, é uma boa prática declarar todas as variáveis juntas na primeira linha, a fim de evitar falsas expectativas em relação a uma variável que foi declarada depois mas que acabou recebendo um valor antes - esse é um problema comum para programadores vindos de linguagens com escopos em blocos.\n

\n\n

\n Fonte: JavaScript Scoping and Hoisting\n

\n\n

Binding de funções

\n\n

\n Binding de funções será provavelmente a última de suas preocupações quando estiver começando com o JavaScript, mas quando você perceber que precisa de uma solução para o problema de como manter o contexto do 'this' dentro de outra função, então você pode se dar conta do que realmente precisa é a função Function.prototype.bind().\n

\n\n

\n Fonte: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Funções de fechamento (Closures)

\n\n

\n Closures (fechamentos) são funções que se referem a variáveis livres (independentes). Em outras palavras, a função definida no closure \"lembra\" do ambiente em que ela foi criada.\n\n Esse é um importante conceito a ser entendido, pois pode ser muito útil durante o desenvolvimento, como emulando métodos privados. Também pode ajudar a aprender como evitar erros comuns, como criando closures em loops.\n

\n\n

\n Fonte: MDN - Closures\n

\n\n

Modo rigoroso

\n\n

\n O modo rigoroso do ECMAScript 5 é um modo de optar por uma variação restrita do JavaScript. O modo rigoroso não é apenas um subconjunto, ele intencionalmente tem a semântica diferente do código normal. Navegadores que não suportam o modo rigoroso irão executar o código com o comportamento diferente de navegadores que suportam, então não confie no modo restrito sem contar com testes de funcionalidades em aspectos relevantes do modo restrito. Modo rigoroso de código e não rigoroso podem coexistir, então scripts podem optar pelo modo rigoroso incrementalmente.\n

\n\n

\n Fonte: MDN - Strict mode\n

\n\n

Expressão de Função Invocada Imediatamente (IIFE - Immediately-Invoked Function Expression)

\n\n

\n Uma função imediata é um padrão que produz um escopo léxico usando os escopos de função do JavaScript. Funções imediatas podem ser usadas para evitar a elevação de variáveis (hoisting) dentro de blocos, protegendo o ambiente global de ser poluído e simultanamente permite o acesso público a métodos enquanto retém a privacidade para as variáveis declaradas dentro da função.

\n Esse padrão tem sido referenciado como função anônima de auto execução, mas @cowboy (Ben Alman) introduziu o termo IIFE como um termo mais semântico para o padrão.\n

\n\n

\n Fonte: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/pt-br/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: A forma certa por William Oliveira.
Licenciado sobre Creative Commons Atribuição-NãoComercial 4.0 Internacional.
Baseado no trabalho em http://jstherightway.org.\n

\n" }, { "path": "i18n/pt-br/partials/patterns.html", "content": "\n

Descrição

\n\n

\n Apesar de o JavaScript possuir padrões de projeto exclusivos da linguagem, outros padrões clássicos também podem ser implementados.\n

\n\n

\n Uma boa maneira de aprendê-los é ler o livro de código aberto Learning JavaScript Design Patterns do Addy Osmani. A maioria dos links abaixo são baseados nesse livro.\n

\n\n

Padrões de projeto (Design Patterns)

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n Existem algumas implementações do tradicional padrão MVC e sua variações no JavaScript.\n
\n\n
\n \n
\n" }, { "path": "i18n/pt-br/partials/testing-tools.html", "content": "

Descrição

\n\n

Várias bibliotecas e frameworks para fazer testes em JavaScript.

\n" }, { "path": "i18n/pt-br/partials/welcome.html", "content": "

Ei, você!

\n\n

\n Esse é um guia com a intenção de apresentar novos desenvolvedores ao JavaScript e ajudar desenvolvedores experientes a aprenderem mais sobre as melhores práticas.\n

\n\n

\n Apesar do nome, esse guia não significa necessariamente \"o único caminho\" em JavaScript.\n

\n\n

\n Nós apenas juntamos todos os artigos, dicas e artimanhas dos desenvolvedores top e colocamos aqui. Uma vez que esse material vem de pessoas excepcionais, nós podemos dizer que é \"a forma certa\", ou a melhor forma de fazer.\n

\n" }, { "path": "i18n/pt-br/pt-br.json", "content": "{\n \"meta\": {\n \"title\":\"JS: A forma certa\",\n \"description\":\"Uma referência rápida para as melhores práticas de como escrever JavaScript -- links para padrões de código e tutoriais de toda a web\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"Escolha seu caminho\",\n \"links\": [\n {\n \"title\":\"Começando\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"Estilo de códigos JavaScript\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"As partes boas\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"Padrões\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"Ferramentas de teste\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"Frameworks\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"Motores de jogos\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"Novidades\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"Leitura\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"Podcasts\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"Screencasts\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"Quem seguir\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"Provedores de PaaS\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"Helpers\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"INICIANDO\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"ESTILOS DE CÓDIGO JS\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"AS PARTES BOAS\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"PADRÕES\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"FERRAMENTAS DE TESTES\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"Mantida por TJ Holowaychuk\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"Mantida por jQuery\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"Mantida por Pivotal Labs\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"Mantida pelo time por trás do AngularJS. Em maior parte por Vojta Jina\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"Mantida por Sitepen\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"Uma ferramenta de cobertura de código JavaScript escrita em JavaScript, mantida por Krishnan Anantheswaran\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"Espiões de teste standalone, stubs (esboços) e mocks (simulação/imitação) para JavaScript. Sem dependências, funciona com qualquer framework de testes unitários. Criado por Sinon.JS community\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"Um helper de testes para fazer mocks de funções e de objetos XHR, mantido por Leo Balter\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"FRAMEWORKS\",\n \"cat\":[\n {\n \"title\":\"PROPOSTA GERAL\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery é uma biblioteca JavaScript rápida, pequena e cheia de recursos. Criada por John Resig.\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"Criado pelo Yahoo!, YUI é uma biblioteca JavaScript e CSS de código aberto para criação de aplicações web ricas e interativas. Novas atualizações estão paradas desde 29 de Agosto de 2014.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto é uma biblioteca JavaScript minimalista para navegadores modernos com uma grande compatibilidade com a API do jQuery. Se você usa jQuery, você já sabe como usar o Zepto.\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo é um kit de ferramentas JavaScript grátis e de código aberto para criação de aplicações web de alto desempenho. Os patrocinadores do projeto incluem IBM e SitePen.\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js é uma biblioteca JavaScript que fornece uma enorme quantidade de helpers úteis sem estender qualquer objeto interno.\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"Framework JavaScript client-side muito popular, criado por @jashkenas.\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"Criado por @wycats, desenvolvedores do núcleo do jQuery e Ruby on Rails .\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"Simplifica interfaces de cliente dinâmicas criadas em JavaScript aplicando o modelo Model-View-View (MVVM).\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"Criado pelo Google, Angular.js é como um polyfill para o futuro do HTML.\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"Um framework.Mobile & desktop. Uma maneira de criar aplicativos com o Angular e usar seu código e habilidades para criar aplicativos para cada meta de implantação. Para web, web móvel, telefone móvel nativo e desktop nativo.\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino é um framework de código aberto que torna fácil a criação de aplicações parecidas com desktop que rodam em um navegador.\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC é um framework de código aberto que contém as melhores ideias no desenvolvimento do jQuery.\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor é uma plataforma de código aberto para criação rápida de aplicações web de alta qualidade, seja você um desenvolvedor experiente ou que está apenas começando.\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://www.3den.org/spicejs\",\n \"description\":\"Spice é um framework MVC em JavaScript minúsculo (< 3k) e flexível. Spice foi construido para ser fácil de ser adicionado em qualquer aplicação existente e funciona bem com outras tecnologias como jQuery, pjax, turbolinks, node ou qualquer outra coisa que você esteja usando.\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot é uma biblioteca client-side (MV*) incrivelmente rápida, potente e pequena para criar aplicações web de grande escala. Apesar do tamanho pequeno todos os blocos de construção estão lá: um motor de templates, rotas, biblioteca de eventos e um padrão MVP rígido para manter as coisas organizadas.\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS é um framework JavaScript que simplifica e agiliza o desenvolvimento de aplicações complexas. Fácil de aprender, pequeno e com uma estrutura modesta, mas com características modernas como tags customizadas e com binding de duas vias.\"\n }\n ]\n },\n {\n \"title\":\"Biblioteca\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"Criado pelo Facebook. React é uma biblioteca JavaScript para criação de interfaces de usuários do Facebook e do Instagram. Muitas pessoas enxergam o React como o V do MVC.\"\n },\n {\n \"name\":\"Vue.js\",\n \"url\":\"http://www.vuejs.org\",\n \"description\":\"É uma biblioteca MVVM que provê two-way data binding, adiciona comportamento adicional ao HTML (através de diretivas) e componentes reativos. Ao utilizar add-ons nativos o desenvolvedor pode também contar com rotas, AJAX, gerenciamento de fonte de dados ao estilo Flux, validação de formulários e mais. Provê uma extensão para Chrome que é muito útil para inspecionar componentes construídos com Vue.\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars fornece de forma eficaz o poder necessário para você criar templates semânticos sem frustrações.\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"Templates assíncronos para o navegador e para node.js.\"\n }\n ]\n },\n {\n \"title\":\"Animação\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity é um motor de animações com a mesma API $.animate() do jQuery.\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js é uma biblioteca JavaScript e uma ferramenta que permite você criar lindas animações em CSS3.\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"Uma biblioteca JavaScript simples mas poderosa para interpolar e animar propriedades HTML5 e JavaScript.\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js é uma biblioteca JavaScript pequena que torna animações em CSS3 super simples e elegantes.\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG é uma excelente forma de criar gráficos vetoriais interativos e independentes de resolução que ficam ótimos em qualquer tamanho de tela.\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi é uma biblioteca para fazer animações canvas e DOM com JavaScript, assim como animações @keyframe do CSS, para navegadores modernos.\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"Faça uso do seu favicon com emblemas, imagens ou vídeos.\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js combina algumas bibliotecas impressionantes para fornecer um plugin fácil de usar para aplicar animações CSS3 em qualquer texto.\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio é uma pequena biblioteca JavaScript para uma simples porém poderosa animação baseada em sprites e panning (panorâmica).\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"MOTORES DE JOGOS\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS é um motor de jogos leve e grátis. O motor integra o formato tiled map, tornando o level design mais fácil.\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS é um dos motores de jogos mais \\\"testados e aprovados\\\" em HTML5, com sua primeira publicação no final de 2010. Ele é muito bem mantido e atualizado, conta com uma boa comunidade dando suporte. A documentação é boa e conta com dois livros falando sobre criação de jogos com esse motor.\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS é um framework de jogos em HTML5 para criação rápida de jogos com experiência nativa para navegadores modernos e dispositivos touch.\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty é um motor de jogo lançado no final de 2010. Crafty torna realmente fácil começar a desenvolver jogos com JavaScript.\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5 é um framework de código aberto para desenvolvimento de jogos web em 2D, lançado sob a licença MIT. É uma versão HTML5 do projeto Cocos2d-x. O foco para o desenvolvimento do Cocos2d-html5 está em torná-lo multiplataforma entre navegadores e aplicações nativas.\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser é baseado fortemente no Flixel. É mantido por Richard Davey (Photon Storm) que tem sido bem ativo por anos na comunidade HTML5.\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo é um motor de jogos JavaScript 3D feito inteiramente em WebGL/HTML5\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS é uma biblioteca de jogos em JavaScript que oferece uma solução completa para prototipação e desenvolvimento de HTML5 Canvas, WebGL ou OpenGL(ES) nativo, baseado no navegador ou em ambientes nativos.\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus é um motor de jogos HTML5 projetado para ser modular e leve, com uma sintaxe concisa e bem próxima ao JavaScript.\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js é um motor de jogos de código aberto. Algumas pessoas o chamam de o WordPress dos motores de jogos HTML5.\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js é um motor de jogos em HTML5 para dispositivos mobile e desktop com renderização de Canvas e WebGL.\"\n },\n {\n \"name\":\"Isogenic\",\n \"url\":\"http://www.isogenicengine.com/\",\n \"description\":\"Isogenic é um motor de jogos que fornece as mais avançadas funcionalidades de rede e multiplayer em tempo real disponíveis em qualquer motor de jogos HTML 5. O sistema é baseado em streaming de entidades e inclui opções poderosas de simulação e interpolação de entidades no client a partir de delta updates.\"\n }\n ]\n },\n \"news\":{\n \"title\":\"NOVIDADES\",\n \"cat\":[\n {\n \"title\":\"Websites\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Newsletter\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"LEITURA\",\n \"cat\":[\n {\n \"title\":\"Artigos\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Entendendo POO em JavaScript\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"por Quildreen Motta\"\n },\n {\n \"name\":\"Entendendo “Protótipos” em JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"por Yehuda Katz\"\n },\n {\n \"name\":\"Protótipos e Herança em JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"por Scott Allen\"\n },\n {\n \"name\":\"Aplicações Parciais em JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"por Ben Alman\"\n },\n {\n \"name\":\"Superando o jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"por Nico Bevacqua\"\n },\n {\n \"name\":\"Um mergulho em JavaScript puro\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"por Viljami S.\"\n },\n {\n \"name\":\"Uma olhada mais profunda em JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"por Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introdução ao Easing (atenuação) em JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"por Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Como aprender JavaScript da forma correta\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"por JavaScript Is Sexy\"\n },\n {\n \"name\":\"Como começar com JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"por Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"Livros\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"JavaScript Eloquente\",\n \"url\":\"https://github.com/braziljs/eloquente-javascript\",\n \"description\":\"por Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: O Guia Definitivo\",\n \"url\":\"http://www.buscape.com.br/javascript-o-guia-definitivo-david-flanagan-856583719x.html\",\n \"description\":\"por David Flanagan\"\n },\n {\n \"name\":\"O melhor do JavaScript\",\n \"url\":\"http://www.buscape.com.br/o-melhor-do-javascript-douglas-crockford-8576082799.html\",\n \"description\":\"por Douglas Crockford\"\n },\n {\n \"name\":\"Padrôes JavaScript\",\n \"url\":\"http://www.buscape.com.br/padroes-javascript-construa-aplicacoes-mais-robustas-usando-padroes-de-projeto-e-programacao-stoyan-stefanov-857522266x.html\",\n \"description\":\"por Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"por James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"por Nicholas C. Zakas\"\n },\n {\n \"name\":\"Javascript de Alto Desempenho\",\n \"url\":\"http://www.buscape.com.br/javascript-de-alto-desempenho-nicholas-c-zakas-8575222414.html\",\n \"description\":\"por Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"por Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"por Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"por Dustin Diaz\"\n },\n {\n \"name\":\"Segredos do Ninja JavaScript\",\n \"url\":\"http://www.buscape.com.br/segredos-do-ninja-javascript-john-resig-bear-bibeault-8575223283.html\",\n \"description\":\"por John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"por Nicolas Bevacqua\"\n },\n {\n \"name\":\"Speaking JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"por Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"por Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"por >Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"por Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"por Ivo Wetzel\"\n },\n {\n \"name\":\"Effective JavaScript\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"por David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascript-allonge\",\n \"description\":\"por Reginald Braithwaite\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"por DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"E-Books grátis\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Portais\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"https://developer.mozilla.org/pt-BR/docs/Web/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io/pt-br/\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix’s Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"Podcasts\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"http://javascriptjabber.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"Screencasts\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"QUEM SEGUIR\"\n },\n \"paasProviders\":{\n \"title\":\"PROVEDORES PaaS\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"Helpers\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"Criado e mantido por\",\n \"contributors\":\"Contribuidores\",\n \"contribDesc\":\"Este projeto não existiria sem esses maravilhosos contribuidores. Obrigado galera por tornarem isso real!\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n }\n}\n" }, { "path": "i18n/ru-ru/partials/code-style.html", "content": "

Условные обозначения

\n\n

\n Как любой другой язык, JavaScript имеет множество стилей кодирования. Возможно самый используемый и рекомендуемый это Руководство по оформлению Javascript кода от Google Code, но мы рекомендуем ознакомиться с Idiomatic.js.\n

\n\n

Валидация кода

\n\n

\n На сегодняшний день лучшим инструментом для статической валидации Javascript кода является JSHint. Мы рекомендуем всегда, когда возможно, использовать валидаторы (линтеры) для проверки вашего кода и правил оформления.\n

\n" }, { "path": "i18n/ru-ru/partials/getting-started.html", "content": "

О ЯЗЫКЕ

\n\n

\n Созданный компанией Netscape в 1995 как расширение HTML для браузера Netscape Navigator 2.0, Javascript имел в качестве основной функции - манипулирование HTML-документом и проверку данных в формах.\n\n До того, как он стал известен в мире под современным названием, Javascript назывался Mocha. Когда он выпустился в первой бета-версии он назывался LiveScript. Свое текущее название он приобрел только после выпуска компанией Sun Microsystems.\n\n Из-за похожести названий люди иногда путают Javascript и Java. Эти языки имеют похожий синтаксис, но в остальном они сильно отличаются.\n\n В отличии от C, C# и Java, Javascript - интерпретируемый язык. Это означает, что он нуждается в интепретаторе. В случае с Javascript интерпретатором является браузер.\n

\n\n

ТЕКУЩАЯ ВЕРСИЯ

\n\n

\n Стандарт Javascript называется ECMAScript. По состоянию на 2012 год, все современные браузеры полностью поддерживают ECMAScript 5.1. Более старые браузеры поддерживают по-крайней мере ECMAScript 3. В июне 2015 была утверждена спецификация ES6/ES2015. Следуя новому годовму релизному циклу, ES7/ES2016 был утвержден в июне 2016. Подробнее читайте о спецификации языка ECMAScript 2016 на сайтеEcma International.\n

\n\n

\n Отличное описание версий, ссылок и изменений JavaScript можно найти на сайте Mozilla Developer Network.\n

\n\n

DOM

\n\n

\n Объектная модель документа (DOM) - это API, дающее возможность работать с HTML и XML документами. Она обеспечивает структрурное представление документа, позволяя изменять содержимое и визуальное представление посредством скриптовых языков, таких как Javascript. Подробнее на странице Mozilla Developer Network - DOM.\n

\n" }, { "path": "i18n/ru-ru/partials/good-parts.html", "content": "

Объектно ориентированный

\n\n

\n Javascript имеет сильные объектно-ориентированные возможности. Несмотря на некоторые споры которые имеют место вокруг различий ООП в javascript по сравнению с другими языками.\n

\n\n

\n Подробнее: Введение в объектно-ориентированный JavaScript\n

\n\n

Анонимные функции

\n\n

\n Анонимные функции - функции которые динамически объявляются в процессе выполнения. Они называются анонимными потому, что они не именуются в отличии от обычных функций.\n

\n\n

\n Подробнее: Анонимные функции в JavaScript\n

\n\n

Функции как объекты первого класса

\n\n

\n Функции в Javascript - объекты первого класса. Это означает что функции это особый класс объектов, которые могут делать все тоже самое что могут делать обычные объекты.\n

\n\n

\n Подробнее: Функции как объекты первого класса в JavaScript\n

\n\n

Нестрогая типизация

\n\n

\n Для многих фронтенд разработчиков Javascript был первым опытом в скриптовых/интерпретируемых языках. Для этих разработчиков принцип и реализация нестрогой типизации может быть само собой разумеещимся.\n Однако взрывной рост популярности современных веб-приложений приводит к тому, что все большее число бэкенд разработчиков вынуждено погружаться в мир клиентских технологий. Многие из этих разработчиков приходят с опытом работы с типизироваными языками вроде C# или Java, и им кажутся странными как вольности допускаемые нестрогой типизацией, так и подводные камни, которые она в себе скрывает.\n

\n\n

\n Подробнее: Понимание нестрогой типизации в JavaScript\n

\n\n

Область видимости и всплытие определений

\n\n

\n Область видимости: В JavaScript, функции по-факту являются ограничениями области видимости при объявлении переменных.\n Это означает, что обычные блоки из циклов и условных выражений (такие как if, for, while, switch и try) НЕ ОГРАНИЧИВАЮТ область видимости, в отличии от большинства языков. Так что эти блоки имеют ту же самую область видимости, что и функции в которых они используются. Таким образом нужно быть внимательнее, объявляя переменные внутри блоков, так как может показаться, что переменные доступны только внутри блока (а это не так).\n

\n\n

\n \"Всплытие\": При выполнении все объявления переменных var и функций перемещаются в начало функции (перед ее \"телом\"). Это называется \"всплытием\"(hoisting). Так что хорошей практикой является объявление переменных в начале функции, чтобы явно задать область видимости и избежать двусмысленности, что возможно при объявлении переменных/функций ниже по коду. Это общая проблема для программистов, которые раньше писали на языках с блочной областью видимости.\n Это поведение получило корректировки в новом стандарте (ES6/ES2015 - почитайте про let/const).\n

\n\n

\n Подробнее: JavaScript - про всплытие и область видимости\n

\n\n

Контекст выполнения

\n\n

\n Контекст выполнения - это наименьшая из ваших проблем, когда вы начинаете работать с Javascript. Но однажды вы понимаете, что решение проблемы, которая у вас есть, заключается в вызове другой функции с сохранением текущего контекста. И вот в этот момент вы поймете, что Function.prototype.bind() - это то, что вам нужно. А еще вы можете почитать про \"стрелочные функции\" из нового стандарта Javascript.\n

\n\n

\n Подробнее: Что такое Function.prototype.bind в JavaScript\n

\n\n

Замыкания

\n\n

\n Замыкания - это функции, которые ссылкаются на переменные вне себя. Другими словами функции посредством замыкания получают доступ к переменным, которые доступны в месте объявления функции.\n Очень важно это понимать, так как это часто используется при разработке, пример для эмуляции приватных методов. Это так же будет полезно, чтобы избежать частых ошибок, например создание замыканий в циклах.\n

\n\n

\n Подробнее: MDN - Замыкания\n

\n\n

Строгий режим

\n\n

\n Строгий режим из 5-й редакции ECMAScript - это способ органичить возможности Javascript. Строгий режим - не просто подмножество, он намеренно ограничивает возможности вашего кода. Браузеры с поддержкой строгого режима и без нее будут обрабатывать ваш код по-разному, так что не стоит рассчитывать на строгий режим без соответствующего тестирования вашего кода в обоих случаях. Строгий и нестрогий режимы могут сосуществовать (например строгий режим может распространяться на отдельные функции), так что переписывать свой код под строгий режим можно постепенно.\n

\n\n

\n Подробнее: MDN - Строгий режим\n

\n\n

Самовызывающиеся функции (IIFE)

\n\n

\n Самовызывающиеся функции - это подход, который позволяет создать лексическое окружение использую функциональную область видимости в Javascript. Самовызывающиеся функции могут быть использованы, чтобы избежать всплытия переменных за пределы блока, предотвратить загрязнение глобальной области видимости и обеспечить доступ к публичным методам сохряняя недоступность данных, которые объявлены внутри функции.

\n Этот подход основывается на самовызывающихся анонимных функциях, но @cowboy (Ben Alman) ввел понятие IIFE как более семантически-верное для обозначения этого шаблона.\n

\n\n

\n Подробнее: Немедленно вызываемыми функциональные выражения (IIFE)\n

\n" }, { "path": "i18n/ru-ru/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: Правильный путь by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
На базе http://jstherightway.org.\n

\n" }, { "path": "i18n/ru-ru/partials/patterns.html", "content": "\n

Описание

\n\n

\n Javascript содержит достаточное колличество шаблонов, специфических для языка. Однако так же могут быть использованы многие классические шаблоны проектирования.\n

\n\n

\n Хорошим способом с этим разобраться будет чтение книги Addy Osmani Learning JavaScript Design Patterns (Изучение Шаблонов Проектирования Javascript), и ссылок ниже, которые частично взяты из книги.\n

\n\n

Шаблоны проектирования

\n\n
\n \n
\n\n

\n Порождающие шаблоны\n

\n\n
\n \n
\n\n

\n Структурные шаблоны\n

\n\n
\n \n
\n\n

\n Поведенческие шаблоны\n

\n\n

Шаблоны MV*

\n\n
\n Есть несколько реализаций традиционного MVC паттерна и его вариаций в Javascript.\n
\n\n
\n \n
\n" }, { "path": "i18n/ru-ru/partials/testing-tools.html", "content": "

Описание

\n\n

Различные библиотеки и фреймворки для тестирования кода на JavaScript.

\n" }, { "path": "i18n/ru-ru/partials/welcome.html", "content": "

Привет!

\n\n

\n Это руководство призвано ввести в курс новичков в Javascript и помочь опытным разработчикам больше узнать и лучших практиках и подходах.\n

\n\n

\n Несмотря на название, это руководство не обязательно означает \"Единственно верный\" способ работать с JavaScript.\n

\n\n

\n Просто мы решили собрать все статьи, советы и секреты от ведущих разработчиков в одном месте. Так как мы говорим о выдающихся людях, мы можем сказачать что это \"правильный путь\", или лучший способ делать подобные вещи.\n

\n" }, { "path": "i18n/ru-ru/ru-ru.json", "content": "{\n \"meta\": {\n \"title\":\"JS: Правильный путь\",\n \"description\":\"Краткий справочник по лучшим практикам написания кода на JavaScript -- ссылки на типовые решения и обучающие материалы из Сети\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"Выбери свой путь\",\n \"links\": [\n {\n \"title\":\"С чего начать\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"JavaScript - стиль написания кода\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"Сильные стороны\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"Типовые решения\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"Инструменты для тестирования\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"Фреймворки\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"Игровые движки\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"Новости\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"К прочтению\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"Подкасты\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"Скринкасты\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"За кем стоит понаблюдать\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"PaaS ресурсы\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"Полезности\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"С ЧЕГО НАЧАТЬ\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"JS - СТИЛЬ НАПИСАНИЯ КОДА\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"СИЛЬНЫЕ СТОРОНЫ\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"ТИПОВЫЕ РЕШЕНИЯ\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"ИНСТРУМЕНТЫ ДЛЯ ТЕСТИРОВАНИЯ\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"Поддерживается TJ Holowaychuk\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"Поддерживается jQuery\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"Поддерживается Pivotal Labs\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"Поддерживается командой АнгуларJS. По-большей части Vojta Jina\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"Поддерживается Sitepen\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"Независимый набор тестовых 'шпионов', моков и заглушек для JavaScript. Без зависимостей, работает с любым тестовым фреймворком. Создан Sinon.JS community\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"Вспомогательные утилиты для мока функций Javascript и объекта XHR, поддерживается Leo Balter\"\n },\n {\n \"name\":\"AVA\",\n \"url\":\"https://github.com/sindresorhus/ava\",\n \"description\":\"Тест-ранер (утилита для запуска тестов) с асинхронными тестами, поддерживается Sindre Sorhus\"\n },\n\t{\n\t \"name\":\"Jest\",\n\t \"url\":\"https://github.com/facebook/jest\",\n\t \"description\":\"Безболезненное тестирование Javascript, поддерживается Facebook\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"ФРЕЙМВОРКИ\",\n \"cat\":[\n {\n \"title\":\"ОБЩЕГО НАЗНАЧЕНИЯ\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery - это быстрая, маленькая библиотека с богатым функционалом. Создана John Resig.\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"Создан Yahoo!, YUI - бесплатная библиотека с открытым исходным кодом. Использует набор решений на JavaScript и CSS для построения интерфейса интерактивных веб приложений. Разработка прекращена 29го августа 2014.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto - минималистичная JavaScript библиотека для современных браузеров. По-большей части имеет jQuery-совместимое API. Если вы пользовались jQuery, то вы уже знаете как работать с Zepto.\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo - бесплатный инструмент с открытым исходным кодом для построения высокопроизводительных веб-приложений. Проект спонсируется IBM и SitePen.\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js - JS библиотека, которая предоставляет полный набор разнообразных вспомогательных функций без изменения встроенных объектов.\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"Очень популярный JavaScript клиент-серверный фреймворк, созданый @jashkenas.\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"Создан @wycats, который явялется значимым разрабочиком jQuery и Ruby on Rails.\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"Упрощает построение динамических интерфейсов посредством использования паттерна Model-View-View Model (MVVM).\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"Создан командой из Google. Angular.js похож на полифилл для будущих версий HTML.\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"Framework.Mobile и рабочий стол. Один из способов создания приложений с угловым и использовать навыки и программный код для создания приложений для каждой цели развертывания. Для веб-страниц, мобильный Интернет, мобильный телефон родной и родной рабочий стол.\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino проект с открытым кодом, который подзволяет легко создавать приложения, похожие на десктопный, но так чтобы они работали в браузере.\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC проект с открытым кодом который сочетает в себе лучшие идеи разработки на jQuery.\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor - opensource проект для создания высококачественных веб-приложений. Доступен как опытным разработчикам так и новичкам.\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://spicejs.github.io/spicejs/\",\n \"description\":\"Spice - супер минималистичный (< 3k) и гибкий MVC фреймворк для javascript. Spice был создан для быстрого добавления к существующим приложениям и хорошо сочетается с jQuery, pjax, turbolinks, node или что там еще вами используется.\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot - невероятно быстрая, мощная и маленькая библиотека, для использования паттерна (MV*) в построении расширяемых веб приложений. Несмотря на маленький размер содержит все необходимое - шаблонизатор, роутер, событийную модель и строгий MVP для организации струтуры приложения.\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS - JavaScript фреймворк, который делает разработку сложнжых приложений простой и быстрой. Легкий в освоении, маленький, нетребовательный к архитектуре вашего приложения, но с современными подходыми вроде пользовательских тегов и двустороннего биндинга\"\n }\n ]\n },\n {\n \"title\":\"Библиотеки\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"Создана Facebook. React - это Javascript библиотека для создания пользовательского интерфейса в Facebook и Instagram. Многие люди предпочитают рассматривать React как V в MVC.\"\n },\n {\n \"name\":\"Vue.js\",\n \"url\":\"http://www.vuejs.org\",\n \"description\":\"MVVM библиотека обеспечивающая двустороннее связывание, расширение HTML посредством директив и реактивные компоненты. Использу я дополнения разработчик так же получает роутинг, AJAX запрос, Flux-подобное управление состоянием, валидацию форм и многое другое. В наличии полезное расширение для Chrome, позволяющее инспектировать компоненты созданные на Vue.\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars - мощный и гибкий инструмент, позволяющий создавать семантические шаблоны (с использованием компонент/вспомогательных тегов).\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"Асинхронный шаблонизатор для браузера и node.js.\"\n }\n ]\n },\n {\n \"title\":\"Анимации\",\n \"links\":[\n {\n \"name\":\"GSAP\",\n \"url\":\"http://greensock.com/\",\n \"description\":\"GSAP самый быстрый и полнофункциональный инструмент. Он во многих случаях даже быстрее CSS3 анимаций и переходов.\"\n },\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity - библиотека для анимации с тем же API что и $.animate() из jQuery.\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js - библиотека позволяющая задавать анимации, на базе CSS3.\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"Простая, но мощная, Javascript библиотека для изменения и анимирования HTML5.\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js - маленькая JavaScript библиотека делающая анимации на базе CSS3 простыми и элегантными.\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG - прекрасный способ реализовать взаимодествие с пользователем, векторная графика, которая не зависит от разрешения и размера экрана.\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi - библиотека для создания анимаций на базе canvas или DOM, так же хорошо как CSS @keyframe анимации в современных браузерах.\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"Позволяет использовать в качестве favicon спрайты, картинки или видео.\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js - набор прикрасных библиотек предоставляющий легкие в использовании расширения для применения CSS3 анимаций к любому тексту.\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio - маленькая JavaScript библиотека для простых, но мощных анимаций и панарам на базе спрайтов.\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"ИГРОВЫЕ ДВИЖКИ\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS - бесплатный и легковесный HTML5 игровой движек. Движек интеграрован с тайловыми картами, что делает разработку уровней еще проще.\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS - один из самый провереных и надежных движков для создания игр на HTML5. Первая версия вышла еще в конце 2010 года. Он прекрасно поддерживается и регулярно обновляется, имеет приличных размеров сообщество, которое его поддерживает. Сущестует достаточное колличество документации - даже две книги по созданию игр на этом движке.\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS - это фреймворк для создания быстрых HTML5 игр, с качественной поддержкой сенсорных экранов и десктопных браузеров.\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty - игровой движек, который берет начало из конца 2010 года. Его создали чтобы начать делать игры на Javascript было действительно просто.\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5 - игровой 2D движек с открытым исходным кодом, распространяется под MIT лицензией. Это HTML5 версия проекта Cocos2d. Основное внимание при разработке Cocos2d-html5 уделено тому, чтобы сделать проект кроссплатформенным и доступным в разных браузерах и мобильных приложениях.\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser в большой степени опирается на Flixel. Он поддерживается Richard Davey (Photon Storm), который долгие годы был очень активным участником HTML5 сообщества.\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo - это 3D игровой движек на JavaScript полностью построенный на WebGL/HTML5\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS - это JavaScript библиотека, предлагающая комплексное решение для создания и развертывания прототипов HTML5 игр с использованием Canvas, WebGL или нативного OpenGL(ES). Поддерживаются как игры для веб-браузеров так и для мобильных приложений.\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus - это игровой движек для HTML5. Легковесный, модульный, с понятным Javascript API.\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js - забавный и дружелюбный игровой движек с открытым исходным кодом. Некоторые называют его WordPress в мире игровых движков для HTML5.\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js - это игровой движек для HTML5 под мобильные устройства и десктопные браузеры с поддержкой рендеринга через Canvas и WebGL.\"\n },\n {\n \"name\":\"Rot.js\",\n \"url\":\"https://github.com/ondras/rot.js\",\n \"description\":\"Rot.js - набор Javascript библиотек, призваный помочь с разработкой ролевых игр (roguelike) для браузеров.\"\n },\n {\n \"name\":\"Isogenic\",\n \"url\":\"http://www.isogenicengine.com/\",\n \"description\":\"Isogenic - продвинутый игровой движек, который обеспечивает поддержку соверменных сетей и возможностей HTML5 для разработки многопользовательских игр c взаимодействием в реальном времени. Система основана на потоковой передаче данных и включает в себя мощные возможности по моделированию на стороне клиента на основе дельт-обновлений (передача изменений состояния).\"\n }\n ]\n },\n \"news\":{\n \"title\":\"Где можно следить за новостями?\",\n \"cat\":[\n {\n \"title\":\"Вебсайты\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Рассылки\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"Что стоит прочитать?\",\n \"cat\":[\n {\n \"title\":\"Статьи\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Understanding JavaScript OOP\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"by Quildreen Motta\"\n },\n {\n \"name\":\"Understanding “Prototypes” in JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"by Yehuda Katz\"\n },\n {\n \"name\":\"Prototypes and Inheritance in JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"by Scott Allen\"\n },\n {\n \"name\":\"Partial Application in JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"by Ben Alman\"\n },\n {\n \"name\":\"Getting Over jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"by Nico Bevacqua\"\n },\n {\n \"name\":\"A Dive Into Plain JavaScript\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"by Viljami S.\"\n },\n {\n \"name\":\"A Deeper Look at Objects in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"by Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introduction to Easing in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"by Kirupa Chinnathambi\"\n },\n {\n \"name\":\"How to Learn JavaScript Properly\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"by JavaScript Is Sexy\"\n },\n {\n \"name\":\"How to Start with JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"by Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"Книги\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Eloquent JavaScript\",\n \"url\":\"http://eloquentjavascript.net\",\n \"description\":\"by Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: The Definitive Guide\",\n \"url\":\"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\":\"by David Flanagan\"\n },\n {\n \"name\":\"JavaScript: The Good Parts\",\n \"url\":\"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\":\"by Douglas Crockford\"\n },\n {\n \"name\":\"JavaScript Patterns\",\n \"url\":\"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\":\"by Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"by James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"by Nicholas C. Zakas\"\n },\n {\n \"name\":\"High Performance JavaScript\",\n \"url\":\"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\":\"by Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"by Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"by Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"by Dustin Diaz\"\n },\n {\n \"name\":\"Learning JavaScript Design Patterns\",\n \"url\":\"https://addyosmani.com/resources/essentialjsdesignpatterns/book/\",\n \"description\":\"by Addy Osmani\"\n },\n {\n \"name\":\"Secrets of the JavaScript Ninja\",\n \"url\":\"http://jsninja.com\",\n \"description\":\"by John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"by Nicolas Bevacqua\"\n },\n {\n \"name\":\"Speaking JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"by Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"by Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"by Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"by Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"by Ivo Wetzel\"\n },\n {\n \"name\":\"Effective JavaScript\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"by David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascriptallongesix\",\n \"description\":\"by Reginald Braithwaite\"\n },\n {\n \"name\":\"Exploring ES6\",\n \"url\":\"http://exploringjs.com/es6/\",\n \"description\":\"by Axel Rauschmayer\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"by DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"Бесплатные электронные книги\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"Порталы\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix’s Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"Подкасты\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"https://devchat.tv/js-jabber/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n },\n {\n \"name\":\"JavaScript Air\",\n \"url\":\"http://javascriptair.com/\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"Скринкасты\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"К кому стоит присмотреться\"\n },\n \"paasProviders\":{\n \"title\":\"Облачные сервисы\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com/en/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"Утилиты\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"Webpack\",\n \"img\":\"webpack-logo.png\",\n \"url\":\"https://webpack.github.io/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Rollup\",\n \"img\":\"rollup-logo.png\",\n \"url\":\"http://rollupjs.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browserify\",\n \"img\":\"browserify-logo.png\",\n \"url\":\"http://browserify.org/\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"Создано и поддерживается\",\n \"contributors\":\"Участники\",\n \"contribDesc\":\"Этот проект не существовал бы без этих замечательных людей. Спасибо, ребята, что воплотили его в жизнь!\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n },\n \"languages\": [\n {\"url\":\"pt-br\",\"name\":\"Português\"},\n {\"url\":\"ko-kr\",\"name\":\"한국어\"},\n {\"url\":\"es-es\",\"name\":\"Español\"},\n {\"url\":\"de-de\",\"name\":\"German\"},\n {\"url\":\"en-us\",\"name\":\"English\"},\n {\"url\":\"zh-tw\",\"name\":\"繁體中文\"},\n {\"url\":\"zh-cn\",\"name\":\"简体中文\"},\n {\"url\":\"fa-ir\",\"name\":\"فارسی\"},\n {\"url\":\"ru-ru\",\"name\":\"Русский\"}\n ]\n}\n" }, { "path": "i18n/zh-cn/partials/code-style.html", "content": "

编程风格规范

\n\n

\n JavaScript 和其他编程语言一样，有各种版本的编程风格指南。或许大家会推荐 Google Code Style Guide for JavaScript，但我们更推荐 Idiomatic.js\n

\n\n

代码检查

\n\n

\n 现在最好的 JavaScript 代码检查工具为 JSHint。我们强烈建议尽可能的使用检查工具来确认你的编码风格以及设计模式的正确性。\n

\n" }, { "path": "i18n/zh-cn/partials/getting-started.html", "content": "

关于

\n\n

\n 由网景公司在 1995 年给网景浏览器2.0创建的一个当做 HTML 扩展，JavaScript 最初主要的功能就是操作 HTML 文档和验证表单。 在取得这么大的名声之前，JavaScript 被叫做 Mocha，当它第一次发布 beta 版本时它的官方名字是 LiveScript，当被 Sun Microsystems 发布时，被称作这个名字一直到今天。 由于相似的名字，人们老是把 JavaScript 和 Java搞混。虽然两者都有编程的语法结构，但是他们是不同的语言。 和C、C#、Java不同， JavaScript 是一个脚本语言，也就是说他需要一个“解释器”，JavaScript的解释器就是浏览器。\n

\n\n

最新版本

\n\n

\n ECMAScript 是 JavaScript 的标准。截至2012年止，所有最新流行的浏览器都可以支持 ECMAScript 5.1。老的浏览器至少会支持 ECMAScript 3。2015年6月 ES6/ES2015 规范已完成。前往阅读 ECMAScript 2015 规范 Ecma International.\n

\n\n

\n JavaScript 的最佳参考版本、参考资料及最新消息可以前往 Mozilla Developer Network.\n

\n\n

DOM

\n\n

\n Document Object Model (DOM) 是 HTML 及 XML 文档的 API。它提供了文件的结构化展现，让你可以使用脚本语言（如 JavaScript）來更改它的內容及视觉展现。其他更详细的內容 Mozilla Developer Network - 文件对象模型（DOM）.\n

\n" }, { "path": "i18n/zh-cn/partials/good-parts.html", "content": "

面向对象

\n\n

\n JavaScriot 虽然和其他语言在面向对象上面有些不同的地方，但仍然具有面向对象的编程能力。\n

\n\n

\n 资源: JavaScript 面向对象编程介绍\n

\n\n

匿名函数

\n\n

\n 匿名函数是在代码运行时动态声明的函数。之所以叫做匿名函数是因为他跟其他函数不同，它并没有函数名称。\n

\n\n

\n 资源: JavaScript anonymous functions\n

\n\n

函数作为第一类对象

\n\n

\n 函数是 JavaScript 的一等对象。这意味着 JavaScript 中的函数只是一种特殊类型的对象，并拥有一般对象所具备的能力。\n

\n\n

\n 资源: Functions are first class objects in JavaScript\n

\n\n

弱类型

\n\n

\n 对于许多前端开发者而言，JavaScript 是他们所使用的第一个脚本语言和/或解释语言, 对这些开发者来说，弱类型的概念和含义或许像第二天性一样自然; 然而现在网页应用的需求爆炸式增长，致使越来越多的后端开发者必须顾及客户端技术, 大部分此类开发者有强类型语言的背景, 例如 C# 或 Java,因此并不熟悉弱类型语言所带来的高度自由及潜在的缺陷。\n

\n\n

\n 资源: Understanding Loose Typing in JavaScript\n

\n\n

作用域和提升

\n\n

\n 作用域： 在 JavaScript 中，函数是我们在声明变量时, 实际的作用域分隔符, 也就是说常见的循环及表达式（如 if, for, while, switch 及 try）并“不能“指定作用域, 这一点有别于大部分的程序语言。因此函数中的这些区块会共享作用域, 这样使得在这些区块内部声明只属于这些函数块的变量行为可能是危险的。\n

\n\n

\n 变量提升： 在运行时，所有的变量及函数声明将会被移到函数的起始位置（它的作用域）- 这就是所谓的变量提升。这么说，在作用域的一开始就声明所有变量，以避免因未声明就操作变量造成的未预期错误是一个好的实践。 -这是一个习惯使用支持块级作用域语言的开发者经常遇到的问题。\n

\n\n

\n 资源: JavaScript Scoping and Hoisting\n

\n\n

函数绑定

\n\n

\n 函数绑定最有可能是 JavaScript 初学者最少关心的问题, 但当你意识到你需要一个解决方案以在另一个函数中保持 this 的上下文环境时, 你可能会了解到你真需要的其实是函数原型绑定（Function.prototype.bind()）。\n

\n\n

\n 资源: Understanding JavaScript’s Function.prototype.bind\n

\n\n

闭包函数

\n\n

\n 闭包是引用独立(自由)变量的函数。换句话说, 闭包中定义的函数会“记住”它被创建时的环境。理解这个概念很重要, 因为它在开发过程中是有用的, 类似模拟的私有方法。它也可以帮助你学习如何避免一些常见的错误，例如在循环中使用闭包。\n\n

\n\n

\n 资源: MDN - Closures\n

\n\n

严格模式

\n\n

\n ECMAScript 5 的严格模式是一种可选的使用严格变量的 JavaScript 方式。严格模式并非只是一个子集：它特意地在语法上有别于一般的代码。各家浏览器对严格模式的支持也不同, 所以开启严格模式时建议进行功能测试。严格模式的代码与非严格模式的代码是可以并存的, 所以可以自由決定严格模式部分的多少。\n

\n\n

\n 来源: MDN - Strict mode\n

\n\n

立即调用函数 (IIFE)

\n\n

\n 一个立即调用函数表达式是采用 JavaScript 的函数作用域产生一个词法作用域的模式。立即调用函数可避免变量从其所在的块内提升到上面的块, 以避免污染全局环境, 并可使用公共方法访问它,同事保留隐私。

\n 这种模式被称为自执行匿名函数，但 @cowboy (Ben Alman) 为它定义了语义上更合适的名字 IIFE 。\n

\n\n

\n 资源: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/zh-cn/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n" }, { "path": "i18n/zh-cn/partials/patterns.html", "content": "\n

说明

\n\n

\n 虽然 JavaScript 有其独有的设计模式，但许多经典的设计模式仍然是可以实现的。\n\n

\n\n

\n Addy Osmani 的开源书 Learning JavaScript Design Patterns 是很好的学习资料，下面大多数的链接都出自本书。\n

\n\n

设计模式

\n\n
\n \n
\n\n

\n 创建型设计模式\n

\n\n
\n \n
\n\n

\n 结构性设计模式\n

\n\n
\n \n
\n\n

\n 行为设计模式\n

\n\n

框架模式（MV* Patterns）

\n\n
\n 底下有一些 JavaScript 传统 MVC 模式及从中衍生出来的模式。\n
\n\n
\n \n
\n" }, { "path": "i18n/zh-cn/partials/testing-tools.html", "content": "

说明

\n\n

JavaScript 代码测试相关的函数库和框架。

\n" }, { "path": "i18n/zh-cn/partials/welcome.html", "content": "

嗨！你们好

\n\n

\n 这是一份为 JavaScript 新手准备的指南，同时也包含了可以给高手学习的最佳资料\n

\n\n

\n 虽然本网站的名字是 the right way,但并不代表是学习 JavaScript 的唯一方法。\n

\n\n

\n 我们只是将一些顶尖开发者的文章、提醒和技巧收集于此。由于它是由一些非常厉害的网名身上收集而来，故称之为 'the right way'或是最佳做法。\n

\n" }, { "path": "i18n/zh-cn/zh-cn.json", "content": "{\n \"meta\": {\n \"title\":\"JS: The Right Way\",\n \"description\":\"学习 JavaScript 的最佳快速指南 -- 来自网上的代码风格和教程链接\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"选择你想看的主题\",\n \"links\": [\n {\n \"title\":\"开始入门\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"JavaScript 代码风格\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"语言精粹\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"设计模式\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"测试工具\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"框架\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"游戏引擎\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"资讯\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"阅读\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"播客\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"拍客（Screencasts）\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"关注谁\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"PaaS 提供者\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"帮助\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"开始入门\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"JavaScript 代码风格\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"语言精粹\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"设计模式\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"测试工具\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"由 TJ Holowaychuk 维护。\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"由 jQuery 维护。\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"由 Pivotal Labs 维护。\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"由 the team behind AngularJS. Mostly by Vojta Jina 维护。\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"由 Sitepen 维护。\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"JavaScript 代码覆盖率工具，由 Krishnan Anantheswaran 维护。\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"JavaScript 独立测试套件 Test spy, stub 及 mock）。 不依赖于任何的单元测试框架。由 Sinon.JS community 创作。\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"模拟函数及 XHR 对象的测试帮助工具，由 Leo Balter 维护。\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"框架\",\n \"cat\":[\n {\n \"title\":\"热门\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery 是一个快速、轻巧及功能丰富的 JavaScript 库。由 John Resig 建立。\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"由 Yahoo 建立！ YUI 是一个免费、开源的 JavaScript 及 CSS 库，用于建立富交互的 web 应用。 已于 2014年8月29日停止更新.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto 是一个针对现在浏览器开发的，极简的 JavaScript 函数库，兼容大量的 jQuery API。只要你会用 jQuery，那么你已经会用 Zepto 了。\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo 是一个免费、开源的 JavaScript 工具包，用来建立高效能的网站应用。赞助商有 IBM 及 SitePen。\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js 是一个提供整套函数式编程的好工具，同时并不扩展原生 JavaScript 的库。\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"非常热门的 JavaScript 客户端框架，由 @jashkenas 建立。\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"由 @wycats 建立， jQuery 及 Ruby on Rails 核心开发者。\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"使用 Model-View-View Model (MVVM) 构建简单动态的 JavaScript 用户界面。\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"由 Google 建立，Angular.js 类似 polyfill 用于 HTML。\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"一个framework.Mobile和桌面。 一种使用Angular创建应用程序的方法，并使用您的代码和技能为每个部署目标创建应用程序。 对于web，移动网站，本机手机和本地桌面。\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino 是一个可以让人简单搭建运行在浏览器的桌面应用的开源框架。\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC 是一个包含 jQuery 最佳创意的开源框架。\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor 是一个不管菜鸟还是高手都可以在短时间内建立起高质量的网络应用的开源平台。\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://spicejs.github.io/spicejs/\",\n \"description\":\"Spice 是一个非常小（< 3k）且有可扩展性的 javascript MVC 框架。 Spice 可以轻松的融合任何已有的应用正在使用的技术如 jQuery、pjax、turbolinks、node 或是和任何你正在使用的技术共同顺利工作。\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot 是快速且功能强大的轻量客户端（MV*）函数库，用于创建大型的网络应用。 尽管它的体积很小，但却包含以下组成：模版引擎、路由、事件函数库及标准的 MVP 模式，让代码保持模块化。\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS 是一个可以让开发复杂应用程序变得简单且快速的框架。 学习简单、轻巧并且不改变你的应用结构，同时更提供一些新的功能，如自定义标签和双向绑定。\"\n }\n ]\n },\n {\n \"title\":\"函数库\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"由 Facebook 创建。 React 是一个 JavaScript 函数库，用于开发 Facebook 及 Instagram 的用户界面。 许多人认为 React 是 MVC 中的 V。\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars 让你可以无痛的建立有语义的模板。\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"浏览器和 node.js 的非同步模板。\"\n }\n ]\n },\n {\n \"title\":\"动画\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity 是一个和 jQuery 的 $.animate() 有相同 API 的动画引擎。\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js 是一个让你创造精美 CSS3 动画的工具及 JS 函数库。\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"一个简单且强大的 JavaScript 函数库，用来建立 HTML5 的。\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js 是一个基于 CSS3 极为简单又优雅 JavaScript 函数库。\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG 是一个专门处理交互、高解析度的矢量图，让各种大小的屏幕都能完美的呈现画面。\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi 不但是一个创建 canvas 及 DOM 动画的 JavaScript 函数库，同时也是新一代浏览器中的 CSS @keyframe 动画。\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"用标识、图片或视频来建立你喜爱的图标。\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js 结合许多写的不错的函数库来提供一个容易使用的的插件，让人可以在任何內容中使用 CSS3 的动画。\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio 是一个轻量的 JavaScript 函数库，基于动画和平移建立简单且强大的的 2D 动画。\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"游戏引擎\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS 是一个免费、轻量的游戏引擎。 这个引擎集成了地图拼接格式，让关卡设计变得更轻松。\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS 是从2010年底开始发布的可测试及运行的 HTML5 游戏引擎之一。 它保持良好的更新和维护，也用有一定的社区人员支持它。 它除了有两个关于如何使用此引擎建立游戏的书籍外，还有大量的文档可參考。\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS 是一个可以在各种触控屏幕及桌面浏览器上建立快速、原生体验游戏的 HTML5 游戏框架。\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty 是从 2010 年开始就存在的一个游戏引擎。 Crafty 开发 JavaScript 游戏变得相当容易。\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5 是一个 MIT 许可的开源 2D 游戏框架。 它是一个 HTML5 版本的 Cocos2d-x 计划。 Cocos2d-html5 的开发者终于让 Cocos2d 可以跨平台。\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser 依赖于 Flixel。 由已在 HTML5 社区活跃多年的 Richard Davey (Photon Storm) 维护。\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo 是一个基于 WebGL/HTML5 建立的 3D 游戏引擎。\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS 是一个 JavaScript 游戏函数库，提供原型及 HTML5 Canvas，WebGL 或 原生 OpenGL(ES) 在网络浏览器或本地环境部署的完整解決方案。\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus 是一个采用模块化设计的 HTML5 游戏引擎、轻量、使用容易具有简洁的 JavaScript 语法。\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js 是一个有趣且友善的开源 HTML5 游戏引擎。 有些人称它为 HTML5 游戏引擎界的 WordPress。\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js 是一个用于手机及电脑，使用 Canvas 和 WebGL 渲染的游戏引擎。\"\n }\n ]\n },\n \"news\":{\n \"title\":\"资讯\",\n \"cat\":[\n {\n \"title\":\"网站\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"订阅\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"阅读\",\n \"cat\":[\n {\n \"title\":\"文章\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Understanding JavaScript OOP\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"作者 Quildreen Motta\"\n },\n {\n \"name\":\"Understanding “Prototypes” in JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"作者 Yehuda Katz\"\n },\n {\n \"name\":\"Prototypes and Inheritance in JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"作者 Scott Allen\"\n },\n {\n \"name\":\"Partial Application in JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"作者 Ben Alman\"\n },\n {\n \"name\":\"Getting Over jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"作者 Nico Bevacqua\"\n },\n {\n \"name\":\"A Dive Into Plain JavaScript\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"作者 Viljami S.\"\n },\n {\n \"name\":\"A Deeper Look at Objects in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"作者 Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introduction to Easing in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"作者 Kirupa Chinnathambi\"\n },\n {\n \"name\":\"How to Learn JavaScript Properly\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"作者 JavaScript Is Sexy\"\n },\n {\n \"name\":\"How to Start with JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"作者 Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"书籍\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Eloquent JavaScript\",\n \"url\":\"http://eloquentjavascript.net\",\n \"description\":\"作者 Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: The Definitive Guide\",\n \"url\":\"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\":\"作者 David Flanagan\"\n },\n {\n \"name\":\"JavaScript: The Good Parts\",\n \"url\":\"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\":\"作者 Douglas Crockford\"\n },\n {\n \"name\":\"JavaScript Patterns\",\n \"url\":\"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\":\"作者 Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"作者 James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"作者 Nicholas C. Zakas\"\n },\n {\n \"name\":\"High Performance JavaScript\",\n \"url\":\"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\":\"作者 Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"作者 Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"作者 Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"作者 Dustin Diaz\"\n },\n {\n \"name\":\"Secrets of the JavaScript Ninja\",\n \"url\":\"http://jsninja.com\",\n \"description\":\"作者 John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"作者 Nicolas Bevacqua\"\n },\n {\n \"name\":\"Speaking JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"作者 Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"作者 Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"作者 >Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"作者 Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"作者 Ivo Wetzel\"\n },\n {\n \"name\":\"Effective JavaScript\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"作者 David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascript-allonge\",\n \"description\":\"作者 Reginald Braithwaite\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"作者 DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"免费电子书\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"入门学习网站\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix’s Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"播客\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"http://javascriptjabber.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"拍客（Screencasts）\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"关注谁\"\n },\n \"paasProviders\":{\n \"title\":\"PaaS 提供者\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com/en/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"帮助\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"网站创始兼维护者\",\n \"contributors\":\"贡献者\",\n \"contribDesc\":\"如果没有这些伟大的贡献者，本网站也无法完成。谢谢你们帮忙完成这个网站！\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n }\n}\n" }, { "path": "i18n/zh-tw/partials/code-style.html", "content": "

程式碼慣例

\n\n

\n JavaScript 和其他程式語言一樣，有各種版本的編碼風格指引。或許大家常會推薦 Google Code Style Guide for JavaScript，但我們更推薦 Idiomatic.js\n

\n\n

程式碼檢查

\n\n

\n 現今最好的 JavaScript 編碼檢查工具為 JSHint。我們強烈建議盡可能使用檢查工具來確認你的編碼風格及設計模式的正確性。\n

\n" }, { "path": "i18n/zh-tw/partials/getting-started.html", "content": "

關於

\n\n

\n 由 Netscape 於1995年為了 Netscape Navigator 針對 HTML 所開發的擴充套件，JavaScript 主要的功能為操作 HTML 文件及表單驗證。\n\n 在贏得今日的廣為人知的名字前，JavaScript 原名為 Mocha。在它發布第一次測試版時，官方將它命名為 LiveScript，最後在 Sun Microsystems 公布發行版時，被重新命名為今日廣為人知的名字。\n\n 由於 JavaScript 名字相近於 Java，所以常讓人搞混。雖然兩者在名字組成上有部分相同，但並不是相同的語言。\n\n 不同於 C、C# 及 Java，JavaScript 是直譯式語言。這意味者它需要一個“直譯器“。就 JavaScript 而言，瀏覽器就是它的直譯器。\n

\n\n

最新版本

\n\n

\n ECMAScript 是 JavaScript 的準則。截至2012年止，所有最新流行的瀏覽器都可以支援 ECMAScript 5.1。舊的瀏覽器至少會支援 ECMAScript 3。2015年6月 ES6/ES2015 準則已完成。前往閱讀 ECMAScript 2015 準則 Ecma International.\n

\n\n

\n JavaScript 的最佳參考版本、參考資料及最新消息可以前往 Mozilla Developer Network.\n

\n\n

DOM

\n\n

\n Document Object Model (DOM) 是 HTML 及 XML 文檔的 API。它提供了文件的結構化呈現，讓你可以使用腳本語言（如 JavaScript）來更改它的內容及視覺呈現。其他更詳盡的內容 Mozilla Developer Network - 文件物件模型（DOM）.\n

\n" }, { "path": "i18n/zh-tw/partials/good-parts.html", "content": "

物件導向

\n\n

\n JavaScript 即使跟其他語言在物件導向方面有些爭論的地方，但仍具有強烈物件導向的編程能力。\n

\n\n

\n 來源: JavaScript 物件導向介紹\n

\n\n

匿名函式

\n\n

\n 匿名函式是在程式運行時動態宣告的函式。之所以稱為匿名函式是因為它跟其他一般函式不同，它並沒有給予指定的函式名稱。\n

\n\n

\n 來源: JavaScript anonymous functions\n

\n\n

第一級物件為函式（function）

\n\n

\n 函式（function）是 JavaScript 的第一級物件。這意味著 JavaScript 中的函式（function）只是一種特殊型態的物件，並且能做到一般物件所能執行的行為。\n

\n\n

\n 來源: Functions are first class objects in JavaScript\n

\n\n

弱型別

\n\n

\n 對於許多前端開發者而言，JavaScript 是他們所使用的第一個腳本語言或是直譯語言。對這些開發者來說，弱型別變數的概念跟影響或許像是第二天性一般自然。然而現在網頁應用程式的爆炸性成長需求，使得後端開發者必需涉足客戶端技術。這類的開發者大部分都有強型別的語言背景，例如 C# 或是 Java，因此並不熟悉弱型別變數所給予的高度自由及潛在的陷阱。\n

\n\n

\n 來源: Understanding Loose Typing in JavaScript\n

\n\n

作用域及變數提升

\n\n

\n 作用域： 在 JavaScript 中，函式是我們在宣告變量時，實際的作用域分隔符，也就是說常見的迴圈及條件式（如 if, for, while, switch 及 try）並“不能“指定作用域，這一點是有別於大部分的程式語言。因此函式中的這些區塊將會共享相同的作用域。這樣使得在這些區塊內部宣告只屬於這些區塊的變量的行為變成可能是危險的。\n

\n\n

\n 變量提升： 在運行時，所有的變數及函式宣告將會被移至各函式的起始位置（即函式的作用域）- 這就是所謂的變量提升。雖然如此，但是良好的習慣還是在作用域的一開始就先宣告所有變量，避免因未宣告就操作變量造成未預期的錯誤。 - 這是一個習慣有區塊作用域語言開發者的常見問題。\n

\n\n

\n 來源: JavaScript Scoping and Hoisting\n

\n\n

函式綁定

\n\n

\n 剛開始學習 JavaScript 時，你可能不需花什麼時間在處理函式綁定上面，但你漸漸會遇到如何在另一個函式中保留 this 內容的問題，最終你會了解，你真正需要的其實是 函式原型綁定（Function.prototype.bind()）。\n

\n\n

\n 來源: Understanding JavaScript’s Function.prototype.bind\n

\n\n

閉包函式

\n\n

\n 閉包是參照獨立（自由）變量的函式。換句話說，閉包中所定義的函式會“保留“它被產生出來時的環境。\n 了解這個概念是很重要的，因為它在開發過程中是有用的，類似私有方法的功能。它也可以幫助你學習如何避免一些常見的錯誤，例如在迴圈中使用閉包。\n

\n\n

\n 來源: MDN - Closures\n

\n\n

嚴格模式

\n\n

\n ECMAScript 5 的嚴格模式是用來限制一些 JavaScript 不嚴謹的寫法。嚴格模式並非只是一個子集：它特地在語義上有別於一般的程式碼。各家瀏覽器對於嚴格模式有不同的支援度，所以在使用嚴格模式時，建議要進行功能測試。嚴格模式的程式碼與非嚴格模式的程式碼是可以並存的，所以可以自由決定嚴格模式部分的多寡。\n

\n\n

\n 來源: MDN - Strict mode\n

\n\n

立即調用函式 (IIFE)

\n\n

\n 立即調用函式是指使用 JavaScript 的函式來限制作用域範圍的模式。立即調用函式可以阻止區塊內的變量提升，保護區塊內的變量不被其他作用範圍的變量污染，同時也允許宣告公開方法來操作區塊中的私有變量。

\n 這種模式被稱為自執行匿名函式，但 @cowboy (Ben Alman) 為它定義了語義上更適合的字彙 IIFE 。\n

\n\n

\n 來源: Immediately-Invoked Function Expression (IIFE)\n

\n" }, { "path": "i18n/zh-tw/partials/licence.html", "content": "

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n" }, { "path": "i18n/zh-tw/partials/patterns.html", "content": "\n

說明

\n\n

\n 雖然 JavaScript 包含了自身語言獨有的設計模式，但許多經典的設計模式仍然可以實作。\n

\n\n

\n Addy Osmani 的開源書 Learning JavaScript Design Patterns 是很好的學習範本，下面大多數的連結都出自本書。\n

\n\n

設計模式

\n\n
\n \n
\n\n

\n 創建型設計模式\n

\n\n
\n \n
\n\n

\n 結構型設計模式\n

\n\n
\n \n
\n\n

\n 行為型設計模式\n

\n\n

框架模式（MV* Patterns）

\n\n
\n 底下有一些 JavaScript 傳統 MVC 模式及從中衍生的變形模式的實作。\n
\n\n
\n \n
\n" }, { "path": "i18n/zh-tw/partials/testing-tools.html", "content": "

說明

\n\n

JavaScript 程式測試相關的函式庫及框架。

\n" }, { "path": "i18n/zh-tw/partials/welcome.html", "content": "

注意！螢幕前的你！

\n\n

\n 這是一份為 JavaScript 新手準備的指南，同時也包含了可以給老手學習的最佳範本。\n

\n\n

\n 雖然本網站的名字是 the right way ，但並不表示是撰寫 JavaScript 的“唯一方法“。\n

\n\n

\n 我們只是將一些頂尖開發者的文章、提醒及技巧收集於此。由於它是由一些厲害非常的鄉民身上所收集而來，故稱之為“the right way“或是最佳做法。\n

\n" }, { "path": "i18n/zh-tw/zh-tw.json", "content": "{\n \"meta\": {\n \"title\":\"JS: The Right Way\",\n \"description\":\"練習撰寫 JavaScript 的最佳快速指南 -- 來自網路上的程式碼風格及教學連結\"\n },\n \"direction\": \"ltr\",\n \"welcome\": \"{{@link=partials/welcome.html}}\",\n \"menu\": {\n \"title\": \"選擇你想看的主題\",\n \"links\": [\n {\n \"title\":\"開始入門\",\n \"url\":\"#getting-started\"\n },\n {\n \"title\":\"JavaScript 編碼風格\",\n \"url\":\"#js-code-style\"\n },\n {\n \"title\":\"語言精粹\",\n \"url\":\"#the-good-parts\"\n },\n {\n \"title\": \"Must See\",\n \"url\": \"#must-see\"\n },\n {\n \"title\":\"設計模式\",\n \"url\":\"#patterns\"\n },\n {\n \"title\":\"測試工具\",\n \"url\":\"#testing-tools\"\n },\n {\n \"title\":\"框架\",\n \"url\":\"#frameworks\"\n },\n {\n \"title\":\"遊戲引擎\",\n \"url\":\"#game-engines\"\n },\n {\n \"title\":\"最新訊息\",\n \"url\":\"#news\"\n },\n {\n \"title\":\"延伸閱讀\",\n \"url\":\"#reading\"\n },\n {\n \"title\":\"播客\",\n \"url\":\"#podcasts\"\n },\n {\n \"title\":\"拍客（Screencasts）\",\n \"url\":\"#screencasts\"\n },\n {\n \"title\":\"誰在關注\",\n \"url\":\"#whotofollow\"\n },\n {\n \"title\":\"PaaS 提供者\",\n \"url\":\"#paas\"\n },\n {\n \"title\":\"幫手\",\n \"url\":\"#helpers\"\n }\n ]\n },\n \"gettingStarted\": {\n \"title\":\"開始入門\",\n \"text\":\"{{@link=partials/getting-started.html}}\"\n },\n \"codeStyle\": {\n \"title\":\"JavaScript 編碼風格\",\n \"text\":\"{{@link=partials/code-style.html}}\"\n },\n \"goodParts\":{\n \"title\":\"語言精粹\",\n \"text\":\"{{@link=partials/good-parts.html}}\"\n },\n \"patterns\":{\n \"title\":\"設計模式\",\n \"text\":\"{{@link=partials/patterns.html}}\"\n },\n \"testingTools\":{\n \"title\":\"測試工具\",\n \"text\":\"{{@link=partials/testing-tools.html}}\",\n \"links\":[\n {\n \"name\":\"Mocha\",\n \"url\":\"http://mochajs.org\",\n \"description\":\"由 TJ Holowaychuk 維護。\"\n },\n {\n \"name\":\"QUnit\",\n \"url\":\"http://qunitjs.com\",\n \"description\":\"由 jQuery 維護。\"\n },\n {\n \"name\":\"Jasmine\",\n \"url\":\"https://github.com/pivotal/jasmine\",\n \"description\":\"由 Pivotal Labs 維護。\"\n },\n {\n \"name\":\"Karma\",\n \"url\":\"http://karma-runner.github.io/\",\n \"description\":\"由 the team behind AngularJS. Mostly by Vojta Jina 維護。\"\n },\n {\n \"name\":\"Intern\",\n \"url\":\"http://theintern.io\",\n \"description\":\"由 Sitepen 維護。\"\n },\n {\n \"name\":\"Istanbul\",\n \"url\":\"http://gotwarlost.github.io/istanbul\",\n \"description\":\"JavaScript 程式碼覆蓋率工具，由 Krishnan Anantheswaran 維護。\"\n },\n {\n \"name\":\"Sinon.JS\",\n \"url\":\"http://sinonjs.org\",\n \"description\":\"JavaScript 獨立測試替身套件（包含 Test spy, stub 及 mock）。 不相依及共同運作於任何的單元測試框架。由 Sinon.JS community 原創。\"\n },\n {\n \"name\":\"DexterJS\",\n \"url\":\"https://github.com/leobalter/DexterJS\",\n \"description\":\"模擬函式及 XHR 物件的測試幫助工具，由 Leo Balter 維護。\"\n }\n ]\n },\n \"frameworks\":{\n \"title\":\"框架\",\n \"cat\":[\n {\n \"title\":\"熱門\",\n \"links\":[\n {\n \"name\":\"jQuery\",\n \"url\":\"http://jquery.com\",\n \"description\":\"jQuery 是一個快速、輕巧及功能豐富的 JavaScript 函式庫。由 John Resig 建立。\"\n },\n {\n \"name\":\"YUI\",\n \"url\":\"http://yuilibrary.com\",\n \"description\":\"由 Yahoo 建立！ YUI 是一個免費、開源的 JavaScript 及 CSS 函式庫，適用於建立多互動的 web 應用程式。 已於2014年8月29日停止更新.\"\n },\n {\n \"name\":\"ZeptoJS\",\n \"url\":\"http://zeptojs.com\",\n \"description\":\"Zepto 是一個針對現代瀏覽器開發，極簡的 JavaScript 函式庫，兼容大量的 jQuery API。只要你會用 jQuery，那麼你就已經會用 Zepto 了。\"\n },\n {\n \"name\":\"Dojo Toolkit\",\n \"url\":\"http://dojotoolkit.org\",\n \"description\":\"Dojo 是一個免費、開源的 JavaScript 工具包，用來建立高效能的網站應用程式。專案贊助商有 IBM 及 SitePen。\"\n },\n {\n \"name\":\"Underscore.js\",\n \"url\":\"http://underscorejs.org\",\n \"description\":\"Underscore.js 是一個提供整套函式編程的有用助手，同時並不擴充原生物件的 JavaScript 函式庫。\"\n }\n ]\n },\n {\n \"title\":\"MV*\",\n \"links\":[\n {\n \"name\":\"Backbone.js\",\n \"url\":\"http://backbonejs.org\",\n \"description\":\"非常熱門的 JavaScript 客端框架，由 @jashkenas 建立。\"\n },\n {\n \"name\":\"Ember.js\",\n \"url\":\"http://emberjs.com\",\n \"description\":\"由 @wycats 建立， jQuery 及 Ruby on Rails 核心開發者。\"\n },\n {\n \"name\":\"Knockout.js\",\n \"url\":\"http://knockoutjs.com\",\n \"description\":\"使用 Model-View-View Model (MVVM) 的簡單動態 JavaScript 用戶介面。\"\n },\n {\n \"name\":\"Angular.js\",\n \"url\":\"http://angularjs.org\",\n \"description\":\"由 Google 建立，Angular.js 類似 polyfill 用於 HTML。\"\n },\n {\n \"name\":\"Angular\",\n \"url\":\"https://angular.io\",\n \"description\":\"一个framework.Mobile和桌面。 一种使用Angular创建应用程序的方法，并使用您的代码和技能为每个部署目标创建应用程序。 对于web，移动网站，本机手机和本地桌面。\"\n },\n {\n \"name\":\"Cappuccino\",\n \"url\":\"http://www.cappuccino-project.org\",\n \"description\":\"Cappuccino 是一個可以讓人簡單架起運行在瀏覽器的桌面應用程式的開源框架。\"\n },\n {\n \"name\":\"JavaScript MVC\",\n \"url\":\"http://javascriptmvc.com/\",\n \"description\":\"JavaScriptMVC 是一個包含 jQuery 最佳創意的開源框架。\"\n },\n {\n \"name\":\"Meteor\",\n \"url\":\"https://www.meteor.com\",\n \"description\":\"Meteor 是一個不論是新手或老手都可以在短時間內建立起高品質網路應用程式的開源平台。\"\n },\n {\n \"name\":\"Spice.js\",\n \"url\":\"http://spicejs.github.io/spicejs/\",\n \"description\":\"Spice 是一個超級迷你（< 3k）且有彈性的 javascript MVC 框架。 Spice 可以輕鬆的相容於任何已存在的應用且可和其他技術如 jQuery、pjax、turbolinks、node 或是任何你正在使用的技術共同順暢運作。\"\n },\n {\n \"name\":\"Riot.js\",\n \"url\":\"http://www.riotjs.com/\",\n \"description\":\"Riot 是一個極快速且功能強大的輕量客戶端（MV*）函式庫，用於建立大型的網路應用程序。 儘管它的體形很小，但卻內含以下組成：模版引擎、路由、事件函式庫及嚴格的 MVP 模式，讓程式保持結構化。\"\n },\n {\n \"name\":\"CanJS\",\n \"url\":\"http://canjs.com\",\n \"description\":\"CanJS 是一個可以讓開發複雜應用程序變得簡單且快速的框架。 學習簡單、輕巧且不改變你的應用程序結構，同時更提供一些新的功能，如客製化標籤及雙向綁定。\"\n }\n ]\n },\n {\n \"title\":\"函式庫\",\n \"links\":[\n {\n \"name\":\"React\",\n \"url\":\"http://facebook.github.io/react\",\n \"description\":\"由 Facebook 創立。 React 是一個 JavaScript 函式庫，用於產生 Facebook 及 Instagram 的用戶界面。 許多人認為 React 是 MVC 中的 V。\"\n },\n {\n \"name\":\"Handlebars\",\n \"url\":\"http://handlebarsjs.com\",\n \"description\":\"Handlebars 讓你可以無痛的建立有語義的樣版。\"\n },\n {\n \"name\":\"Dust.js\",\n \"url\":\"http://linkedin.github.io/dustjs\",\n \"description\":\"瀏覽器和 node.js 的非同步樣版。\"\n }\n ]\n },\n {\n \"title\":\"動畫\",\n \"links\":[\n {\n \"name\":\"Velocity.js\",\n \"url\":\"http://julian.com/research/velocity/\",\n \"description\":\"Velocity 是一個和 jQuery 的 $.animate() 有相同 API 的遊戲引擎。\"\n },\n {\n \"name\":\"Bounce.js\",\n \"url\":\"http://bouncejs.com/\",\n \"description\":\"Bounce.js 是一個讓你可以創造美麗 CSS3 動畫的工具及 JS 函式庫。\"\n },\n {\n \"name\":\"TweenJS\",\n \"url\":\"http://www.createjs.com/tweenjs\",\n \"description\":\"一個簡單且強大的 JavaScript 函式庫，用來建立 HTML5 的補間動畫。\"\n },\n {\n \"name\":\"Move.js\",\n \"url\":\"http://visionmedia.github.io/move.js/\",\n \"description\":\"Move.js 是一個基於 CSS3 極為簡單及優雅的輕量 JavaScript 函式庫。\"\n },\n {\n \"name\":\"Snap.svg\",\n \"url\":\"http://snapsvg.io/\",\n \"description\":\"SVG 是一個專門處理互動、高解析度的向量繪圖，讓各種大小的螢幕都能完美的呈現畫面。\"\n },\n {\n \"name\":\"Rekapi\",\n \"url\":\"http://rekapi.com/\",\n \"description\":\"Rekapi 不但是一個建造 canvas 及 DOM 動畫的 JavaScript 函式庫，同時也是新一代瀏覽器中的 CSS 影格動畫。\"\n },\n {\n \"name\":\"Favico.js\",\n \"url\":\"http://lab.ejci.net/favico.js/\",\n \"description\":\"用標誌、圖片或影象來建立你的喜愛圖示。\"\n },\n {\n \"name\":\"Textillate.js\",\n \"url\":\"http://jschr.github.io/textillate/\",\n \"description\":\"Textillate.js 結合許多寫得不錯的函式庫來提供一個容易使用的插件，讓人可以在任何內容中使用 CSS3 的動畫。\"\n },\n {\n \"name\":\"Motio\",\n \"url\":\"http://darsa.in/motio/\",\n \"description\":\"Motio 是一個輕量的 JavaScript 函式庫，基於動畫及平移建立簡單但強大的 2D 動畫。\"\n }\n ]\n }\n ]\n },\n \"gameEngines\":{\n \"title\":\"遊戲引擎\",\n \"links\":[\n {\n \"name\":\"MelonJS\",\n \"url\":\"http://melonJS.org\",\n \"description\":\"MelonJS 是一個免費、輕量的遊戲引擎。 這個引擎整合了圖磚格式，讓關卡設計變得更輕鬆。\"\n },\n {\n \"name\":\"ImpactJS\",\n \"url\":\"http://impactjs.com\",\n \"description\":\"ImpactJS 是從2010年底開始發行的可測試及實行的 HTML5 遊戲引擎之一。 它保持良好的更新與維護，亦擁有一定數量的社群支持它。 它除了有兩本關於如何使用此引擎建立遊戲的書藉外，還有大量的文檔可參考。\"\n },\n {\n \"name\":\"LimeJS\",\n \"url\":\"http://limejs.com\",\n \"description\":\"LimeJS 是一個可以在各種觸控螢幕及桌面瀏覽器上建立快速、本機體驗遊戲的 HTML5 遊戲框架。\"\n },\n {\n \"name\":\"Crafty\",\n \"url\":\"http://craftyjs.com\",\n \"description\":\"Crafty 是從2010年開始就存在的一個遊戲引擎。 Crafty 讓開發 JavaScript 遊戲變得相當容易。\"\n },\n {\n \"name\":\"Cocos2d-HTML5\",\n \"url\":\"http://www.cocos2d-x.org/wiki/Cocos2d-html5\",\n \"description\":\"Cocos2d-html5 是一個 MIT 許可的開源網路 2D 遊戲框架。 它是一個 HTML5 版本的 Cocos2d-x 計劃。 Cocos2d-html5 的發展著重於讓 Cocos2d 可以跨越瀏覽器及本地應用程序等平台。\"\n },\n {\n \"name\":\"Phaser\",\n \"url\":\"http://phaser.io\",\n \"description\":\"Phaser 相依於 Flixel。 由已在 HTML5 社群活躍多年的 Richard Davey (Photon Storm) 維護。\"\n },\n {\n \"name\":\"Goo\",\n \"url\":\"http://www.goocreate.com/learn\",\n \"description\":\"Goo 是一個基於 WebGL/HTML5 建立的 3D 遊戲引擎。\"\n },\n {\n \"name\":\"LycheeJS\",\n \"url\":\"http://lycheejs.org\",\n \"description\":\"LycheeJS 是一個 JavaScript 遊戲函式庫，提供原型及 HTML5 Canvas，WebGL 或 原生 OpenGL(ES) 在網路瀏覽器或本地環境部署的完整解決方案。\"\n },\n {\n \"name\":\"Quintus\",\n \"url\":\"http://html5quintus.com\",\n \"description\":\"Quintus 是一個採用模組化設計的 HTML5 遊戲引擎、輕量、使用友善且簡潔的 JavaScript 語法。\"\n },\n {\n \"name\":\"KiwiJS\",\n \"url\":\"http://www.kiwijs.org\",\n \"description\":\"Kiwi.js 是一個有趣且友善的開源 HTML5 遊戲引擎。 有些人戲稱它為 HTML5 遊戲引擎界的 WordPress。\"\n },\n {\n \"name\":\"PandaJS\",\n \"url\":\"http://www.pandajs.net\",\n \"description\":\"Panda.js 是一個用於手機及電腦，使用 Canvas 和 WebGL 渲染的遊戲引擎。\"\n }\n ]\n },\n \"news\":{\n \"title\":\"最新訊息\",\n \"cat\":[\n {\n \"title\":\"網站\",\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"http://javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Echo JS\",\n \"url\":\"http://www.echojs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Treehouse Show\",\n \"url\":\"http://teamtreehouse.com/library/the-treehouse-show\",\n \"description\":\"\"\n },\n {\n \"name\":\"/r/javascript on Reddit\",\n \"url\":\"http://www.reddit.com/r/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Open Web Platform Daily Digest\",\n \"url\":\"http://webplatformdaily.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Badass JavaScript\",\n \"url\":\"http://badassjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"AngularJS Daily\",\n \"url\":\"http://paper.li/gwinnem/1390553142\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"新訊訂閱\",\n \"links\":[\n {\n \"name\":\"JavaScript Weekly\",\n \"url\":\"http://javascriptweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"A Drip of JavaScript\",\n \"url\":\"http://designpepper.com/a-drip-of-javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Ember Weekly\",\n \"url\":\"http://emberweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Weekly\",\n \"url\":\"http://nodeweekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Meteor Weekly\",\n \"url\":\"http://meteorhacks.com/meteor-weekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Grunt Weekly\",\n \"url\":\"https://twitter.com/gruntweekly\",\n \"description\":\"\"\n },\n {\n \"name\":\"Gamedev.js Weekly\",\n \"url\":\"http://weekly.gamedevjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Weekly\",\n \"url\":\"http://html5weekly.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"UDGWebDev Weekly\",\n \"url\":\"http://udgwebdev.com/newsletter\",\n \"description\":\"\"\n },\n {\n \"name\":\"The React Newsletter\",\n \"url\":\"http://theproblemsolver.nl/TheReactNewsletter/Subscribe\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"reading\":{\n \"title\":\"延伸閱讀\",\n \"cat\":[\n {\n \"title\":\"文章\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Understanding JavaScript OOP\",\n \"url\":\"http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html\",\n \"description\":\"作者 Quildreen Motta\"\n },\n {\n \"name\":\"Understanding “Prototypes” in JavaScript\",\n \"url\":\"http://yehudakatz.com/2011/08/12/understanding-prototypes-in-JavaScript\",\n \"description\":\"作者 Yehuda Katz\"\n },\n {\n \"name\":\"Prototypes and Inheritance in JavaScript\",\n \"url\":\"http://msdn.microsoft.com/en-us/magazine/ff852808.aspx\",\n \"description\":\"作者 Scott Allen\"\n },\n {\n \"name\":\"Partial Application in JavaScript\",\n \"url\":\"http://benalman.com/news/2012/09/partial-application-in-javascript\",\n \"description\":\"作者 Ben Alman\"\n },\n {\n \"name\":\"Getting Over jQuery\",\n \"url\":\"http://blog.ponyfoo.com/2013/07/09/getting-over-jquery\",\n \"description\":\"作者 Nico Bevacqua\"\n },\n {\n \"name\":\"A Dive Into Plain JavaScript\",\n \"url\":\"http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript\",\n \"description\":\"作者 Viljami S.\"\n },\n {\n \"name\":\"A Deeper Look at Objects in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm\",\n \"description\":\"作者 Kirupa Chinnathambi\"\n },\n {\n \"name\":\"Introduction to Easing in JavaScript\",\n \"url\":\"http://www.kirupa.com/html5/introduction_to_easing_in_javascript.htm\",\n \"description\":\"作者 Kirupa Chinnathambi\"\n },\n {\n \"name\":\"How to Learn JavaScript Properly\",\n \"url\":\"http://javascriptissexy.com/how-to-learn-javascript-properly\",\n \"description\":\"作者 JavaScript Is Sexy\"\n },\n {\n \"name\":\"How to Start with JavaScript\",\n \"url\":\"http://jugoncalv.es/blog/javascript/how-to-start-with-javascript\",\n \"description\":\"作者 Ju Gonçalves\"\n }\n ]\n },\n {\n \"title\":\"書藉\",\n \"credit\":true,\n \"box\":false,\n \"links\":[\n {\n \"name\":\"Eloquent JavaScript\",\n \"url\":\"http://eloquentjavascript.net\",\n \"description\":\"作者 Marijn Haverbeke\"\n },\n {\n \"name\":\"JavaScript: The Definitive Guide\",\n \"url\":\"http://www.amazon.com/JavaScript-Definitive-Guide-Activate-Guides/dp/0596805527\",\n \"description\":\"作者 David Flanagan\"\n },\n {\n \"name\":\"JavaScript: The Good Parts\",\n \"url\":\"http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742\",\n \"description\":\"作者 Douglas Crockford\"\n },\n {\n \"name\":\"JavaScript Patterns\",\n \"url\":\"http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752\",\n \"description\":\"作者 Stoyan Stefanov\"\n },\n {\n \"name\":\"JavaScript Testing Recipes\",\n \"url\":\"http://jstesting.jcoglan.com\",\n \"description\":\"作者 James Coglan\"\n },\n {\n \"name\":\"Professional JavaScript for Web Developers\",\n \"url\":\"http://www.amazon.com/dp/1118026691/ref=wl_it_dp_o_pC_nS_ttl?_encoding=UTF8&colid=253J6SW0KPB7J&coliid=IC7UM9W2VVSHL\",\n \"description\":\"作者 Nicholas C. Zakas\"\n },\n {\n \"name\":\"High Performance JavaScript\",\n \"url\":\"http://www.amazon.com/Performance-JavaScript-Faster-Application-Interfaces/dp/059680279X\",\n \"description\":\"作者 Nicholas C. Zakas\"\n },\n {\n \"name\":\"Human JavaScript\",\n \"url\":\"http://humanjavascript.com\",\n \"description\":\"作者 Henrik Joreteg\"\n },\n {\n \"name\":\"Object Oriented JavaScript\",\n \"url\":\"http://www.amazon.com/Object-Oriented-JavaScript-high-quality-applications-libraries/dp/1847194141\",\n \"description\":\"作者 Stoyan Stefanov\"\n },\n {\n \"name\":\"Pro JavaScript Design Patterns\",\n \"url\":\"http://www.amazon.com/Pro-JavaScript-Design-Patterns-Object-Oriented/dp/159059908X\",\n \"description\":\"作者 Dustin Diaz\"\n },\n {\n \"name\":\"Secrets of the JavaScript Ninja\",\n \"url\":\"http://jsninja.com\",\n \"description\":\"作者 John Resig\"\n },\n {\n \"name\":\"JavaScript Application Design\",\n \"url\":\"http://bevacqua.io/bf\",\n \"description\":\"作者 Nicolas Bevacqua\"\n },\n {\n \"name\":\"Speaking JavaScript\",\n \"url\":\"http://speakingjs.com\",\n \"description\":\"作者 Axel Rauschmayer\"\n },\n {\n \"name\":\"Test-Driven JavaScript Development\",\n \"url\":\"http://tddjs.com\",\n \"description\":\"作者 Christian Johansen\"\n },\n {\n \"name\":\"You Don't Know JS\",\n \"url\":\"https://github.com/getify/You-Dont-Know-JS\",\n \"description\":\"作者 >Kyle Simpson\"\n },\n {\n \"name\":\"You Might Not Need jQuery\",\n \"url\":\"http://youmightnotneedjquery.com\",\n \"description\":\"作者 Ryan Burgess\"\n },\n {\n \"name\":\"JavaScript Garden\",\n \"url\":\"http://bonsaiden.github.io/JavaScript-Garden/\",\n \"description\":\"作者 Ivo Wetzel\"\n },\n {\n \"name\":\"Effective JavaScript\",\n \"url\":\"http://effectivejs.com\",\n \"description\":\"作者 David Herman\"\n },\n {\n \"name\":\"JavaScript Allongé\",\n \"url\":\"https://leanpub.com/javascript-allonge\",\n \"description\":\"作者 Reginald Braithwaite\"\n },\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"作者 DevFreeBooks\"\n }\n ]\n },\n {\n \"title\":\"免費電子書\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JSBooks\",\n \"url\":\"http://jsbooks.revolunet.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeBooks\",\n \"url\":\"http://devfreebooks.org\",\n \"description\":\"\"\n }\n ]\n },\n {\n \"title\":\"入口網站\",\n \"credit\":false,\n \"box\":true,\n \"links\":[\n {\n \"name\":\"JavaScript.com\",\n \"url\":\"https://www.javascript.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"HTML5 Rocks\",\n \"url\":\"http://www.html5rocks.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"W3Fools\",\n \"url\":\"http://www.w3fools.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Mozilla Developer Network\",\n \"url\":\"http://developer.mozilla.org/docs/JavaScript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Web Platform\",\n \"url\":\"http://docs.webplatform.org/wiki/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Smashing Magazine\",\n \"url\":\"http://coding.smashingmagazine.com/tag/javascript\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node School\",\n \"url\":\"http://nodeschool.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"How to Node\",\n \"url\":\"http://howtonode.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"Felix’s Node.js Beginners Guide\",\n \"url\":\"http://nodeguide.com/beginner.html\",\n \"description\":\"\"\n }\n ]\n }\n ]\n },\n \"podcasts\":{\n \"title\":\"播客\",\n \"links\":[\n {\n \"name\":\"JavaScript Jabber\",\n \"url\":\"http://javascriptjabber.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Node Up\",\n \"url\":\"http://nodeup.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"5 Minutes of JavaScript\",\n \"url\":\"https://fivejs.codeschool.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"The Meteor Podcast\",\n \"url\":\"http://www.meteorpodcast.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"JSConf\",\n \"url\":\"https://www.youtube.com/user/jsconfeu\",\n \"description\":\"\"\n }\n ]\n },\n \"screencasts\":{\n \"title\":\"拍客（Screencasts）\",\n \"links\":[\n {\n \"name\": \"iLoveCoding\",\n \"img\": \"ilovecoding.svg\",\n \"url\": \"https://iLoveCoding.org\",\n \"description\": \"Full-Stack JavaScript video training.\"\n },\n {\n \"name\":\"Egghead\",\n \"img\":\"egghead.svg\",\n \"url\":\"https://egghead.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"DevFreeCasts\",\n \"img\":\"devfreecasts.png\",\n \"url\":\"http://devfreecasts.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"tagtree.tv\",\n \"img\":\"tagtree.png\",\n \"url\":\"https://tagtree.tv/\",\n \"description\":\"\"\n },\n {\n \"name\":\"frontndmasters.com\",\n \"img\":\"frontendmasters.svg\",\n \"url\":\"http://frontendmasters.com\",\n \"description\":\"\"\n }\n ]\n },\n \"whoToFollow\":{\n \"title\":\"誰在關注\"\n },\n \"paasProviders\":{\n \"title\":\"PaaS 提供者\",\n \"links\":[\n {\n \"name\":\"Heroku\",\n \"url\":\"http://heroku.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Modulus\",\n \"url\":\"https://modulus.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Nodejitsu\",\n \"url\":\"http://nodejitsu.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"OpenShift\",\n \"url\":\"https://www.openshift.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"Getup\",\n \"url\":\"http://getupcloud.com/en/\",\n \"description\":\"\"\n },\n {\n \"name\":\"Windows Azure\",\n \"url\":\"http://www.windowsazure.com/en-us/develop/nodejs\",\n \"description\":\"\"\n }\n ]\n },\n \"helpers\":{\n \"title\":\"幫手\",\n \"links\":[\n {\n \"name\":\"npm\",\n \"img\":\"npm.png\",\n \"url\":\"https://npmjs.org\",\n \"description\":\"\"\n },\n {\n \"name\":\"bower\",\n \"img\":\"bower-logo.png\",\n \"url\":\"http://bower.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"yeoman\",\n \"img\":\"yeoman-logo.png\",\n \"url\":\"http://yeoman.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"grunt\",\n \"img\":\"grunt-logo.png\",\n \"url\":\"http://gruntjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"gulp\",\n \"img\":\"gulp.png\",\n \"url\":\"http://gulpjs.com\",\n \"description\":\"\"\n },\n {\n \"name\":\"brunch\",\n \"img\":\"brunch-logo.png\",\n \"url\":\"http://brunch.io\",\n \"description\":\"\"\n },\n {\n \"name\":\"Browser compilation library\",\n \"img\":\"broccoli-logo.png\",\n \"url\":\"https://github.com/broccolijs/broccoli\",\n \"description\":\"\"\n },\n {\n \"name\":\"todo mvc\",\n \"img\":\"todomvc-logo.png\",\n \"url\":\"http://todomvc.com\",\n \"description\":\"\"\n }\n ]\n },\n \"footer\":{\n \"credit\":\"網站創始兼維護者\",\n \"contributors\":\"貢獻者\",\n \"contribDesc\":\"如果沒有這些偉大的貢獻者，本網站也無法完成。謝謝你們幫忙完成這個網站！\",\n \"licence\":\"{{@link=partials/licence.html}}\"\n }\n}\n" }, { "path": "manifest.json", "content": "{\n \"name\": \"JS The Right Way\",\n \"icons\": [],\n \"start_url\": \"index.html\",\n \"display\": \"standalone\",\n \"orientation\": \"portrait\"\n}\n" }, { "path": "package.json", "content": "{\n \"name\": \"js-the-right-way\",\n \"version\": \"0.0.0\",\n \"description\": \"![](http://i.imgur.com/jaEbd80.png)\",\n \"main\": \"index.html\",\n \"scripts\": {\n \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/braziljs/js-the-right-way.git\"\n },\n \"author\": \"William Oliveira\",\n \"license\": \"CC BY-NC-SA 3.0\",\n \"bugs\": {\n \"url\": \"https://github.com/braziljs/js-the-right-way/issues\"\n },\n \"homepage\": \"http://jstherightway.org\",\n \"devDependencies\": {\n \"grunt\": \"^0.4.4\",\n \"grunt-contrib-clean\": \"^0.6.0\",\n \"grunt-contrib-connect\": \"^0.9.0\",\n \"grunt-contrib-copy\": \"^0.8.0\",\n \"grunt-contrib-cssmin\": \"^0.9.0\",\n \"grunt-contrib-htmlmin\": \"^0.4.0\",\n \"grunt-contrib-imagemin\": \"^0.9.4\",\n \"grunt-contrib-uglify\": \"^0.4.0\",\n \"grunt-contrib-watch\": \"^0.6.1\",\n \"html-entities\": \"^1.1.2\",\n \"html-minifier\": \"^0.7.2\",\n \"mustache\": \"^2.1.2\",\n \"node.extend\": \"^1.1.5\"\n },\n \"dependencies\": {}\n}\n" }, { "path": "public/assets/css/core.css", "content": "html {\n font-family: 'Open Sans', sans-serif;\n background: #f5f5f5;\n box-sizing: border-box;\n}\n\nbody {\n margin: 0;\n padding: 0;\n}\n\n.rtl {\n\tdirection: rtl;\n}\n.rtl section h3,\n.rtl section p {\n float: right;\n}\n\n\n.wrapper {\n width: 80%;\n position: relative;\n margin: 0 auto;\n}\n\n.gh-button:nth-child(1) {\n width: 93px;\n}\n\n.gh-button {\n width: 91px;\n}\n\n.gh-follow-button {\n margin-left: -4px;\n}\n\n.adsbygoogle {\n height: 90px;\n display: block;\n}\n\nheader {\n text-align: center;\n width: 100%;\n height: 273px;\n background: #44A2C0;\n float: left;\n position: relative;\n box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.05);\n}\n\nheader h1 {\n font-size: 90px;\n color: white;\n text-shadow: 0px 8px 0 rgba(0, 0, 0, 0.15);\n margin: 0;\n padding: 30px 0;\n}\n\nheader small {\n font-size: 30px;\n margin-top: -20px;\n display: inline-block;\n padding-bottom: 5px;\n margin-bottom: 10px;\n color: #2D7896;\n border-bottom: 10px solid rgba(255, 255, 255, 0.08);\n box-shadow: 0px 2px rgba(0, 0, 0, 0.04);\n}\n\n#dropdown {\n position: absolute;\n top: 10px;\n right: 15px;\n}\n\n#dropdown input {\n display: none;\n}\n\n#dropdown label,\n#dropdown ul li,\n#dropdown ul li a {\n background-color:#1A7594;\n font-size:16px;\n color:#DDD;\n cursor:pointer;\n}\n\n#dropdown label:hover,\n#dropdown input:checked + label {\n background-color:#3A8AA5;\n}\n\n#dropdown ul li a:hover {\n background-color:#3A8AA5;\n color:#FFF;\n}\n\n#dropdown label {\n padding:2px 5px;\n float: left;\n}\n\n#dropdown label .flag {\n margin-right: 5px;\n margin: 1em 1em;\n}\n\n#dropdown label:after {\n content:\"\";\n float:right;\n border-left: 4px solid transparent;\n border-right: 4px solid transparent;\n border-top: 5px solid #DDD;\n margin-top:7px;\n}\n\n#dropdown ul li {\n text-align: left;\n}\n\n#dropdown ul li a {\n padding:2px 5px;\n text-decoration: none;\n display: block;\n}\n\n#dropdown input ~ ul {\n list-style: none;\n margin: 0;\n padding: 0;\n opacity: 0;\n visibility: hidden;\n clear: both;\n -webkit-transition: all 0.2s;\n -moz-transition: all 0.2s;\n -ms-transition: all 0.2s;\n -o-transition: all 0.2s;\n transition: all 0.2s;\n}\n\n#dropdown input:checked ~ ul {\n opacity: 1;\n visibility: visible;\n}\n\n#dropdown .flag-icon {\n margin-right: 5px;\n}\n\n.social {\n text-align: center;\n width: 100%;\n height: 172px;\n background: #1A7594;\n float: left;\n}\n\n.github {\n padding-top: 20px;\n margin: 0 auto;\n}\n\n.share {\n margin: 0 auto;\n padding-bottom: 20px;\n padding-top: 15px;\n}\n\n.share .fb-like iframe {\n margin-top: -5px;\n}\n\n.share .twitter-share-button {\n width: 72px !important;\n}\n\n.welcome {\n width: 100%;\n padding: 30px 0;\n background: #2E2E2E;\n float: left;\n position: relative;\n box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.12);\n}\n\n.welcome h1 {\n color: #44A2C0;\n font-size: 40px;\n margin: 0;\n}\n\n.welcome p {\n color: #FFF;\n margin: 0;\n padding-top: 20px;\n}\n\n.main {\n width: 100%;\n padding: 30px 0;\n background: #F7F169;\n float: left;\n}\n\n.main h1 {\n text-align: center;\n text-transform: uppercase;\n font-size: 40px;\n margin: 0;\n}\n\n.main h1 a {\n color: #FFF;\n text-shadow: 2px 3px 0px rgba(0, 0, 0, 0.11);\n text-decoration: none;\n}\n\n.main ul {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n.main ul li {\n padding: 10px 0;\n}\n\n.main ul li a {\n text-decoration: none;\n font-size: 24px;\n color: #000;\n border-bottom: 3px solid transparent;\n\n -webkit-transition: all 0.2s ease-in-out;\n -moz-transition: all 0.2s ease-in-out;\n -ms-transition: all 0.2s ease-in-out;\n -o-transition: all 0.2s ease-in-out;\n transition: all 0.2s ease-in-out;\n}\n\n.main ul li a:hover {\n border-bottom: 3px solid #FFF;\n}\n\n.section {\n float: left;\n width: 100%;\n padding: 30px 0;\n background: #44A2C0;\n color: #FFF;\n}\n\n.section h1 {\n font-size: 40px;\n text-align: center;\n text-shadow: 1px 4px 2px rgba(0, 0, 0, 0.16);\n margin: 0;\n text-transform: uppercase;\n}\n\n.section h1 a {\n color: #FFF;\n text-shadow: 1px 4px 2px rgba(0, 0, 0, 0.16);\n text-decoration: none;\n}\n\n.section h3, .section h5 {\n border-bottom: 3px solid rgba(0, 0, 0, 0.08);\n display: inline-block;\n text-transform: uppercase;\n clear: both;\n float: left;\n}\n.section h4 {\n float: left;\n clear: both;\n margin: 0;\n margin-bottom: 15px;\n color: #000;\n font-size: 20px;\n text-align: center;\n}\n\n.section h5 {\n float: none;\n font-size: 16px;\n}\n\n.section ul {\n clear: both;\n margin: 0;\n padding: 0 20px;\n}\n\n.section p {\n background: #FFF;\n color: #696969;\n padding: 20px;\n box-shadow: 0px 3px rgba(0, 0, 0, 0.08);\n float: left;\n clear: both;\n}\n\n.section p a,\n.txt a {\n color: #FF8484;\n text-decoration: none;\n}\n\n.section p a:hover,\n.txt a:hover {\n text-decoration: underline;\n}\n\n#getting-started {\n background: #877399;\n}\n\n#js-code-style {\n background: #48C383;\n}\n\n#the-good-parts {\n background: #C35C48;\n}\n\n#must-see {\n background: #5844c0;\n}\n\n#must-see .video-list {\n text-align: center;\n width: 80%;\n margin: auto;\n}\n\n#must-see .video-wrapper {\n\tposition: relative;\n\tpadding-bottom: 56.25%; /* 16:9 */\n\tpadding-top: 25px;\n\theight: 0;\n}\n\n#must-see .video-wrapper iframe {\n\tposition: absolute;\n\ttop: 0;\n\tleft: 0;\n\twidth: 100%;\n\theight: 100%;\n}\n\n#patterns {\n background: #7BC044;\n}\n\n#testing-tools {\n background: #FFC56F;\n}\n\n#testing-tools .source a {\n color: #000;\n}\n\n#frameworks {\n background: #178892;\n}\n\n#frameworks .source a {\n color: #FFF849;\n}\n\n#game-engines {\n background: #648A64;\n}\n\n#game-engines .section p a, .txt a {\n color: #1F4E53;\n}\n\n#game-engines .source a {\n color: #8CFF02;\n}\n\n#news {\n background: #456481;\n}\n\n#news .source a {\n text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.52);\n}\n\n#reading {\n background: #7C84BE;\n}\n\n#reading .source a {\n color: #FFE55A;\n}\n\n#podcasts {\n background: #24E56A;\n}\n\n#podcasts .link a {\n color: #FFF;\n}\n\n#whotofollow {\n background: #44C0AC;\n}\n\n#paas {\n background: #C04484;\n}\n\n#paas .link a {\n color: #FFF;\n}\n\n#helpers .helpers-container {\n text-align: center;\n margin: 0px auto;\n}\n\n#helpers a {\n vertical-align: middle;\n margin: 20px 40px;\n display: inline-block;\n}\n\n#helpers a:hover figure {\n opacity: 1;\n}\n\n#helpers a figure {\n width: 120px;\n height: 120px;\n opacity: 0.5;\n overflow: hidden;\n\n -webkit-transition: all 0.2s ease-in-out;\n -moz-transition: all 0.2s ease-in-out;\n -ms-transition: all 0.2s ease-in-out;\n -o-transition: all 0.2s ease-in-out;\n transition: all 0.2s ease-in-out;\n}\n\n#helpers a img {\n width: 100%;\n height: auto;\n margin: auto auto;\n}\n\n#helpers a:nth-child(1) figure img {\n margin: 40px 0;\n}\n\n#helpers a:nth-child(3) figure img {\n margin: 10px 0;\n}\n\n#helpers a:nth-child(4) figure img {\n width: 100px;\n}\n\n#helpers a:nth-child(5) figure img {\n width: 64px;\n margin: -15px 0;\n}\n\n#helpers a:nth-child(6) figure img {\n width: 110px;\n margin: 10px 0;\n}\n\n#screencasts {\n background: rgba(245,226,19,0.6)\n}\n\n#screencasts h1{\n opacity: 1;\n}\n\n#screencasts .screencasts-container {\n margin-top: 30px;\n}\n\n#screencasts .screencasts-container a {\n width: 120px;\n display: block;\n position: relative;\n margin: 0 auto;\n}\n\n#screencasts a img {\n opacity: 0.5;\n\n -webkit-transition: all 0.2s ease-in-out;\n -moz-transition: all 0.2s ease-in-out;\n -ms-transition: all 0.2s ease-in-out;\n -o-transition: all 0.2s ease-in-out;\n transition: all 0.2s ease-in-out;\n}\n\n#screencasts a:hover img {\n opacity: 1;\n}\n\n.screencasts-container a img{\n width: inherit;\n}\n\n#top-banner,\n#mid-banner,\n#foot-banner {\n background: #505050;\n text-align: center;\n}\n\n.source {\n color: #FFF !important;\n margin-top: -16px;\n background: rgba(0, 0, 0, 0.09) !important;\n box-shadow: none !important;\n}\n\n.txt {\n background: #FFF;\n color: #696969;\n padding: 20px;\n box-shadow: 0px 3px rgba(0, 0, 0, 0.08);\n clear: both;\n margin: 1em auto;\n}\n\n.links-container {\n float: left;\n display: inline-block;\n clear: both;\n margin-top: 15px;\n}\n\n.links-container .link {\n float: none !important;\n clear: none !important;\n display: inline-block;\n margin-right: 15px;\n margin-top: 0px;\n}\n\n.link:hover {\n box-shadow: 0px 5px 0px rgba(0, 0, 0, 0.18) !important;\n}\n\n.link a:hover {\n text-decoration: none !important;\n}\n\n.users {\n width: 100%;\n float: left;\n text-align: center;\n margin-top: 25px;\n}\n\n.user {\n width: 120px;\n height: 160px;\n display: inline-block;\n margin: 0 50px;\n}\n\n.user a {\n color: #FFF;\n}\n\n.user a:hover img {\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);\n}\n\n.user img {\n border-radius: 50%;\n max-width: 80px;\n\n -webkit-transition: all 0.2s ease-in-out;\n -moz-transition: all 0.2s ease-in-out;\n -ms-transition: all 0.2s ease-in-out;\n -o-transition: all 0.2s ease-in-out;\n transition: all 0.2s ease-in-out;\n}\n\n.user span {\n width: 100%;\n width: 100%;\n float: left;\n clear: both;\n}\n\n#footer {\n background: #505050;\n box-shadow: inset 0px 5px 5px rgba(0, 0, 0, 0.15);\n padding-top: 60px;\n padding-bottom: 30px;\n}\n\n#footer .bio img {\n width: 100px;\n border-radius: 50%;\n float: left;\n position: relative;\n}\n\n#footer .bio a {\n color: #FFF;\n text-decoration: none;\n text-align: center;\n clear: both;\n display: inline-block;\n margin-right: 30px;\n}\n\n#footer .bio p {\n float: right;\n margin-top: -100px;\n margin-right: 40px;\n height: auto;\n line-height: 30px;\n}\n\n#footer .bio p a {\n color: #00BACA;\n font-weight: bold;\n}\n\n#footer .bio b {\n display: inline-block;\n margin-top: 35px;\n float: left;\n margin-left: -10px;\n background-color: #292929;\n padding: 5px 10px 5px 20px;\n\n -webkit-transition: all 0.2s ease-in-out;\n -moz-transition: all 0.2s ease-in-out;\n -ms-transition: all 0.2s ease-in-out;\n -o-transition: all 0.2s ease-in-out;\n transition: all 0.2s ease-in-out;\n}\n\n#footer .bio a:hover b {\n color: #292929;\n background-color: #FFF;\n}\n\n#footer .bio a:hover img {\n box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);\n}\n\n#footer h3 {\n text-align: center;\n display: inline-block;\n padding-right: 10px;\n}\n\n#footer hr {\n width: 100%;\n float: left;\n margin-top: 50px;\n border-color: #666;\n}\n\n#footer .source {\n width: 100%;\n float: left;\n clear: both;\n text-align: center;\n}\n\n.contributors {\n width: 100%;\n clear: both;\n float: left;\n padding-top: 50px;\n}\n\n.contributors p {\n text-align: center;\n float: none;\n width: 65%;\n margin: 20px auto;\n}\n\niframe[id^=\"oauth2relay\"]{\n position: fixed !important;\n}\n\n@media only screen and (max-width: 1300px) {\n #footer .bio p {\n display: none;\n }\n}\n\n@media only screen and (max-width: 530px) {\n header h1 {\n font-size: 50px;\n }\n .section h1 {\n font-size: 20px;\n }\n .fork-me {\n display: none;\n }\n .social .github iframe {\n width: 100% !important;\n margin: 0 auto;\n }\n .share .wrapper {\n width: 100%;\n }\n .links-container {\n width: 100%;\n }\n .links-container .link {\n width: 100%;\n box-sizing: border-box;\n margin-bottom: 30px;\n text-align: center;\n }\n #helpers a {\n width: 70%;\n margin: 0 auto;\n display: block;\n box-sizing: border-box;\n }\n #helpers a figure {\n margin: 15px auto;\n text-align: center;\n }\n #footer .bio p {\n margin: 15px 0 0 0;\n height: auto;\n line-height: auto;\n display: inline-block;\n }\n #footer hr {\n margin-top: 0;\n }\n .contributors {\n padding-top: 15px;\n }\n}\n\n/* github corner */\n.github-corner:hover .octo-arm{\n\tanimation:octocat-wave 560ms ease-in-out\n}\n@keyframes octocat-wave{\n\t0%,100%{\n\t\ttransform:rotate(0)}\n\t20%,60%{\n\t\ttransform:rotate(-25deg)\n\t}\n\t40%,80%{\n\t\ttransform:rotate(10deg)\n\t}\n}\n\n@media (max-width:500px){\n\t.github-corner:hover .octo-arm{\n\t\tanimation:none\n\t}\n\t.github-corner .octo-arm{\n\t\tanimation:octocat-wave 560ms ease-in-out\n\t}\n}\n" }, { "path": "public/assets/css/normalize.css", "content": "/*! normalize.css v3.0.0 | MIT License | git.io/normalize */\n\n/**\n * 1. Set default font family to sans-serif.\n * 2. Prevent iOS text size adjust after orientation change, without disabling\n * user zoom.\n */\n\nhtml {\n font-family: sans-serif; /* 1 */\n -ms-text-size-adjust: 100%; /* 2 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/**\n * Remove default margin.\n */\n\nbody {\n margin: 0;\n}\n\n/* HTML5 display definitions\n ========================================================================== */\n\n/**\n * Correct `block` display not defined in IE 8/9.\n */\n\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nnav,\nsection,\nsummary {\n display: block;\n}\n\n/**\n * 1. Correct `inline-block` display not defined in IE 8/9.\n * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.\n */\n\naudio,\ncanvas,\nprogress,\nvideo {\n display: inline-block; /* 1 */\n vertical-align: baseline; /* 2 */\n}\n\n/**\n * Prevent modern browsers from displaying `audio` without controls.\n * Remove excess height in iOS 5 devices.\n */\n\naudio:not([controls]) {\n display: none;\n height: 0;\n}\n\n/**\n * Address `[hidden]` styling not present in IE 8/9.\n * Hide the `template` element in IE, Safari, and Firefox < 22.\n */\n\n[hidden],\ntemplate {\n display: none;\n}\n\n/* Links\n ========================================================================== */\n\n/**\n * Remove the gray background color from active links in IE 10.\n */\n\na {\n background: transparent;\n}\n\n/**\n * Improve readability when focused and also mouse hovered in all browsers.\n */\n\na:active,\na:hover {\n outline: 0;\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Address styling not present in IE 8/9, Safari 5, and Chrome.\n */\n\nabbr[title] {\n border-bottom: 1px dotted;\n}\n\n/**\n * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.\n */\n\nb,\nstrong {\n font-weight: bold;\n}\n\n/**\n * Address styling not present in Safari 5 and Chrome.\n */\n\ndfn {\n font-style: italic;\n}\n\n/**\n * Address variable `h1` font-size and margin within `section` and `article`\n * contexts in Firefox 4+, Safari 5, and Chrome.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/**\n * Address styling not present in IE 8/9.\n */\n\nmark {\n background: #ff0;\n color: #000;\n}\n\n/**\n * Address inconsistent and variable font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` affecting `line-height` in all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsup {\n top: -0.5em;\n}\n\nsub {\n bottom: -0.25em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove border when inside `a` element in IE 8/9.\n */\n\nimg {\n border: 0;\n}\n\n/**\n * Correct overflow displayed oddly in IE 9.\n */\n\nsvg:not(:root) {\n overflow: hidden;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * Address margin not present in IE 8/9 and Safari 5.\n */\n\nfigure {\n margin: 1em 40px;\n}\n\n/**\n * Address differences between Firefox and other browsers.\n */\n\nhr {\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n height: 0;\n}\n\n/**\n * Contain overflow in all browsers.\n */\n\npre {\n overflow: auto;\n}\n\n/**\n * Address odd `em`-unit font size rendering in all browsers.\n */\n\ncode,\nkbd,\npre,\nsamp {\n font-family: monospace, monospace;\n font-size: 1em;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * Known limitation: by default, Chrome and Safari on OS X allow very limited\n * styling of `select`, unless a `border` property is set.\n */\n\n/**\n * 1. Correct color not being inherited.\n * Known issue: affects color of disabled elements.\n * 2. Correct font properties not being inherited.\n * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n color: inherit; /* 1 */\n font: inherit; /* 2 */\n margin: 0; /* 3 */\n}\n\n/**\n * Address `overflow` set to `hidden` in IE 8/9/10.\n */\n\nbutton {\n overflow: visible;\n}\n\n/**\n * Address inconsistent `text-transform` inheritance for `button` and `select`.\n * All other form control elements do not inherit `text-transform` values.\n * Correct `button` style inheritance in Firefox, IE 8+, and Opera\n * Correct `select` style inheritance in Firefox.\n */\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/**\n * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\n * and `video` controls.\n * 2. Correct inability to style clickable `input` types in iOS.\n * 3. Improve usability and consistency of cursor style between image-type\n * `input` and others.\n */\n\nbutton,\nhtml input[type=\"button\"], /* 1 */\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n -webkit-appearance: button; /* 2 */\n cursor: pointer; /* 3 */\n}\n\n/**\n * Re-set default cursor for disabled elements.\n */\n\nbutton[disabled],\nhtml input[disabled] {\n cursor: default;\n}\n\n/**\n * Remove inner padding and border in Firefox 4+.\n */\n\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n/**\n * Address Firefox 4+ setting `line-height` on `input` using `!important` in\n * the UA stylesheet.\n */\n\ninput {\n line-height: normal;\n}\n\n/**\n * It's recommended that you don't attempt to style these elements.\n * Firefox's implementation doesn't respect box-sizing, padding, or width.\n *\n * 1. Address box sizing set to `content-box` in IE 8/9/10.\n * 2. Remove excess padding in IE 8/9/10.\n */\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Fix the cursor style for Chrome's increment/decrement buttons. For certain\n * `font-size` values of the `input`, it causes the cursor style of the\n * decrement button to change from `default` to `text`.\n */\n\ninput[type=\"number\"]::-webkit-inner-spin-button,\ninput[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.\n * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome\n * (include `-moz` to future-proof).\n */\n\ninput[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n -moz-box-sizing: content-box;\n -webkit-box-sizing: content-box; /* 2 */\n box-sizing: content-box;\n}\n\n/**\n * Remove inner padding and search cancel button in Safari and Chrome on OS X.\n * Safari (but not Chrome) clips the cancel button when the search input has\n * padding (and `textfield` appearance).\n */\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * Define consistent border, margin, and padding.\n */\n\nfieldset {\n border: 1px solid #c0c0c0;\n margin: 0 2px;\n padding: 0.35em 0.625em 0.75em;\n}\n\n/**\n * 1. Correct `color` not being inherited in IE 8/9.\n * 2. Remove padding so people aren't caught out if they zero out fieldsets.\n */\n\nlegend {\n border: 0; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Remove default vertical scrollbar in IE 8/9.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * Don't inherit the `font-weight` (applied by a rule above).\n * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.\n */\n\noptgroup {\n font-weight: bold;\n}\n\n/* Tables\n ========================================================================== */\n\n/**\n * Remove most spacing between table cells.\n */\n\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ntd,\nth {\n padding: 0;\n}\n" }, { "path": "public/assets/js/core.js", "content": "var App = (function (window, document, $) {\n\n 'use strict';\n\n var users = shuffle([\n 'BrendanEich',\n 'isaacs',\n 'rdworth',\n 'fat',\n 'michalbe',\n 'afabbro',\n 'addyosmani',\n 'joezimjs',\n 'douglascrockford',\n 'paulirish',\n 'tj',\n 'guille',\n 'nzakas',\n 'jeresig',\n 'substack',\n 'dherman',\n 'creationix',\n 'mrdoob',\n 'codepo8',\n 'rwaldron',\n 'darkwing',\n 'bevacqua',\n 'sindresorhus',\n 'getify',\n 'ericelliott',\n 'aaronfrost',\n 'jhusain',\n 'ryanflorence',\n 'gaearon',\n 'rauschma',\n 'sarasoueidan',\n 'rmurphey',\n 'bitchwhocodes',\n 'noopkat',\n 'sdras',\n 'rachelnicole',\n 'jennschiffer',\n 'kosamari',\n 'cassidoo'\n ]),\n userIsDone,\n URL = 'https://api.github.com/';\n\n return {\n // Init function\n init: function () {\n this.getGithubUsers();\n this.getGithubContrib();\n $('img.lazy').lazyload();\n },\n // Getting and appending users of github\n getGithubUsers: function () {\n var i = 0,\n length = userIsDone = users.length,\n str = '',\n $whoto;\n\n // Callback function\n function cb(result) {\n userIsDone -= 1;\n str += '
' + result.name +\n '
';\n // Checking if all callbacks were called\n if (userIsDone === 0) {\n $whoto = $('#whotofollow .users');\n $whoto.append(str);\n $whoto.find('img.lazy').lazyload();\n }\n }\n\n // Doing the requests for each user\n for (; i < length; i += 1) {\n $.get(URL + 'users/' + users[i] +\n '?client_id=5feee647eb6cc3d1f984&client_secret=9ed0c553e278d047a264c3abd26f385144d51ac4',\n cb);\n }\n },\n // Getting the project's contributors\n getGithubContrib: function () {\n var $footer;\n\n // Callback function\n function cb(result) {\n var i = 0,\n length = result.length,\n str = '',\n obj;\n\n for (; i < length; i += 1) {\n obj = result[i];\n\n str += '
' + obj.login +\n '
';\n }\n\n $footer = $('#footer .users');\n $footer.append(str);\n $footer.find('img.lazy').lazyload();\n }\n\n // Doing the request\n $.get(URL +\n 'repos/braziljs/js-the-right-way/contributors?client_id=5feee647eb6cc3d1f984&client_secret=9ed0c553e278d047a264c3abd26f385144d51ac4',\n cb)\n }\n }\n\n}(window, document, jQuery));\n\n// Shuffle the elements of an array\n// Taken from stackoverflow.com/a/2450976\nfunction shuffle(array) {\n var currentIndex = array.length, temporaryValue, randomIndex;\n\n // While there remain elements to shuffle...\n while (0 !== currentIndex) {\n\n // Pick a remaining element...\n randomIndex = Math.floor(Math.random() * currentIndex);\n currentIndex -= 1;\n\n // And swap it with the current element.\n temporaryValue = array[currentIndex];\n array[currentIndex] = array[randomIndex];\n array[randomIndex] = temporaryValue;\n }\n\n return array;\n}\n\n// Starting the Application\nApp.init();\n" }, { "path": "public/assets/js/vendor/jquery.lazyload.js", "content": "/*!\n * Lazy Load - jQuery plugin for lazy loading images\n *\n * Copyright (c) 2007-2015 Mika Tuupola\n *\n * Licensed under the MIT license:\n * http://www.opensource.org/licenses/mit-license.php\n *\n * Project home:\n * http://www.appelsiini.net/projects/lazyload\n *\n * Version: 1.9.7\n *\n */\n\n(function($, window, document, undefined) {\n var $window = $(window);\n\n $.fn.lazyload = function(options) {\n var elements = this;\n var $container;\n var settings = {\n threshold : 0,\n failure_limit : 0,\n event : \"scroll\",\n effect : \"show\",\n container : window,\n data_attribute : \"original\",\n skip_invisible : false,\n appear : null,\n load : null,\n placeholder : \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC\"\n };\n\n function update() {\n var counter = 0;\n\n elements.each(function() {\n var $this = $(this);\n if (settings.skip_invisible && !$this.is(\":visible\")) {\n return;\n }\n if ($.abovethetop(this, settings) ||\n $.leftofbegin(this, settings)) {\n /* Nothing. */\n } else if (!$.belowthefold(this, settings) &&\n !$.rightoffold(this, settings)) {\n $this.trigger(\"appear\");\n /* if we found an image we'll load, reset the counter */\n counter = 0;\n } else {\n if (++counter > settings.failure_limit) {\n return false;\n }\n }\n });\n\n }\n\n if(options) {\n /* Maintain BC for a couple of versions. */\n if (undefined !== options.failurelimit) {\n options.failure_limit = options.failurelimit;\n delete options.failurelimit;\n }\n if (undefined !== options.effectspeed) {\n options.effect_speed = options.effectspeed;\n delete options.effectspeed;\n }\n\n $.extend(settings, options);\n }\n\n /* Cache container as jQuery as object. */\n $container = (settings.container === undefined ||\n settings.container === window) ? $window : $(settings.container);\n\n /* Fire one scroll event per scroll. Not one scroll event per image. */\n if (0 === settings.event.indexOf(\"scroll\")) {\n $container.bind(settings.event, function() {\n return update();\n });\n }\n\n this.each(function() {\n var self = this;\n var $self = $(self);\n\n self.loaded = false;\n\n /* If no src attribute given use data:uri. */\n if ($self.attr(\"src\") === undefined || $self.attr(\"src\") === false) {\n if ($self.is(\"img\")) {\n $self.attr(\"src\", settings.placeholder);\n }\n }\n\n /* When appear is triggered load original image. */\n $self.one(\"appear\", function() {\n if (!this.loaded) {\n if (settings.appear) {\n var elements_left = elements.length;\n settings.appear.call(self, elements_left, settings);\n }\n $(\"\")\n .bind(\"load\", function() {\n\n var original = $self.attr(\"data-\" + settings.data_attribute);\n $self.hide();\n if ($self.is(\"img\")) {\n $self.attr(\"src\", original);\n } else {\n $self.css(\"background-image\", \"url('\" + original + \"')\");\n }\n $self[settings.effect](settings.effect_speed);\n\n self.loaded = true;\n\n /* Remove image from array so it is not looped next time. */\n var temp = $.grep(elements, function(element) {\n return !element.loaded;\n });\n elements = $(temp);\n\n if (settings.load) {\n var elements_left = elements.length;\n settings.load.call(self, elements_left, settings);\n }\n })\n .attr(\"src\", $self.attr(\"data-\" + settings.data_attribute));\n }\n });\n\n /* When wanted event is triggered load original image */\n /* by triggering appear. */\n if (0 !== settings.event.indexOf(\"scroll\")) {\n $self.bind(settings.event, function() {\n if (!self.loaded) {\n $self.trigger(\"appear\");\n }\n });\n }\n });\n\n /* Check if something appears when window is resized. */\n $window.bind(\"resize\", function() {\n update();\n });\n\n /* With IOS5 force loading images when navigating with back button. */\n /* Non optimal workaround. */\n if ((/(?:iphone|ipod|ipad).*os 5/gi).test(navigator.appVersion)) {\n $window.bind(\"pageshow\", function(event) {\n if (event.originalEvent && event.originalEvent.persisted) {\n elements.each(function() {\n $(this).trigger(\"appear\");\n });\n }\n });\n }\n\n /* Force initial check if images should appear. */\n $(document).ready(function() {\n update();\n });\n\n return this;\n };\n\n /* Convenience methods in jQuery namespace. */\n /* Use as $.belowthefold(element, {threshold : 100, container : window}) */\n\n $.belowthefold = function(element, settings) {\n var fold;\n\n if (settings.container === undefined || settings.container === window) {\n fold = (window.innerHeight ? window.innerHeight : $window.height()) + $window.scrollTop();\n } else {\n fold = $(settings.container).offset().top + $(settings.container).height();\n }\n\n return fold <= $(element).offset().top - settings.threshold;\n };\n\n $.rightoffold = function(element, settings) {\n var fold;\n\n if (settings.container === undefined || settings.container === window) {\n fold = $window.width() + $window.scrollLeft();\n } else {\n fold = $(settings.container).offset().left + $(settings.container).width();\n }\n\n return fold <= $(element).offset().left - settings.threshold;\n };\n\n $.abovethetop = function(element, settings) {\n var fold;\n\n if (settings.container === undefined || settings.container === window) {\n fold = $window.scrollTop();\n } else {\n fold = $(settings.container).offset().top;\n }\n\n return fold >= $(element).offset().top + settings.threshold + $(element).height();\n };\n\n $.leftofbegin = function(element, settings) {\n var fold;\n\n if (settings.container === undefined || settings.container === window) {\n fold = $window.scrollLeft();\n } else {\n fold = $(settings.container).offset().left;\n }\n\n return fold >= $(element).offset().left + settings.threshold + $(element).width();\n };\n\n $.inviewport = function(element, settings) {\n return !$.rightoffold(element, settings) && !$.leftofbegin(element, settings) &&\n !$.belowthefold(element, settings) && !$.abovethetop(element, settings);\n };\n\n /* Custom selectors for your convenience. */\n /* Use as $(\"img:below-the-fold\").something() or */\n /* $(\"img\").filter(\":below-the-fold\").something() which is faster */\n\n $.extend($.expr[\":\"], {\n \"below-the-fold\" : function(a) { return $.belowthefold(a, {threshold : 0}); },\n \"above-the-top\" : function(a) { return !$.belowthefold(a, {threshold : 0}); },\n \"right-of-screen\": function(a) { return $.rightoffold(a, {threshold : 0}); },\n \"left-of-screen\" : function(a) { return !$.rightoffold(a, {threshold : 0}); },\n \"in-viewport\" : function(a) { return $.inviewport(a, {threshold : 0}); },\n /* Maintain BC for couple of versions. */\n \"above-the-fold\" : function(a) { return !$.belowthefold(a, {threshold : 0}); },\n \"right-of-fold\" : function(a) { return $.rightoffold(a, {threshold : 0}); },\n \"left-of-fold\" : function(a) { return !$.rightoffold(a, {threshold : 0}); }\n });\n\n})(jQuery, window, document);\n" }, { "path": "public/assets/js/vendor/jquery.scrollstop.js", "content": "/* http://james.padolsey.com/javascript/special-scroll-events-for-jquery/ */\n\n(function(){\n \n var special = jQuery.event.special,\n uid1 = \"D\" + (+new Date()),\n uid2 = \"D\" + (+new Date() + 1);\n \n special.scrollstart = {\n setup: function() {\n \n var timer,\n handler = function(evt) {\n \n var _self = this,\n _args = arguments;\n \n if (timer) {\n clearTimeout(timer);\n } else {\n evt.type = \"scrollstart\";\n jQuery.event.dispatch.apply(_self, _args);\n }\n \n timer = setTimeout( function(){\n timer = null;\n }, special.scrollstop.latency);\n \n };\n \n jQuery(this).bind(\"scroll\", handler).data(uid1, handler);\n \n },\n teardown: function(){\n jQuery(this).unbind( \"scroll\", jQuery(this).data(uid1) );\n }\n };\n \n special.scrollstop = {\n latency: 300,\n setup: function() {\n \n var timer,\n handler = function(evt) {\n \n var _self = this,\n _args = arguments;\n \n if (timer) {\n clearTimeout(timer);\n }\n \n timer = setTimeout( function(){\n \n timer = null;\n evt.type = \"scrollstop\";\n jQuery.event.dispatch.apply(_self, _args);\n \n \n }, special.scrollstop.latency);\n \n };\n \n jQuery(this).bind(\"scroll\", handler).data(uid2, handler);\n \n },\n teardown: function() {\n jQuery(this).unbind( \"scroll\", jQuery(this).data(uid2) );\n }\n };\n \n})();" }, { "path": "public/de-de/index.html", "content": "\n\n \n \n \n \n JS: Der richtige Weg\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

Hey, du!

\n\n

\n Dies ist ein Leitfaden, der Entwicklern beim Einstieg in JavaScript helfen soll und erfahrenen Entwicklern mit Best-Practices helfen soll.\n

\n\n

\n Trotz des Namens steht dieser Leitfaden nicht für \"den einzigen Weg\", den man mit JavaScript gehen kann.\n

\n\n

\n Wir sammeln lediglich all diese Artikel, Tipps und Tricks von namhaften Entwicklern und fügen sie hier ein. Da sie von ausgezeichneten Leuten stammen, können wir sagen, dass es \"der richtige Weg\" oder der beste Weg ist.\n

\n\n
\n
\n\n
\n
\n

Wähle deinen Weg

\n\n \n
\n
\n\n
\n
\n

ERSTE SCHRITTE

\n

ÜBER

\n\n

\n Erstellt von Netscape im Jahre 1995 als eine Erweiterung von HTML für den Netscape Navigator 2.0, waren die grundlegenden Funktionen von JavaScript die Manipulation von HTML-Dokumenten und die Formularvalidierung.\n\n Bevor der Name zu seinem heutigen Bekanntheitsgrad gelangt ist, wurde JavaScript früher Mocha genannt. Als zunächst Beta-Versionen davon erschienen sind, wurde es offiziell LiveScript gennant und schließlich, als es von Sun Microsystems veröffentlicht wurde, hat es den heutigen Namen angenommen.\n\n Wegen der ähnlichen Namen, wird JavaScript oft mit Java verwechselt. Obwohl beide die lexikalische Struktur einer Programmiersprache haben, handelt es nicht um dieselbe Programmiersprache.\n\n Anders als C, C# und Java, ist JavaScript eine interpretierte Programmiersprache. Sie braucht also einen \"Interpreter\". Im Fall von JavaScript, ist der Browser der Interpreter.\n

\n\n

AKTUELLE VERSION

\n\n

\n Der JavaScript-Standard ist ECMAScript. Nach dem Stand von 2012 unterstützen alle modernen Browser ECMAScript 5.1 vollständig. Ältere Browser unterstützen zumindest ECMAScript 3. Nach dem Stand vom Juni 2015 wurde die Spezifikation für ES6/ES2015 verabschiedet. Die ECMAScript 2015 Spezifikation ist verfügbar auf Ecma International.\n

\n\n

\n Eine gute Sammlung für Versionen, Referenzen und Neuigkeiten über JavaScript findet man im Mozilla Developer Network.\n

\n\n

DAS DOM

\n\n

\n Das Document Object Model (DOM) ist eine API für HTML- und XML-Dokumente. Es liefert eine strukturelle Representation des Dokuments. Damit ist es möglich, den Inhalt und die visuelle Präsentation des Dokuments mit einer Skriptsprache wie JavaScript zu verändern. Erfahre mehr unter Mozilla Developer Network - DOM.\n

\n\n
\n
\n\n
\n
\n

JS CODE-STYLE

\n

Richtlinien

\n\n

\n Auch JavaScript hat, so wie jede Programmiersprache, viele unterschiedliche Leitfäden für den Code-Style. Der womöglich am meisten verwendete und weiterempfohlene ist der Google Code-Style-Guide für JavaScript, aber wir empfehlen dir Idiomatic.js zu lesen.\n

\n\n

Code-Analyse (Linting)

\n\n

\n Mittlerweile hat sich als Tool für die Code-Analyse (Linting) von JavaScript-Code JSHint bewährt. Wir empfehlen euch, euren Code-Style und Entwurfsmuster durchgehend mit einem Lint-Tool zu überprüfen.\n

\n\n
\n\n
\n
\n

DIE VORTEILE

\n

Objektorientiert

\n\n

\n JavaScript hat große Möglichkeiten für objektorientierte Programmierung auch wenn es einige Diskussionen bezüglich der Unterschiede von objektorientierten JavaScript zu anderen Programmiersprachen gegeben hat.\n

\n\n

\n Quelle: Einführung in objektorientiertes JavaScript\n

\n\n

Anonyme Funktionen

\n\n

\n Anonyme Funktionen sind Funktionen, die dynamisch zur Laufzeit deklariert werden. Sie werden anonyme Funktionen genannt, weil ihnen im Gegensatz zu normalen Funktionen kein Name vergeben wird.\n

\n\n

\n Quelle: JavaScript anonymous functions\n

\n\n

Funktionen als First-Class-Objekte

\n\n

\n Funktionen sind in JavaScript First-Class-Objekte. Das bedeutet, dass JavaScript-Funktionen einfach nur ein spezieller Typ von Objekten sind, die wie normale Objekte behandelt werden.\n

\n\n

\n Quelle: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n Viele Frontend-Entwickler haben ihre erste Erfahrung mit einer Skript- und/oder interpretierten Sprache mit JavaScript gemacht. Für jene Entwickler mag das Konzept und die Folgen von Variablen mit \"loose typing\" eher zweiter Natur sein. Jedoch hat der rasant steigende Bedarf nach modernen Webapplikationen zur Folge, dass viele Backend-Entwickler in clientseitige Technologien eintauchen. Viele von ihnen kommen aus einem Bereich, in dem Sprachen mit \"strong typing\" wie z.B. C# oder Java verbreitet sind und sind daher nicht vertraut mit der Freiheit und zugleich den möglichen Fallstricken, die das Arbeiten mit \"loose typing\" mit sich bringen.\n

\n\n

\n Quelle: Understanding Loose Typing in JavaScript\n

\n\n

Scoping und Hoisting

\n\n

\n Scoping: In JavaScript sind Funktionen unsere de facto Trennzeichen von Gültigkeitsbereichen (Scopes) für das Deklarieren von Variablen, was wiederum bedeutet, dass die üblichen Blöcke von Schleifen und Bedingungen (wie if, for, while, switch und try) keinen neuen Gültigkeitsbereich (Scope) erzeugen wie in vielen anderen Sprachen. Daher teilen sich diese Blöcke denselben Gültigkeitsbereich wie die Funktion, von der sie umgeben werden. Auf diese Weise kann es gefährlich sein, Variablen innerhalb von Blocks zu definieren, weil es so scheinen mag, als ob die Variable nur zu dem Block gehöre.\n

\n\n

\n Hoisting: Während der Laufzeit werden alle Variablen- und Funktionen-Deklarationen an den Beginn jeder Funktion (ihren Gültigkeitsbereich) gestellt - dieses Verfahren ist als \"Hoisting\" bekannt. Vor diesem Hintergrund ist es eine gute Praxis, Variablen allesamt in der ersten Zeile zu deklarieren, um falschen Erwartungen mit Variablen vorzubeugen, die später deklariert wurden, aber bereits vorher einen Wert beinhalten. Für viele Entwickler, die aus einer Sprache mit blockweisen Gültigkeitsbereichen kommen, ist dies ein häufiger Fallstrick.\n

\n\n

\n Quelle: JavaScript Scoping and Hoisting\n

\n\n

Bindung von Funktionen (Function binding)

\n\n

\n\n Die Bindung von Funktionen ist sehr wahrscheinlich das kleinste Problem beim Einstieg in JavaScript. Wenn man jedoch eine Lösung für das Problem sucht, wie man den Kontext vom Schlüsselwort this in einer anderen Funktion beibehält, dann wird man wahrscheinlich auf Function.prototype.bind() kommen.\n

\n\n

\n Quelle: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure-Funktionen

\n\n

\n Closures sind Funktionen, die auf unabhängige (freie) Variablen verweisen. In anderen Worten: Die Funktion, welche innerhalb einer Closure definiert wurde, merkt sich, in welcher Umgebung sie erstellt wurde.\nDies ist ein wichtiges Konzept, welches man verstehen sollte, weil es während der Entwicklung hilfreich sein kann, um bspw. private Methoden zu emulieren. Es kann ebenfalls dabei helfen, häufige Fehler zu vermeiden, wie bspw. Closures in Schleifen zu erstellen.\n

\n\n

\n Quelle: Closures (Funktionsabschlüsse)\n

\n\n

Strikter Modus

\n\n

\n ECMAScript 5's strikter Modus (Strict Mode) ist eine Möglichkeit, um eine etwas eingeschränktere Variante von JavaScript zu betreten. Der strikte Modus ist nicht einfach nur ein untergeordneter Modus: er hat absichtlich eine andere Semantik als normaler Code. Bei Browsern, die den strikten Modus nicht unterstützen, wird sich Code im strikten Modus anders verhalten als bei Browsern mit Unterstützung. Daher sollte man sich nicht auf den strikten Modus verlassen, ohne die relevanten Aspekte des Modus auf die Unterstützung der entsprechenden Features zu testen. Es kann auch neben Code für den strikten Modus zusätzlich noch Code für den nicht-strikten Modus existieren, damit Skripte bei Möglichkeit den strikten Modus verwenden können.\n

\n\n

\n Quelle: Strict Mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n Ein unmittelbar aufgerufener Funktionsausdruck (Immediately-Invoked Function Expression - IIFE) ist ein Muster, welches einen lexikalischen Gültigkeitsbereich mittels einer JavaScript-Funktion erzeugt. Diese Ausdrücke können dazu genutzt werden, das Hoisting von Variablen innerhalb eines Blocks zu verhindern, sich gegen das Zumüllen der globalen Umgebung zu schützen und zeitgleich öffentlichen Zugang zu Methoden zu schaffen, während die Variablen nur innerhalb ihrer Funktion aufgerufen werden können, also privat bleiben.

\n\n Dieses Muster wurde oft als selbstausführende anonyme Funktion (self-executing anonymous function) bezeichnet, jedoch hat @cowboy (Ben Alman) den Begriff IIFE als semantisch passenderen Begriff für das Muster eingeführt.\n

\n\n

\n Quelle: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

ENTWURFSMUSTER

\n \n

Beschreibung

\n\n

\n Während JavaScript einige exklusive Entwurfsmuster besitzt, können viele klassische Entwurfsmuster ebenfalls implementiert werden.\n

\n\n

\n Ein guter Weg, mehr darüber zu erfahren, ist Addy Osmani’s frei erhältliches Buch \"Learning JavaScript Design Patterns\", auf dem die meisten der unten aufgelisteten Links basieren.\n

\n\n

Entwurfsmuster

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV*-Patterns

\n\n
\n Es gibt einige Implementierungen des traditionellen MVC-Patterns und einige Abwandlungen dessen in JavaScript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

TESTWERKZEUGE

\n

Beschreibung

\n\n

Verschiedene Bibliotheken und Frameworks, um Tests in JavaScript auszuführen.

\n\n\n

Links

\n
\n \n
\n\n

\n wird gewartet von TJ Holowaychuk\n

\n
\n \n
\n\n

\n wird gewartet von jQuery\n

\n
\n \n
\n\n

\n wird gewartet von Pivotal Labs\n

\n
\n \n
\n\n

\n wird gewartet von dem Team hinter AngularJS. Am meisten durch Vojta Jina\n

\n
\n \n
\n\n

\n wird gewartet von Sitepen\n

\n
\n \n
\n\n

\n Ein JavaScript Code-Coverage-Tool, geschrieben in JavaScript. Wird gewartet von Krishnan Anantheswaran\n

\n
\n \n
\n\n

\n Eigenständige Test-Spies, Stubs und Mocks für JavaScript. Keine Abhängigkeiten, funktioniert mit beliebigen Unit-Test-Frameworks. Erstellt von der Sinon.JS Community\n

\n
\n \n
\n\n

\n Ein Test-Helferlein, um Mocks von Funktionen und dem XHR-Objekt zu erstellen, gewartet von Leo Balter\n

\n
\n \n
\n\n

\n Test Runner mit asynchronen Tests, gewartet von Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

FRAMEWORKS

\n\n

ALLGEMEINER ZWECK

\n
\n \n
\n\n

\n jQuery ist eine schnelle, kleine und featurereiche JavaScript-Bibliothek. Erstellt von John Resig.\n

\n
\n \n
\n\n

\n Erstellt von Yahoo!, YUI ist eine freie, quelloffene JavaScript- und CSS-Bibliothek für die Erstellung von interaktiven Webanwendungen. Die Weiterentwicklung wurde seit dem 29. August 2014 gestoppt..\n

\n
\n \n
\n\n

\n Zepto ist eine minimalistische Javascript-Bibliothek für moderne Browser mit einer weitestgehend jQuery-kompatiblen API. Wenn du bereits jQuery verwendest, weißt du bereits, wie man Zepto benutzt.\n

\n
\n \n
\n\n

\n Dojo ist ein freies, quelloffenes JavaScript-Toolkit zum Erstellen von hochperformanten Webanwendungen. Projektsponsoren umfassen unter anderem IBM und SitePen.\n

\n
\n \n
\n\n

\n Underscore.js ist eine JavaScript-Bibliothek, die unterschiedlichste hilfreiche und funktionale Programmhelferlein bietet, ohne die eingebauten Objekte zu verändern.\n

\n

MV*

\n
\n \n
\n\n

\n Sehr beliebtes clientseitiges JavaScript-Framework, erstellt von @jashkenas.\n

\n
\n \n
\n\n

\n Erstellt von @wycats, jQuery und den Ruby on Rails-Hauptentwicklern.\n

\n
\n \n
\n\n

\n Vereinfacht dynamische JavaScript-UIs, indem es dem Model-View-View Model (MVVM)-Schema folgt.\n

\n
\n \n
\n\n

\n Erstellt von Google, Angular.js ist eine Art Polyfill für die Zukunft von HTML.\n

\n
\n \n
\n\n

\n Ein framework.Mobile & desktop. Eine Möglichkeit, Anwendungen mit Angular zu erstellen und Ihren Code und Fähigkeiten zu verwenden, um Anwendungen für jedes Deployment-Ziel zu erstellen. Für Web, mobiles Web, native mobile und native Desktop.\n

\n
\n \n
\n\n

\n Cappuccino ist ein quelloffenes Framework, welches die Erstellung von Desktop-Caliber-Anwendungen, die im Webbrowser laufen, vereinfacht.\n

\n
\n \n
\n\n

\n JavaScriptMVC ist ein quelloffenes Framework, welches die besten Ideen aus der jQuery-Entwicklung beinhaltet.\n

\n
\n \n
\n\n

\n Meteor ist eine quelloffene Plattform zum Erstellen von qualitativ hochwertigen Web-Apps in kürzester Zeit, egal ob du ein erfahrerener Entwickler bist oder gerade erst angefangen hast.\n

\n
\n \n
\n\n

\n Spice ist ein extrem minimales (< 3k) und flexibles MVC-Framework für JavaScript. Spice kann leicht in bestehende Anwendungen integriert werden und arbeitet gut mit anderen Technologien wie jQuery, pjax, turbolinks, node oder womit auch immer du arbeitest, zusammen\n

\n
\n \n
\n\n

\n Riot ist eine unglaublich schnelle, mächtige und zugleich kleine clientseitige (MV*) Bibliothek zum Erstellen von umfangreichen Webanwendungen. Trotz der kleinen Größe sind alle wichtigen Bausteine vorhanden: eine Template-Engine, ein Router, eine Event-Bibliothek und ein striktes MVP-Muster, um Dinge organisiert zu halten.\n

\n
\n \n
\n\n

\n CanJS ist ein JavaScript-Framework, welches die Entwicklung von komplexen Anwendungen einfach und schnell macht. Einfach zu erlernen, klein und eine flexible Anwendungsstruktur, dazu moderne Features wie Custom Tags und Two-Way-Binding.\n

\n

Bibliotheken

\n
\n \n
\n\n

\n Erstellt von Facebook. React ist eine JavaScript-Bibliothek zum Erstellen von User Interfaces von Facebook und Instagram. React wird von vielen als das V in MVC angesehen.\n

\n
\n \n
\n\n

\n Handlebars bietet die Mächtigkeit, semantische Templates effektiv ohne Frust zu erstellen.\n

\n
\n \n
\n\n

\n Asynchrone Templates für den Browser und node.js.\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n

Animation

\n
\n \n
\n\n

\n Velocity ist eine Animations-Engine mit derselben API wie jQuerys $.animate().\n

\n
\n \n
\n\n

\n Bounce.js ist ein Werkzeug und eine JS-Bibliothek, mit dem man schöne CSS3 getriebene Animationen erstellen kann.\n

\n
\n \n
\n\n

\n Eine einfache aber mächtige JavaScript-Bibliothek für das Animieren und Tweenen von HTML5- und JavaScript-Objekten.\n

\n
\n \n
\n\n

\n Move.js ist eine kleine JavaScript-Bibliothek, die das Erstellen von CSS3 getriebenen Animationen extrem einfach und elegant macht.\n

\n
\n \n
\n\n

\n SVG ist ein ausgezeichneter Weg, um interaktive, auflösungsunabhängige Vektorgrafiken zu erstellen, die auf allen Bildschirmgrößen gut aussehen.\n

\n
\n \n
\n\n

\n Rekapi ist eine Bibliothek zum Erstellen sowohl von Canvas- und DOM-Animationen mit JavaScript als auch von CSS @keyframe-Animationen für moderne Browser.\n

\n
\n \n
\n\n

\n Mach Gebrauch von deinem Favicon mit Badges, Bildern oder Videos.\n

\n
\n \n
\n\n

\n Textillate.js kombiniert einige geniale Bibliotheken, um ein einfach zu verwendendes Plugin zum Zuweisen von CSS3-Animationen zu jeglichen Texten zur Verfügung zu stellen.\n

\n
\n \n
\n\n

\n Motio ist eine kleine JavaScript-Bibliothek für einfache aber umfangreiche auf Sprites basierende Animationen und Panning.\n

\n
\n \n
\n\n

\n Mit Anima ist es einfach, mehr als hundert Objekte zur selben Zeit zu animieren. Jedem Element kann eine Masse und Viskosität zugewiesen werden, um reale Objekte zu emulieren.\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

SPIELE-ENGINES

\n\n
\n
\n \n
\n\n

\n MelonJS ist eine freie, leichtgewichtige HTML5 Spiele-Engine. Die Engine verwendet ein tiled Map-Format, welches das Leveldesign vereinfacht.\n

\n
\n \n
\n\n

\n ImpactJS ist eine der eher länger bewährten HTML5 Spiele-Engines, deren erste Veröffentlichung bis Ende 2010 zurückreicht. Sie wird sehr gut gewartet und regelgemäßig geupdatet und hat eine große Community, die sie unterstützt. Es existieren sowohl umfangreiche Dokumentationen als auch zwei Bücher zum Thema Spieleentwicklung mit dieser Engine.\n

\n
\n \n
\n\n

\n LimeJS ist ein HTML5 Spiele-Framework zum Erstellen von schnellen, native-experience Spielen für alle modernen Touchscreens und Desktop-Browser.\n

\n
\n \n
\n\n

\n Crafty ist eine Spiele-Engine, welche von Ende 2010 stammt. Crafty ermöglicht einen einfachen Einstieg in das Erstellen von JavaScript-Spielen.\n

\n
\n \n
\n\n

\n Cocos2d-HTML5 ist ein quelloffenes 2D Web-Spiele-Framework, veröffentlicht unter der MIT Lizenz. Es ist eine HTML5-Version von dem Cocos2d-x Projekt. Das Ziel der Cocos2d-HTML5- Entwicklung ist, Cocos2d plattformunabhängig von Browsern und nativen Anwendungen zu machen.\n

\n
\n \n
\n\n

\n Phaser basiert stark auf Flixel. Es wird gewartet von Richard Davey (Photon Storm), der in der HTML5-Community bereits seit Jahren sehr aktiv ist.\n

\n
\n \n
\n\n

\n Goo ist eine 3D JavaScript-Spiele-Engine, die komplett auf WebGL/HTML5 aufbaut.\n

\n
\n \n
\n\n

\n LycheeJS ist eine JavaScript-Spiele-Bibliothek, die eine Komplettlösung für das Prototyping und die Entwicklung von HTML5 Canvas, WebGL oder nativen OpenGL(ES) basierten Spielen innerhalb des Browsers oder einer nativen Umgebung bietet.\n

\n
\n \n
\n\n

\n Quintus ist eine HTML5-Spiele-Engine, die einen modularen und leichtgewichtigen Ansatz mit einer prägnanten JavaScript-freundlichen Syntax verfolgt.\n

\n
\n \n
\n\n

\n Kiwi.js ist eine lustige und freundliche quelloffene HTML5-Spiele-Engine. Manche bezeichnen es als WordPress der HTMl5-Spiele-Engines.\n

\n
\n \n
\n\n

\n Panda.js ist eine HTML5-Spiele-Engine mit Canvas und WebGL-Rendering für mobile Endgeräte und für den Desktop.\n

\n
\n \n
\n\n

\n Rot.js ist eine Sammlung von JavaScript Bibliotheken, die einen bei der Rogue-like Entwicklung in der Browserumgebung unterstützen soll.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

Neuigkeiten

\n\n

Webseiten

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Newsletter

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

Literatur

\n\n

Artikel

\n\n\n
\n \n
\n\n

\n von Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n von Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n von Scott Allen\n

\n\n\n
\n \n
\n\n

\n von Ben Alman\n

\n\n\n
\n \n
\n\n

\n von Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n von Viljami S.\n

\n\n\n
\n \n
\n\n

\n von Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n von Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n von JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n von Ju Gonçalves\n

\n\n\n\n

Bücher

\n\n\n
\n \n
\n\n

\n von Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n von David Flanagan\n

\n\n\n
\n \n
\n\n

\n von Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n von Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n von James Coglan\n

\n\n\n
\n \n
\n\n

\n von Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n von Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n von Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n von Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n von Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n von Addy Osmani\n

\n\n\n
\n \n
\n\n

\n von John Resig\n

\n\n\n
\n \n
\n\n

\n von Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n von Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n von Christian Johansen\n

\n\n\n
\n \n
\n\n

\n von >Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n von Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n von Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n von David Herman\n

\n\n\n
\n \n
\n\n

\n von Michael Fogus\n

\n\n\n
\n \n
\n\n

\n von Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n von Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n von DevFreeBooks\n

\n\n\n\n

Kostenlose E-Books

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Portale

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix's Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Podcasts

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Screencasts

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

Wem ist zu folgen

\n\n
\n
\n
\n\n
\n
\n

PaaS-Anbieter

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Helferlein

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"Webpack\"\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Erstellt und gewartet von

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Mitwirkende

\n

Dieses Projekt wäre ohne die Hilfe von diesen großartigen Personen nicht zustande gekommen. Vielen Dank, dass ihr es ermöglicht!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: Der richtige Weg von William Oliveira.
Lizenziert unter einer Creative Commons Namensnennung - Nicht kommerziell 4.0 International Lizenz.
Basierend auf der Arbeit an http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/en-us/index.html", "content": "\n\n \n \n \n \n JS: The Right Way\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

Hey, you!

\n\n

\n This is a guide intended to introduce new developers to JavaScript and help experienced developers learn more about its best practices.\n

\n\n

\n Despite the name, this guide doesn't necessarily mean \"the only way\" to do JavaScript.\n

\n\n

\n We just gather all the articles, tips, and tricks from top developers and put it here. Since it comes from exceptional folks, we could say that it is \"the right way\", or the best way to do so.\n

\n\n
\n
\n\n
\n
\n

Choose your path

\n\n \n
\n
\n\n
\n
\n

GETTING STARTED

\n

ABOUT

\n\n

\n Created by Netscape in 1995 as an extension of HTML for Netscape Navigator 2.0, JavaScript had as its main function the manipulation of HTML documents and form validation.\n\n Before winning this name so famous nowadays, JavaScript was called Mocha. When it first shipped in beta releases, it was officially called LiveScript and finally, when it was released by Sun Microsystems, was baptized with the name by which it is known today.\n\n Because of the similar names, people confuse JavaScript with Java. Although both have the lexical structure of programming, they are not the same language.\n\n Different from C, C# and Java, JavaScript is an interpreted language. It means that it needs an \"interpreter\". In case of JavaScript, the interpreter is the browser.\n

\n\n

CURRENT VERSION

\n\n

\n The JavaScript standard is ECMAScript. As of 2012, all modern browsers fully support ECMAScript 5.1. Older browsers support at least ECMAScript 3. As of June 2015 the spec for ES6/ES2015 has been approved. Following the new annual release cycle, ES7/ES2016 has been adopted in June 2016. See the ECMAScript 2016 Language Specification at Ecma International.\n

\n\n

\n A good reference to versions, references and news about JavaScript can be found at the Mozilla Developer Network.\n

\n\n

THE DOM

\n\n

\n The Document Object Model (DOM) is an API for HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript. See more at Mozilla Developer Network - DOM.\n

\n\n
\n
\n\n
\n
\n

JS CODE STYLE

\n

Conventions

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

Linting

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n\n
\n\n
\n
\n

THE GOOD PARTS

\n

Object Oriented

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

Anonymous Functions

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

Function Binding

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\nIt is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n

Strict mode

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

PATTERNS

\n\n

Description

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

Design Patterns

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

TESTING TOOLS

\n

Description

\n\n

Various libraries and frameworks to do tests in JavaScript.

\n\n\n

Links

\n
\n \n
\n\n

\n Maintained by TJ Holowaychuk\n

\n
\n \n
\n\n

\n Maintained by jQuery\n

\n
\n \n
\n\n

\n Maintained by Pivotal Labs\n

\n
\n \n
\n\n

\n Maintained by the team behind AngularJS. Mostly by Vojta Jina\n

\n
\n \n
\n\n

\n Maintained by Sitepen\n

\n
\n \n
\n\n

\n A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\n

\n
\n \n
\n\n

\n Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Sinon.JS community\n

\n
\n \n
\n\n

\n A test helper to mock functions and the XHR object, maintained by Leo Balter\n

\n
\n \n
\n\n

\n Test runner with asynchronous tests, maintained by Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

FRAMEWORKS

\n\n

GENERAL PURPOSE

\n
\n \n
\n\n

\n jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\n

\n
\n \n
\n\n

\n Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\n

\n
\n \n
\n\n

\n Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\n

\n
\n \n
\n\n

\n Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\n

\n
\n \n
\n\n

\n Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\n

\n

MV*

\n
\n \n
\n\n

\n Very popular JavaScript client-side framework, built by @jashkenas.\n

\n
\n \n
\n\n

\n Built by @wycats, jQuery and Ruby on Rails core developer.\n

\n
\n \n
\n\n

\n Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\n

\n
\n \n
\n\n

\n Built by Google, Angular.js is like a polyfill for the future of HTML.\n

\n
\n \n
\n\n

\n One framework.Mobile & desktop. One way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.\n

\n
\n \n
\n\n

\n Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\n

\n
\n \n
\n\n

\n JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\n

\n
\n \n
\n\n

\n Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\n

\n
\n \n
\n\n

\n Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\n

\n
\n \n
\n\n

\n Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\n

\n
\n \n
\n\n

\n CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\n

\n

Library

\n
\n \n
\n\n

\n Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\n

\n
\n \n
\n\n

\n Is an MVVM library providing two-way data binding, HTML extended behaviour (through directives) and reactive components. By using native add-ons a developer can also have routing, AJAX, a Flux-like state management, form validation and more. Provides a helpful Chrome extension to inspect components built with Vue.\n

\n
\n \n
\n\n

\n Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n

Animation

\n
\n \n
\n\n

\n GSAP is the fastest full-featured scripted animation tool on the planet. It's even faster than CSS3 animations and transitions in many cases.\n

\n
\n \n
\n\n

\n Velocity is an animation engine with the same API as jQuery's $.animate().\n

\n
\n \n
\n\n

\n Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.\n

\n
\n \n
\n\n

\n A simple but powerful JavaScript library for tweening and animating HTML5 and JavaScript properties.\n

\n
\n \n
\n\n

\n Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.\n

\n
\n \n
\n\n

\n SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen.\n

\n
\n \n
\n\n

\n Rekapi is a library for making canvas and DOM animations with JavaScript, as well as CSS @keyframe animations for modern browsers.\n

\n
\n \n
\n\n

\n Make use of your favicon with badges, images or videos.\n

\n
\n \n
\n\n

\n Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.\n

\n
\n \n
\n\n

\n Motio is a small JavaScript library for simple but powerful sprite based animations and panning.\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

GAME ENGINES

\n\n
\n
\n \n
\n\n

\n MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\n

\n
\n \n
\n\n

\n ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\n

\n
\n \n
\n\n

\n LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\n

\n
\n \n
\n\n

\n Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\n

\n
\n \n
\n\n

\n Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\n

\n
\n \n
\n\n

\n Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\n

\n
\n \n
\n\n

\n Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\n

\n
\n \n
\n\n

\n LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\n

\n
\n \n
\n\n

\n Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\n

\n
\n \n
\n\n

\n Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\n

\n
\n \n
\n\n

\n Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\n

\n
\n \n
\n\n

\n Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates.\n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

News

\n\n

Websites

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Newsletter

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

Reading

\n\n

Articles

\n\n\n
\n \n
\n\n

\n by Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n by Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n by Scott Allen\n

\n\n\n
\n \n
\n\n

\n by Ben Alman\n

\n\n\n
\n \n
\n\n

\n by Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Viljami S.\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n by Ju Gonçalves\n

\n\n\n\n

Books

\n\n\n
\n \n
\n\n

\n by Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n by David Flanagan\n

\n\n\n
\n \n
\n\n

\n by Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by James Coglan\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n by Addy Osmani\n

\n\n\n
\n \n
\n\n

\n by John Resig\n

\n\n\n
\n \n
\n\n

\n by Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by Christian Johansen\n

\n\n\n
\n \n
\n\n

\n by Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n by Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n by Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n by David Herman\n

\n\n\n
\n \n
\n\n

\n by Michael Fogus\n

\n\n\n
\n \n
\n\n

\n by Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

Free E-Books

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Portals

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Podcasts

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Screencasts

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

Who To Follow

\n\n
\n
\n
\n\n
\n
\n

PaaS Providers

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Helpers

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"Webpack\"\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Created and maintained by

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Contributors

\n

This project wouldn't exist without these amazing contributors. Thank you guys for making this real!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n\n" }, { "path": "public/es-es/index.html", "content": "\n\n \n \n \n \n JS: La forma correcta\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

Oye, tú!

\n\n

\n Esta es una guía que busca introducir a nuevos desarrolladores en JavaScript y que busca también que los desarrolladores más experimentados conozcan un poco más sobre las mejores prácticas.\n

\n\n

\n A pesar del nombre de esta guía, no significa que sea necesariamente \"la única forma\" para realizar JavaScript.\n

\n\n

\n Nosotros solo hemos reunidos todos los artículos, consejos, y trucos de los principales desarrolladores y colocado aquí. Ya que viene de personas excepcionales, nosotros podemos decir que esta es la \"la forma correcta\", la mejor forma de escribir código en JavaScript.\n

\n\n
\n
\n\n
\n
\n

Elije tu camino

\n\n \n
\n
\n\n
\n
\n

PRIMEROS PASOS

\n

ACERCA

\n\n

\n Creado por Netscape en 1995 como una extensión de HTML para Netscape Navigator 2.0, JavaScript ha tenido como función principal la manipulación de los documentos HTML y la validación de formularios.\n\n Antes de ganar su nombre muy famoso en estos días, JavaScript fue llamado Mocha. Cuando fue lanzada su primera publicación beta, fue oficialmente llamado LiveScript y finalmente, cuando fue publicado por Sun Microsystems, fue bautizado con el nombre por el cual es conocido hoy.\n\n A causa de los nombres similares, las personas confunden JavaScript con Java. Aunque ambos tienen la estructura léxica de programación, ellos son lenguajes muy diferentes.\n\n Diferente de C, C# y Java, JavaScript es un lenguaje interpretado. Significa que este requiere un \"interpreter\". En el caso de JavaScript, el interpreter es el navegador.\n

\n\n

VERSION ACTUAL

\n\n

\n El estándar de JavaScript es ECMAScript. A partir del 2012, todos los navegadores modernos soportan completamente ECMAScript 5.1. Los navegadores antiguos soportan al menos ECMAScript 3. En Junio de 2015 la especificación para la versión ES6/ES2015 fue aprobada. Puedes revisar las especificaciones de la version 2015 de ECMAScript en Ecma International.\n

\n\n

\n Una buena referencia sobre las versiones, documentación, noticias y demás sobre JavaScript puede encontrarse en la Red de Desarrolladores de Mozilla.\n

\n\n

EL DOM

\n\n

\n El Modelo de Objetos del Documento (DOM) es un API para documentos HTML y XML. Este prevee una representación estructural del documento, permitiéndole modificar su contenido y presentación visual mediante el uso de un lenguaje de scripting tal como JavaScript. Ver mas en Red de Desarrolladores de Mozilla - DOM.\n

\n\n
\n
\n\n
\n
\n

ESTILO DE CODIGO DE JS

\n

Convenciones

\n\n

\n Como todo lenguaje, JavaScript tiene muchas guías de estilo. Quizas la más usada y recomendada es la Guía de Estilo de Google para JavaScript, pero nosotros te recomendamos leer Idiomatic.js.\n

\n\n

Linting

\n\n

\n Actualmente la mejor herramienta para realizar linting (análisis) del código en JavaScript es JSHint. Nosotros recomendamos que siempre que sea posible se verifique el estilo y los patrones del código con una herramienta de análisis del código.\n

\n\n
\n\n
\n
\n

LAS BUENAS PARTES

\n

Orientado a Objetos

\n\n

\n JavaScript tiene un fuerte enfoque de programación orientada a objetos, a pesar de algunos debates que tienen lugar debido a las diferencias de la orientacion a objetos en Javascript comparado con otros lenguajes.\n

\n\n

\n Fuente: Introducción a JavaScript Orientado a Objetos\n

\n\n

Anonymous Functions (Funciones Anónimas)

\n\n

\n Funciones anómimas que son declaradas dinámicamente en tiempo de ejecución. Son llamadas anónimas porque no poseen un nombre de la misma manera que las funciones normales.\n

\n\n

\n Fuente: Funciones anónimas\n

\n\n

Functions as First-class Objects (Funciones de Objetos de primera clase)

\n\n

\n Las funciones en JavaScript son objetos de primera clase. Esto significa que las funciones son simplemente un tipo de objeto especial, con las cuales se pueden hacer las mismas cosas que cualquier otro objeto podria hacer.\n

\n\n

\n Fuente: Las funciones son objetos de primera clase en JavaScript\n

\n\n

Loose Typing (Tipado Blando)

\n\n

\n Para muchos desarrolladores front-end, JavaScript fue su primera experiencia en lenguajes de scripting y/o interpretados. Para estos desarrolladores, el concepto y las implicaciones de las variables de tipado blando quizas son de segunda naturaleza. Como siempre, el crecimiento explosivo en demanda para aplicaciones web modernas, ha resultado en un crecimiento en el número de desarrolladores back-end que han tenido que meter sus manos en tecnologías del lado del cliente. Muchos de estos programadores llegan experiencia en lenguajes de tipado fuerte, tales como C# o Java, y le resultan desconocidas las libertades y las potenciales trampas envueltas en el trabajo con variables de tipado blando.\n

\n\n

\n Fuente: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting (Alcance y Elevación)

\n\n

\n Scoping o Alcance: En JavaScript, las funciones son nuestras delimitadoras del alcance de facto al momento de la declaración de variables, lo cual significa que los bloques que son de bucles y condicionales (tales como if, for, while, switch y try) NO delimitan el alcance, a diferencia de la mayoría de otros lenguajes. Por lo tanto, estos bloques compartirán el mismo alcance que la función que las contiene. De esta forma, podría ser peligroso declarar variables dentro de bloques si se requiere que las variables sólo sean vistas en el bloque que pertenecen.\n

\n\n

\n Hoisting o Elevación: En ejecución, todas las declaraciones var y function son movidas para el comienzo de cada función (su alcance) - esto es conocido como Elevación. Dicho esto, es buena practica declarar todas las variables juntas en la primera línea, con el fín de evitar falsas expectativas con las variables que han sido declaradas luego de la asignación de su valor - esto es un problema común con programadores que llegan de lenguajes con alcance de bloques.\n

\n\n

\n Fuente: Alcance y Elevación en JavaScript\n

\n\n

Function Binding (Función de Vinculación)

\n\n

\n La Función de Vinculación es probablemente la última de las preocupaciones de un principiante con JavaScript, pero cuando se entiende que necesita una solución al problema de cómo mantener el contexto de 'this' dentro de otra función, entonces puede darse cuenta que de hecho necesita de la función bind Function.prototype.bind().\n

\n\n

\n Fuente: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function (Función de Clausura)

\n\n

\n Las Clausuras o closures son funciones que hacen referencia a variables independientes (libres). En otras palabras, la función definida en el closure 'recuerda' el ambiente en el cual esta fue creado.\nEsto es un importante concepto para entender, así como útil durante el desarrollo, por ejemplo emular métodos privados. Esto puede también ayuda a aprender como evitar errores, como crear closures en bucles.\n

\n\n

\n Fuente: MDN - Clausuras\n

\n\n

Strict mode (Modo Estricto)

\n\n

\n El modo estricto de ECMAScript 5 es una manera de optar por una forma restringida de JavaScript. El modo estricto no es solo un subconjunto: este tiene intencionalmente una semántica diferente del código normal. Los navegadores que no soportan el modo estricto correran el código de forma distinta con aquellos navegadores que lo soportan, entonces no confie en el modo estricto sin realizar una prueba de características, asegurando el soporte de los aspectos relevantes del modo estricto. El código en modo estricto y en modo no estrícto pueden coexistir, de esta forma, scripts pueden optar entrar al modo estrícto de forma incremental.\n

\n\n

\n Fuente: MDN - Modo Estricto\n

\n\n

Immediately-Invoked Function Expression (IIFE) (Expresión de Función Inmediatamente Invocada)

\n\n

\n Una expresión de función inmediatamente invocada es un patrón el cual produce un scope lexico usando las funciones de scoping de Javascript. La Expresión de función imadiatamente invocada puede ser usada para evitar el hoisting de las variables con los bloques, protege contra la contaminación del ambiente global y simultáneamente permite acceder a los métodos publicos al tiempo que conserva la privacidad en las variables definidas dentro de la función.

\n Este patrón ha sido referido como una función anónima autoejecutable, pero @cowboy (Ben Alman) introduce el termino IIFE como un término semántico más exacto para el patrón.\n

\n\n

\n Fuente: Expresión de Función Inmediatamente Invocada (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

PATRONES

\n \n

Descripción

\n\n

\n Mientras JavaScript contiene patrones de diseño que son exclusivos para el lenguaje, muchos patrones de diseño de otros lenguajes pueden ser también implementados.\n

\n\n

\n Una buena forma de aprender acerca de estos patrones es el libro de Addy Osmani de código abierto Aprender Patrones de Diseño en JavaScript. Los enlaces referenciados son (en su mayoría) basados en este.\n

\n\n

Patrones de Diseño

\n\n
\n \n
\n\n

\n Patrones de Diseño Creacionales\n

\n\n
\n \n
\n\n

\n Patrones de Diseno Estructural\n

\n\n
\n \n
\n\n

\n Patrones de Diseno de Comportamiento\n

\n\n

Patrones MV*

\n\n
\n Existen algunas implementaciones del tradicional patron MVC y sus variaciones en JavaScript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

HERRAMIENTAS DE PRUEBAS

\n

Descripción

\n\n

Varias librerias y frameworks para realizar pruebas en JavaScript.

\n\n\n

Links

\n
\n \n
\n\n

\n Mantenido por TJ Holowaychuk.\n

\n
\n \n
\n\n

\n Mantenido por jQuery.\n

\n
\n \n
\n\n

\n Mantenido por Pivotal Labs.\n

\n
\n \n
\n\n

\n Mantenido por el equipo detrás de AngularJS. Mayormente por Vojta Jina.\n

\n
\n \n
\n\n

\n Mantenido por Sitepen.\n

\n
\n \n
\n\n

\n Una herramienta de cobertura de código JavaScript escrita en JavaScript, mantenida por Krishnan Anantheswaran.\n

\n
\n \n
\n\n

\n Espias de pruebas autónomos, stubs y mocks para JavaScript. Sin ependencias, trabaja con cualquier framework de pruebas unitarias. Creado por Sinon.JS community.\n

\n
\n \n
\n\n

\n Un ayudante para simular funciones y objetos XHR, mantenido por Leo Balter.\n

\n
\n \n
\n\n

\n Test runner with asynchronous tests, maintained by Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

FRAMEWORKS

\n\n

PROPOSITO GENERAL

\n
\n \n
\n\n

\n jQuery es una libreria hecha en Javascript rápida, pequeña, y abundante en características. Construida por John Resig.\n

\n
\n \n
\n\n

\n Creado por Yahoo!, YUI es una libreria Javascript y CSS de código abierto para construir aplicaciones web altamente interactivas. Apartir del 29 de Agosto del 2014 se detuvo el desarrollo del framework.\n

\n
\n \n
\n\n

\n Zepto es una libreria JavaScript minimalista para navegadores modernos con una API en gran parte compatible con jQuery. Si usas jQuery, estas listo para conocer como se usa Zepto.\n

\n
\n \n
\n\n

\n Dojo dispone de una serie de herramientas Javascript gratuitas, de código abierto para construir aplicaciones web de alto rendimento. IBM y SitePen son patrocinadores del proyecto.\n

\n
\n \n
\n\n

\n Underscore.js es una libreria JavaScript que nos proporciona una serie de utilidades de la programación funcional sin necesidad de extender de alguno de los objetos preconstruidos.\n

\n

MV*

\n
\n \n
\n\n

\n Creado por @wycats, jQuery y personas del equipo de desarrollo de Ruby on Rails.\n

\n
\n \n
\n\n

\n Framework javascript del lado del cliente muy popular, Construido por @jashkenas.\n

\n
\n \n
\n\n

\n Simplifica la creación de UI dinámicas en JavaScript aplicando el patrón Model-View-View Model (MVVM).\n

\n
\n \n
\n\n

\n Construido por Google, Angular.js es como un polyfill para el HTML del futuro.\n

\n
\n \n
\n\n

\n Un framework.Mobile y escritorio. Una forma de crear aplicaciones con Angular y usar su código y habilidades para crear aplicaciones para cada meta de implementación. Para web, web móvil, teléfono móvil nativo y escritorio nativo.\n

\n
\n \n
\n\n

\n Cappuccino es un framework de código abierto que hace fácil la contrucción de aplicaciones del calibre de aplicaciones desktop pero que se ejecutaran en un navegador web.\n

\n
\n \n
\n\n

\n JavaScriptMVC es un framework de código abierto que contiene las mejores ideas del desarrollo con jQuery.\n

\n
\n \n
\n\n

\n Meteor es una plataforma de código abierto para construir aplicaciones web de alta calidad en corto tiempo, ideal para programadores avanzados, y también para programadores que hasta ahora estan comenzando.\n

\n
\n \n
\n\n

\n Spice es un framework MVC flexible y extremadamente leve(< 3k) para javascript. Spice fue construido para ser agregado fácilmente a cualquier aplicación existente y para coexistir con otras tecnologías tales como jQuery, pjax, turbolinks, node o cualquier otra libreria existente.\n

\n
\n \n
\n\n

\n Riot es una libreria (MV*) incriblemente rápida, poderosa y aún así ligera del lado del cliente para contruir aplicacione web de gran escala. A pesar de ser tan ligera cuenta con todas las funcionalidades necesarias: un motor de plantillas, enrutador, libreria para el control de eventos y un patrón MVP estricto para mantener todo organizado.\n

\n
\n \n
\n\n

\n CanJS es un framework Javascript que hace el desarrollo de aplicaciones complejas sencillo y rápido. De fácil aprendizaje, pequeña, y sin forzar a utilizar ninguna estructura de aplicación, cuenta con características modernas como custom tags (etiquetas html customizadas) y 2-way binding (Vinculación de doble vía).\n

\n

Librerias

\n
\n \n
\n\n

\n Creada por Facebook. React es una libreria para crear interfaces de usuarios utilizada por Facebook e Instagram. Muchas personas tienen a pensar en React como el componente V (La vista) en el módelo MVC.\n

\n
\n \n
\n\n

\n Handlebars provee el poder necesario para permitir la construción de plantillas semanticas sin ninguna fustración.\n

\n
\n \n
\n\n

\n Plantillas asincronas para el navegador y node.js\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n

Animación

\n
\n \n
\n\n

\n Velocity es un motor de animaciones que hace uso de la misma API de JQuery $.animate().\n

\n
\n \n
\n\n

\n Bounce.js es una herramienta y una libreria de JS que permite crear poderosas animaciones CSS3.\n

\n
\n \n
\n\n

\n Una libreria de Javascript simple pero poderosa para interpolar y animar elementos de HTML5 y de JavaScript.\n

\n
\n \n
\n\n

\n Move.js es una pequeña libreria de JavaScript que permite crear animaciones CSS3 extremadamente simples y elegantes.\n

\n
\n \n
\n\n

\n SVG es una excelente forma de crear vectores gráficos interactivos, independientes de la resolución, los cuales luciran geniales en cualquier tamaño de pantalla.\n

\n
\n \n
\n\n

\n Rekapi es una libreria para crear animaciones en el canvas y en el DOM con Javascript, permitiendo también animaciones CSS utilizando @keyframe para los navegadores modernos.\n

\n
\n \n
\n\n

\n Realiza tu favicon con banderillas, imagenes o videos.\n

\n
\n \n
\n\n

\n Textillate.js hace uso de algunas librerias increibles para proveer un plugin sencillo para realizar animaciones CSS3 en cualquier texto.\n

\n
\n \n
\n\n

\n Motio es una pequeña libreria JavaScript para crear animacione simples y poderosas basadas en sprites.\n

\n
\n \n
\n\n

\n Con Anima es fácil animar sobre cientos de objetos al mismo tiempo. Cada objeto cuenta con su propia masa y viscocidad para emular objetos reales!\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

MOTORES DE JUEGO

\n\n
\n
\n \n
\n\n

\n MelonJS es un motor de juegos en HTML5 gratuito y ligero. El motor integra el formato de mapa de baldosas haciendo el diseño de niveles muy fácil.\n

\n
\n \n
\n\n

\n ImpactJS es uno de los mas probados y verdaderos motores de juegos en HTML5. Su publicación inicial se remonta a finales del 2010. Se encuentra muy bien mantenido y actualizado, y tiene toda una comunidad de gran tamaño que lo respalda. Existe suficiente documentación - incluso dos libros para la creación juegos con el motor ImpactJS.\n

\n
\n \n
\n\n

\n LimeJS is en un framework para la creación rápida de juegos en HTML5, creando una experiencia nativa en los navegadores modernos, tanto para dispositivos moviles como para dispositivos de escritorio.\n

\n
\n \n
\n\n

\n Crafty es un motor de juegos creado a finales del 2010. Crafty hace que sea realmente fácil la creación de juegos con JavaScript.\n

\n
\n \n
\n\n

\n Cocos2d-html5 es un framework de juegos web 2D, liberado bajo licencia MIT. Este es una versión en HTML5 del proyecto Cocos2d-x. Cocos2d-html5 se enfoca en hacer que Cocos2d sea compatible en todas las plataformas, navegadores y applicaciones nativas.\n

\n
\n \n
\n\n

\n Phaser se encuentra basado basado fuertemente en Flixel. Es mantenido por Richard Davey (Photon Storm) quien ha sido muy activo en la comunidad de HTML5 durante años.\n

\n
\n \n
\n\n

\n Goo en es un motor de juegos 3D en JavaScript enteramente construido en WebGL/HTML5\n

\n
\n \n
\n\n

\n LycheeJS es una libreria para juegos en JavaScript que ofrece un solución completa para prototipar y desarrollar juegos basados en el Canvas de HTML5, WebGL u OpenGL(ES) nativo dentro del Navegador Web o ambientes nativos.\n

\n
\n \n
\n\n

\n Quintus es un motor de juego HTML5 diseñado para ser modular y ligero, con una syntaxis concisa y amigable en JavaScript.\n

\n
\n \n
\n\n

\n Kiwi.js es un Motor de Juegos divertido y amigable en HTML5 de Código Abierto. Algunas personas lo llaman el WordPress de los motores de juegos de HTML5\n

\n
\n \n
\n\n

\n Panda.js es un motor de juegos en HTML5 para moviles y escritorios con renderizado en Canvas y WebGL.\n

\n
\n \n
\n\n

\n Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

Noticias

\n\n

Sitios Web

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Boletín

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

Lectura

\n\n

Artículos

\n\n\n
\n \n
\n\n

\n por Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n por Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n por Scott Allen\n

\n\n\n
\n \n
\n\n

\n por Ben Alman\n

\n\n\n
\n \n
\n\n

\n por Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n por Viljami S.\n

\n\n\n
\n \n
\n\n

\n por Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n por Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n por JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n por Ju Gonçalves\n

\n\n\n\n

Libros

\n\n\n
\n \n
\n\n

\n por Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n por David Flanagan\n

\n\n\n
\n \n
\n\n

\n por Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n por Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by James Coglan\n

\n\n\n
\n \n
\n\n

\n por Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n por Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n por Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n por Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n por Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n por John Resig\n

\n\n\n
\n \n
\n\n

\n por Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n por Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n por Christian Johansen\n

\n\n\n
\n \n
\n\n

\n por >Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n por Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n por Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n por David Herman\n

\n\n\n
\n \n
\n\n

\n por Michael Fogus\n

\n\n\n
\n \n
\n\n

\n por Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n por DevFreeBooks\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

E-Books Gratuitos

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Portales

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Red de Desarrolladores de Mozilla\n

\n

\n Plataforma Web\n

\n

\n Smashing Magazine\n

\n

\n Escuela de Node\n

\n

\n ¿Cómo hacer Node?\n

\n

\n La guía de Node.js de Felix\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Podcasts

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Arriba Node\n

\n

\n 5 Minutos de JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Videotutoriales

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontendmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

¿A quién seguir?

\n\n
\n
\n
\n\n
\n
\n

Proveedores PaaS

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Ayudantes

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"todo\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Creado y mantenido por

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Colaboradores

\n

Este proyecto no existiría sin estos maravillosos colaboradores. Muchas gracias muchachos por hacer esto real!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: La Forma Correcta por William Oliveira.
Licenciado bajo Creative Commons Attribution-NonCommercial 4.0 International License.
Basado en el trabjo en http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/fa-ir/index.html", "content": "\n\n \n \n \n \n جاوااسکریپت: از راه درستش\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

خوش‌آمدید!

\n\n

\n بهرتین شیوه‌های معرفی جاوااسکریپت به توسعه‌دهنده‌های جدید و کمک به توسعه‌دهنده‌های با تجربه، در این راهنما در نظر گرفته شده است.\n

\n\n

\n با توجه به نام انتخاب شده، این راهنما لزما به معنی \"تنها راه\" یادگیری جاوااسکریپت نیست.\n

\n\n

\n ما فقط تمامی مقاله‌ها، نکته‌ها و ترفند‌ها را از توسعه‌دهنده‌های برتر در اینجا جمع‌آوری کردیم، به دلیل اینکه این مجموعه استثنایی است ما به آن \"از راه درستش\" (the right way) می‌گوییم.\n

\n\n
\n
\n\n
\n
\n

مسیر خود را انتخاب کنید

\n\n \n
\n
\n\n
\n
\n

GETTING STARTED

\n

درباره

\n\n

\n جاوااسکریپت در سال ۱۹۹۵ توسط نت‌اسکیپ (Netscape) جهت گسترش HTML برای Netscape Navigator 2.0 ایجاد شده است، جاوااسکریپت به عنوان عملکرد اصلی به کار گیری documents در HTML و همچنین اعتبار سنجی فرم بود.\n\n جاوااسکریپت را در ابتدا آقای برندان ایچ (Brendan Eich) در شرکت نت‌اسکیپ با نام Mocha طراحی نمود. این نام بعدا در نسخه بتا به LiveScript و نهایتاً به جاوااسکریپت تغییر یافت.\n\n علیرغم اشتباه عمومی، زبان جاوا اسکریت با زبان جاوا متفاوت است، اگر چه هر دو زبان برنامه‌نویسی هستند.\n\n\n

\n\n

نسخه کنونی

\n\n

\n استاندارد جاوااسکریپت اکمااسکریپت (ECMAScript) است که از سال ۲۰۱۲ تمامی مرورگر‌های مدرن استاندارد اکمااسکریپت نسخه ۵.۱ را به صورت کامل پشتیبانی می‌کنند، همچنین مرورگر‌های قدیمی‌تر نسخه ۳ از اکمااسکریپت را پشتیبانی می‌کنند. از ماه June سال ۲۰۱۵ اکمااسکریپت ۶ (ES6) یا همان اکمااسکریپت ۲۰۱۵ (ES2015) مورد قبول واقع شده است.توضیحات تکمیلی در مورد اکمااسکریپت ۶ را می توانید در Ecma International مشاهده نمایید.\n

\n\n

\n Mozilla Developer Networkمرجع خوبی برای نسخه‌ها، منابع و اخبار جاوااسکریپت می‌باشد.\n

\n\n

DOM

\n\n

\n مدل شیءگرای سند یا دام (DOM - Document Object Model) یک API برای HTML و XHTML می باشد که قابلیت تغییرات محتوا را فراهم می‌کند. توضیحات بیشتر در Mozilla Developer Network - DOM می‌باشد.\n

\n\n
\n
\n\n
\n
\n

JS CODE STYLE

\n

Conventions

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

Linting

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n\n
\n\n
\n
\n

THE GOOD PARTS

\n

Object Oriented

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

Anonymous Functions

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

Function Binding

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\nIt is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n

Strict mode

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

PATTERNS

\n \n

Description

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

Design Patterns

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

TESTING TOOLS

\n

Description

\n\n

Various libraries and frameworks to do tests in JavaScript.

\n\n\n

Links

\n
\n \n
\n\n

\n Maintained by TJ Holowaychuk\n

\n
\n \n
\n\n

\n Maintained by jQuery\n

\n
\n \n
\n\n

\n Maintained by Pivotal Labs\n

\n
\n \n
\n\n

\n Maintained by the team behind AngularJS. Mostly by Vojta Jina\n

\n
\n \n
\n\n

\n Maintained by Sitepen\n

\n
\n \n
\n\n

\n A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\n

\n
\n \n
\n\n

\n Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Sinon.JS community\n

\n
\n \n
\n\n

\n A test helper to mock functions and the XHR object, maintained by Leo Balter\n

\n
\n \n
\n\n

\n Test runner with asynchronous tests, maintained by Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

FRAMEWORKS

\n\n

GENERAL PURPOSE

\n
\n \n
\n\n

\n jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\n

\n
\n \n
\n\n

\n Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\n

\n
\n \n
\n\n

\n Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\n

\n
\n \n
\n\n

\n Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\n

\n
\n \n
\n\n

\n Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\n

\n

MV*

\n
\n \n
\n\n

\n Very popular JavaScript client-side framework, built by @jashkenas.\n

\n
\n \n
\n\n

\n Built by @wycats, jQuery and Ruby on Rails core developer.\n

\n
\n \n
\n\n

\n Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\n

\n
\n \n
\n\n

\n Built by Google, Angular.js is like a polyfill for the future of HTML.\n

\n
\n \n
\n\n

\n One framework.Mobile & desktop. One way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.\n

\n
\n \n
\n\n

\n Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\n

\n
\n \n
\n\n

\n JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\n

\n
\n \n
\n\n

\n Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\n

\n
\n \n
\n\n

\n Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\n

\n
\n \n
\n\n

\n Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\n

\n
\n \n
\n\n

\n CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\n

\n

Library

\n
\n \n
\n\n

\n Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\n

\n
\n \n
\n\n

\n Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n

Animation

\n
\n \n
\n\n

\n Velocity is an animation engine with the same API as jQuery's $.animate().\n

\n
\n \n
\n\n

\n Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.\n

\n
\n \n
\n\n

\n A simple but powerful JavaScript library for tweening and animating HTML5 and JavaScript properties.\n

\n
\n \n
\n\n

\n Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.\n

\n
\n \n
\n\n

\n SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen.\n

\n
\n \n
\n\n

\n Rekapi is a library for making canvas and DOM animations with JavaScript, as well as CSS @keyframe animations for modern browsers.\n

\n
\n \n
\n\n

\n Make use of your favicon with badges, images or videos.\n

\n
\n \n
\n\n

\n Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.\n

\n
\n \n
\n\n

\n Motio is a small JavaScript library for simple but powerful sprite based animations and panning.\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

GAME ENGINES

\n\n
\n
\n \n
\n\n

\n MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\n

\n
\n \n
\n\n

\n ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\n

\n
\n \n
\n\n

\n LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\n

\n
\n \n
\n\n

\n Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\n

\n
\n \n
\n\n

\n Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\n

\n
\n \n
\n\n

\n Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\n

\n
\n \n
\n\n

\n Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\n

\n
\n \n
\n\n

\n LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\n

\n
\n \n
\n\n

\n Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\n

\n
\n \n
\n\n

\n Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\n

\n
\n \n
\n\n

\n Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\n

\n
\n \n
\n\n

\n Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

News

\n\n

Websites

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Newsletter

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

Reading

\n\n

Articles

\n\n\n
\n \n
\n\n

\n by Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n by Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n by Scott Allen\n

\n\n\n
\n \n
\n\n

\n by Ben Alman\n

\n\n\n
\n \n
\n\n

\n by Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Viljami S.\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n by Ju Gonçalves\n

\n\n\n\n

Books

\n\n\n
\n \n
\n\n

\n by Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n by David Flanagan\n

\n\n\n
\n \n
\n\n

\n by Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by James Coglan\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n by Addy Osmani\n

\n\n\n
\n \n
\n\n

\n by John Resig\n

\n\n\n
\n \n
\n\n

\n by Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by Christian Johansen\n

\n\n\n
\n \n
\n\n

\n by Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n by Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n by Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n by David Herman\n

\n\n\n
\n \n
\n\n

\n by Michael Fogus\n

\n\n\n
\n \n
\n\n

\n by Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

Free E-Books

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Portals

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Podcasts

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Screencasts

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

Who To Follow

\n\n
\n
\n
\n\n
\n
\n

PaaS Provider

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Helpers

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"Webpack\"\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Created and maintained by

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Contributors

\n

This project wouldn't exist without these amazing contributors. Thank you guys for making this real!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/index.html", "content": "\n\n \n \n \n \n JS: The Right Way\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

Hey, you!

\n\n

\n This is a guide intended to introduce new developers to JavaScript and help experienced developers learn more about its best practices.\n

\n\n

\n Despite the name, this guide doesn't necessarily mean \"the only way\" to do JavaScript.\n

\n\n

\n We just gather all the articles, tips, and tricks from top developers and put it here. Since it comes from exceptional folks, we could say that it is \"the right way\", or the best way to do so.\n

\n\n
\n
\n\n
\n
\n

Choose your path

\n\n \n
\n
\n\n
\n
\n

GETTING STARTED

\n

ABOUT

\n\n

\n Created by Netscape in 1995 as an extension of HTML for Netscape Navigator 2.0, JavaScript had as its main function the manipulation of HTML documents and form validation.\n\n Before winning this name so famous nowadays, JavaScript was called Mocha. When it first shipped in beta releases, it was officially called LiveScript and finally, when it was released by Sun Microsystems, was baptized with the name by which it is known today.\n\n Because of the similar names, people confuse JavaScript with Java. Although both have the lexical structure of programming, they are not the same language.\n\n Different from C, C# and Java, JavaScript is an interpreted language. It means that it needs an \"interpreter\". In case of JavaScript, the interpreter is the browser.\n

\n\n

CURRENT VERSION

\n\n

\n The JavaScript standard is ECMAScript. As of 2012, all modern browsers fully support ECMAScript 5.1. Older browsers support at least ECMAScript 3. As of June 2015 the spec for ES6/ES2015 has been approved. Following the new annual release cycle, ES7/ES2016 has been adopted in June 2016. See the ECMAScript 2016 Language Specification at Ecma International.\n

\n\n

\n A good reference to versions, references and news about JavaScript can be found at the Mozilla Developer Network.\n

\n\n

THE DOM

\n\n

\n The Document Object Model (DOM) is an API for HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript. See more at Mozilla Developer Network - DOM.\n

\n\n
\n
\n\n
\n
\n

JS CODE STYLE

\n

Conventions

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

Linting

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n\n
\n\n
\n
\n

THE GOOD PARTS

\n

Object Oriented

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

Anonymous Functions

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

Function Binding

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\nIt is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n

Strict mode

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

PATTERNS

\n \n

Description

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

Design Patterns

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

TESTING TOOLS

\n

Description

\n\n

Various libraries and frameworks to do tests in JavaScript.

\n\n\n

Links

\n
\n \n
\n\n

\n Maintained by TJ Holowaychuk\n

\n
\n \n
\n\n

\n Maintained by jQuery\n

\n
\n \n
\n\n

\n Maintained by Pivotal Labs\n

\n
\n \n
\n\n

\n Maintained by the team behind AngularJS. Mostly by Vojta Jina\n

\n
\n \n
\n\n

\n Maintained by Sitepen\n

\n
\n \n
\n\n

\n A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\n

\n
\n \n
\n\n

\n Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Sinon.JS community\n

\n
\n \n
\n\n

\n A test helper to mock functions and the XHR object, maintained by Leo Balter\n

\n
\n \n
\n\n

\n Test runner with asynchronous tests, maintained by Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

FRAMEWORKS

\n\n

GENERAL PURPOSE

\n
\n \n
\n\n

\n jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\n

\n
\n \n
\n\n

\n Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\n

\n
\n \n
\n\n

\n Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\n

\n
\n \n
\n\n

\n Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\n

\n
\n \n
\n\n

\n Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\n

\n

MV*

\n
\n \n
\n\n

\n Very popular JavaScript client-side framework, built by @jashkenas.\n

\n
\n \n
\n\n

\n Built by @wycats, jQuery and Ruby on Rails core developer.\n

\n
\n \n
\n\n

\n Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\n

\n
\n \n
\n\n

\n Built by Google, Angular.js is like a polyfill for the future of HTML.\n

\n
\n \n
\n\n

\n One framework.Mobile & desktop. One way to build applications with Angular and reuse your code and abilities to build apps for any deployment target. For web, mobile web, native mobile and native desktop.\n

\n
\n \n
\n\n

\n Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\n

\n
\n \n
\n\n

\n JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\n

\n
\n \n
\n\n

\n Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\n

\n
\n \n
\n\n

\n Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\n

\n
\n \n
\n\n

\n Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\n

\n
\n \n
\n\n

\n CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\n

\n

Library

\n
\n \n
\n\n

\n Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\n

\n
\n \n
\n\n

\n Is an MVVM library providing two-way data binding, HTML extended behaviour (through directives) and reactive components. By using native add-ons a developer can also have routing, AJAX, a Flux-like state management, form validation and more. Provides a helpful Chrome extension to inspect components built with Vue.\n

\n
\n \n
\n\n

\n Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n

Animation

\n
\n \n
\n\n

\n GSAP is the fastest full-featured scripted animation tool on the planet. It's even faster than CSS3 animations and transitions in many cases.\n

\n
\n \n
\n\n

\n Velocity is an animation engine with the same API as jQuery's $.animate().\n

\n
\n \n
\n\n

\n Bounce.js is a tool and JS library that lets you create beautiful CSS3 powered animations.\n

\n
\n \n
\n\n

\n A simple but powerful JavaScript library for tweening and animating HTML5 and JavaScript properties.\n

\n
\n \n
\n\n

\n Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.\n

\n
\n \n
\n\n

\n SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen.\n

\n
\n \n
\n\n

\n Rekapi is a library for making canvas and DOM animations with JavaScript, as well as CSS @keyframe animations for modern browsers.\n

\n
\n \n
\n\n

\n Make use of your favicon with badges, images or videos.\n

\n
\n \n
\n\n

\n Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.\n

\n
\n \n
\n\n

\n Motio is a small JavaScript library for simple but powerful sprite based animations and panning.\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

GAME ENGINES

\n\n
\n
\n \n
\n\n

\n MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\n

\n
\n \n
\n\n

\n ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\n

\n
\n \n
\n\n

\n LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\n

\n
\n \n
\n\n

\n Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\n

\n
\n \n
\n\n

\n Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\n

\n
\n \n
\n\n

\n Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\n

\n
\n \n
\n\n

\n Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\n

\n
\n \n
\n\n

\n LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\n

\n
\n \n
\n\n

\n Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\n

\n
\n \n
\n\n

\n Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\n

\n
\n \n
\n\n

\n Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\n

\n
\n \n
\n\n

\n Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

News

\n\n

Websites

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Newsletter

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

Reading

\n\n

Articles

\n\n\n
\n \n
\n\n

\n by Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n by Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n by Scott Allen\n

\n\n\n
\n \n
\n\n

\n by Ben Alman\n

\n\n\n
\n \n
\n\n

\n by Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Viljami S.\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n by Ju Gonçalves\n

\n\n\n\n

Books

\n\n\n
\n \n
\n\n

\n by Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n by David Flanagan\n

\n\n\n
\n \n
\n\n

\n by Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by James Coglan\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n by Addy Osmani\n

\n\n\n
\n \n
\n\n

\n by John Resig\n

\n\n\n
\n \n
\n\n

\n by Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by Christian Johansen\n

\n\n\n
\n \n
\n\n

\n by Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n by Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n by Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n by David Herman\n

\n\n\n
\n \n
\n\n

\n by Michael Fogus\n

\n\n\n
\n \n
\n\n

\n by Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

Free E-Books

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Portals

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Podcasts

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Screencasts

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

Who To Follow

\n\n
\n
\n
\n\n
\n
\n

PaaS Provider

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Helpers

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"Webpack\"\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Created and maintained by

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Contributors

\n

This project wouldn't exist without these amazing contributors. Thank you guys for making this real!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/ko-kr/index.html", "content": "\n\n \n \n \n \n JS: The Right Way\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

저기요!

\n\n

\n 이 안내 문서는 JavaScript를 처음 시작하는 개발자와 더 나은 방법들을 익히고자 하는 숙련된 개발자 모두를 위해 작성되었습니다.\n

\n\n

\n 이 문서의 이름과 달리, 이 안내 문서는 JavaScript를 하기 위한 \"유일한 길\"을 의미하지는 않습니다.\n

\n\n

\n 우리는 단지 실력 있는 개발자들로부터 모든 기사, 팁, 트릭을 여기 한 페이지에 모아놓았을 뿐입니다. 비범한 사람들에게서 나온 것들이기 때문에, 이것이 \"정석\", 또는 가장 좋은 방법이라고 이야기할 수 있습니다.\n

\n\n
\n
\n\n
\n
\n

어디부터 보시겠습니까?

\n\n \n
\n
\n\n
\n
\n

시작하기

\n

JavaScript란?

\n\n

\n JavaScript는 1995년에 Netscape Navigator 2.0의 확장 기능으로써 Netscape사에 의해 개발되었습니다. JavaScript의 주사용 목적은 HTML의 조작과 입력 서의 검사였습니다.\n\n 이 이름이 지금처럼 유명해지기 전에는 JavaScript는 Mocha라고 불렸습니다. 베타 버전이 배포되었을 때는 공식적으로 LiveScript라 불리었고, Sun Microsystems에 의해 정식 버전이 배포되었을 때는 우리가 지금 알고 있는 이름으로 변경되었습니다.\n\n 비슷한 이름 때문에 Java와 JavaScript를 혼동하는 사람들이 많습니다. 두 언어 모두 프로그래밍 언어적인 어휘 구조로 되어 있지만 같은 언어는 아닙니다.\n\n C, C#, Java와는 다르게, JavaScript는 인터프리터 언어입니다. 인터프리터가 필요하다는 뜻인데, JavaScript의 경우 인터프리터는 브라우저입니다.\n

\n\n

현재 버전

\n\n

\n JavaScript의 표준은 ECMAScript입니다. 2012년 현재, 모든 모던 브라우저는 ECMAScript 5.1을 완벽히 지원합니다. 조금 더 오래된 브라우저는 최소 ECMAScript 3를 지원합니다. 2015년 6월 현재, ES6/ES2015의 사양이 승인되었습니다. ECMAScript 2015 언어 사양은 Ecma International에서 자세히 볼 수 있습니다.\n

\n\n

\n 자바스크립트에 대한 정보, 참고자료, 뉴스 등은 Mozilla Developer Network에서 볼 수 있습니다.\n

\n\n

DOM

\n\n

\n 문서 객체 모델(DOM)은 HTML과 XML 문서의 API입니다. DOM은 문서의 구조를 표현하고, 문서의 내용을 수정할 수 있게 하며, JavaScript 등의 스크립트 언어로 시각화하여 보여줄 수 있습니다. 더 많은 정보는 Mozilla Developer Network - DOM을 참조하세요.\n

\n\n
\n
\n\n
\n
\n

JavaScript 코딩 스타일

\n

컨벤션 (코드 작성 규칙)

\n\n

\n 다른 언어들과 마찬가지로 JavaScript에도 다양한 코딩 스타일 규칙이 있습니다. 아마도 가장 많은 이들이 사용하고, 추천하는 것은 구글 JavaScript 코드 스타일 규칙일 것입니다. 하지만 우리는 당신에게 Idiomatic.js 를 읽어볼 것을 추천합니다.\n

\n\n

린팅 (코드 스타일 검사)

\n\n

\n 요즘 JavaScript 코드 검사를 위한 가장 좋은 도구는 JSHint입니다. 우리는 당신이 어디서든지 린트 도구로 코드 스타일과 패턴 점검을 하는 것을 추천합니다.\n

\n\n
\n\n
\n
\n

알면 좋은 것들

\n

객체지향

\n\n

\n JavaScript는 객체지향 프로그래밍에 강력한 호환성을 제공하고 있지만, 그런데도 타 객체 지향 언어와 비교했을 때 다른 점으로 인해 자주 논의됩니다.\n

\n\n

\n 참고: Introduction to Object-Oriented JavaScript\n

\n\n

익명 함수

\n\n

\n 익명 함수는 실행 시간 중에 동적으로 선언되는 함수입니다. 이런 함수를 익명함수라 하는데 다른 평범한 함수와는 달리 이름이 주어지지 않기 때문입니다.\n

\n\n

\n 참고: JavaScript anonymous functions\n

\n\n

1급 객체로서의 함수

\n\n

\n JavaScript에서 함수는 1급 객체입니다. 다시 말해 JavaScript 함수는 특별한 타입의 객체로, 일반적인 객체가 할 수 있는 모든 일을 할 수 있다는 뜻입니다.\n

\n\n

\n 참고: Functions are first class objects in JavaScript\n

\n\n

느슨한 타입

\n\n

\n 많은 Front-end 개발자들에게 JavaScript는 처음으로 접하는 인터프리터 언어이자 스크립트 언어입니다. 이 개발자들에게 느슨한 타입의 변수라는 개념과 논리적 함축은 아주 자연스러운 것입니다. 하지만 모던 웹 애플리케이션에 대한 수요가 폭발적으로 증가함에 따라 클라이언트 측 기술에 발을 디딘 Back-end 개발자들도 점점 많아지고 있는데, C#이나 Java 같은 강한 타입의 언어에 친숙한 이 사람들에게는 느슨한 타입의 변수들이 주는 자유로움이나 잠재적인 함정들이 익숙하지 않습니다.\n

\n\n

\n 참고: Understanding Loose Typing in JavaScript\n

\n\n

스코핑과 호이스팅

\n\n

\n 스코핑: JavaScript에서는 함수가 사실상의 변수들의 스코프 범위입니다. 그 말인즉슨, 루프나 조건문(if, for, while, switch, try 같은)의 블록은 다른 언어들과는 다르게 스코프 범위가 아닙니다. 그러므로 함수와 그 함수 내에 있는 블록들은 같은 스코프를 사용합니다. 따라서 변수가 블록 내에서만 존재 할거라 생각하고 변수를 선언하는 것은 위험할 수도 있습니다.\n

\n\n

\n 호이스팅: 실행을 시작하면 모든 변수와 함수의 선언은 각 함수(스코프)의 가장 위로 옮겨집니다. 이것이 바로 호이스팅(hoisting)입니다. 이것 때문에, 첫 줄 이후에 선언된 변수들은 호이스팅으로 인해 선언한 곳 전부터 존재하게 됩니다. 실수를 피하고자 모든 변수를 제일 첫 줄에 함께 선언하는 것은 좋은 습관입니다. 이것은 블록 스코프 기반 언어를 사용하던 프로그래머들이 흔하게 겪는 문제입니다.\n

\n\n

\n 참고: JavaScript Scoping and Hoisting\n

\n\n

함수 바인딩

\n\n

\n 함수 바인딩은 처음 JavaScript를 시작할 때에는 거의 신경 쓸 일이 없을지도 모릅니다. 하지만 다른 함수 내에서 this의 context를 유지해야 할 일이 생겼을 때 당신이 정말 필요로 하는 것은 Function.prototype.bind()라는 걸 알게 될 겁니다.\n

\n\n

\n 참고: Understanding JavaScript’s Function.prototype.bind\n

\n\n

클로저 함수

\n\n

\n 클로저는 독립적인(자유로운) 변수들을 가리키는 함수입니다. 다시 말하자면, 클로저 안에서 정의한 함수는 그 함수가 만들어진 환경을 '기억'합니다. private 메소드를 흉내 내는 것 이외에도 개발 시에 유용하게 쓰이는 개념이므로 이해하는 것이 중요합니다. 또한, 반복문 안에서 클로저를 생성하는 것처럼, 흔히 하는 실수들을 어떻게 피할 수 있는지 배우는 데도 도움이 됩니다.\n

\n\n

\n 참고: MDN - Closures\n

\n\n

Strict 모드

\n\n

\n ECMAScript 5의 strict 모드는 JavaScript의 제한된 변형을 사용하는 방법입니다. 단순히 부분집합은 아닙니다: 의도적으로 일반 코드와 다른 의미를 가집니다. Strict 모드를 지원하지 않는 브라우저는 지원하는 브라우저와 다르게 Strict 모드 코드를 실행하므로, Strict 모드에 대해 적절하게 지원되는지 기능 테스트가 없다면 신뢰할 수 없습니다. Strict 모드와 비 Strict 모드의 코드는 동시에 존재할 수 있으므로, 계속해서 Strict 모드를 명시해야 합니다.\n

\n\n

\n 참고: MDN - Strict mode\n

\n\n

즉시 실행 함수 표현(Immediately-Invoked Function Expression; IIFE)

\n\n

\n 즉시 실행 함수 표현은 JavaScript의 함수 스코핑을 사용해서 렉시컬 스코프를 생성하는 패턴입니다. 즉시 실행 함수 표현은 블록 내에서 변수가 호이스팅되는걸 방지하거나 전역 환경이 오염되는 것을 보호하는 데 사용되기도 하며, 동시에 함수 내에서 정의된 변수를 private로 만들며 메소드만 접근하도록 만들 수도 있습니다.\n 이 패턴은 자기실행 익명 함수(self-executing anonymous function)이라고 불리기도 하지만, @cowboy (Ben Alman)이 패턴에 대해 의미상으로 더 정확한 단어로 IIFE를 소개했습니다.\n

\n\n

\n 참고: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

패턴

\n \n

설명

\n\n

\n JavaScript는 자기만의 독자적인 디자인 패턴을 가지고 있는 한편, 많은 고전적인 디자인 패턴 또한 구현할 수 있습니다.\n

\n\n

\n JavaScript 디자인 패턴에 대해 배우는 좋은 방법은 Addy Osmani의 오픈소스 책 Learning JavaScript Design Patterns와 아래에 있는 중요한 패턴들의 문서를 기본으로 삼는 것입니다.\n

\n\n

디자인 패턴

\n\n
\n \n
\n\n

\n 생성패턴\n

\n\n
\n \n
\n\n

\n 구조패턴\n

\n\n
\n \n
\n\n

\n 행위패턴\n

\n\n

MV* 패턴

\n\n
\n JavaScript로 구현된 전통적인 MVC 패턴 구현과 그 변종들입니다.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

테스팅 도구

\n

설명

\n\n

JavaScript로 작성된 프로그램을 테스트하는 데에 필요한 여러 가지 라이브러리들과 프레임워크들을 소개합니다.

\n\n\n

Links

\n
\n \n
\n\n

\n TJ Holowaychuk이 관리하고 있습니다.\n

\n
\n \n
\n\n

\n jQuery가 관리하고 있습니다.\n

\n
\n \n
\n\n

\n Pivotal Labs가 관리하고 있습니다.\n

\n
\n \n
\n\n

\n AngularJS팀이 뒤에서 관리하고 있습니다. 주로 Vojta Jina가 관리하고 있습니다.\n

\n
\n \n
\n\n

\n Sitepen이 관리하고 있습니다.\n

\n
\n \n
\n\n

\n JavaScript로 작성된 JavaScript 코드 커버리지 측정 도구입니다. Krishnan Anantheswaran이 관리하고 있습니다.\n

\n
\n \n
\n\n

\n JavaScript 테스트를 위한 Spy, Stub, Mock을 제공합니다. 의존성이 없고, 어느 유닛 테스트 프레임워크와도 동작합니다. Sinon.JS 커뮤니티가 만들었습니다.\n

\n
\n \n
\n\n

\n Mock 함수와 XHR 객체를 제공하는 테스트 도우미입니다. Leo Balter가 관리하고 있습니다.\n

\n
\n \n
\n\n

\n Test runner with asynchronous tests, maintained by Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

프레임워크

\n\n

범용

\n
\n \n
\n\n

\n jQuery는 작고 빠르며, 풍부한 기능을 가지고 있는 JavaScript 라이브러리로 John Resig이 만들었습니다.\n

\n
\n \n
\n\n

\n Yahoo!가 제작한 YUI는 자유 오픈소스 JavaScript, CSS 라이브러리로 상호작용하는 웹 애플리케이션을 제작하는 데 사용됩니다. 2014년 8월 29일 이후로 새로운 개발이 진행되지 않고 있습니다.\n

\n
\n \n
\n\n

\n Zepto는 현대적 웹 브라우저를 위한, jQuery에 호환성을 가진 API를 제공하는 소형 JavaScript 라이브러리입니다. jQuery를 사용할 줄 안다면 Zepto를 어떻게 사용하는지 이미 알고 있는 겁니다.\n

\n
\n \n
\n\n

\n Dojo는 고성능의 웹 애플리케이션을 만들기 위한 자유, 오픈소스 JavaScript Toolkit입니다. 이 프로젝트의 후원자에는 IBM과 SitePen이 포함되어 있습니다.\n

\n
\n \n
\n\n

\n Underscore.js는 내장 객체를 확장하지 않고도 유용한 함수형 프로그래밍 도우미를 사용할 수 있도록 돕는 JavaScript 라이브러리입니다.\n

\n

MV*

\n
\n \n
\n\n

\n @jashkenas가 만든 아주 유명한 JavaScript 클라이언트 측 프레임워크입니다.\n

\n
\n \n
\n\n

\n jQuery와 Ruby on Rails 코어 개발자인 @wycats가 만들었습니다.\n

\n
\n \n
\n\n

\n Model-View-View Model (MVVM)를 적용하여 동적인 JavaScript 사용자 인터페이스 개발을 간소화시켜줍니다.\n

\n
\n \n
\n\n

\n Google이 개발한 Angular.js는 마치 미래의 HTML을 위한 polyfill 같습니다.\n

\n
\n \n
\n\n

\n 프레임 워크입니다. 모바일 및 데스크톱입니다. Angular로 응용 프로그램을 만들고 코드와 기술을 사용하여 각 배포 목표에 맞는 응용 프로그램을 만드는 한 가지 방법입니다. 웹, 모바일 웹, 기본 휴대 전화 및 기본 데스크탑 용.\n

\n
\n \n
\n\n

\n Cappuccino는 데스크톱 앱 품질의 웹 애플리케이션을 쉽게 개발할 수 있게 해주는 오픈소스 프레임워크입니다.\n

\n
\n \n
\n\n

\n JavaScriptMVC는 jQuery 개발에 쓰이는 최고의 아이디어를 포함한 오픈소스 프레임워크입니다.\n

\n
\n \n
\n\n

\n Meteor는 당신이 숙련된 개발자이건, 처음 시작한 개발자이건 상관없이 짧은 시간 안에 최고 품질의 웹 애플리케이션을 만들게 도와주는 오픈소스 플랫폼입니다.\n

\n
\n \n
\n\n

\n Spice는 아주 작고 (< 3k) 유연한 MVC JavaScript 프레임워크입니다. Spice는 이미 존재하는 애플리케이션에 쉽게 추가할 수 있고, jQuery, pjax, turbolinks, node 혹은 당신이 쓰는 어떤 기술들과도 같이 연동하기 쉽게 만들어졌습니다.\n

\n
\n \n
\n\n

\n Riot은 엄청나게 빠르고 강력하지만 아주 작으며, 대규모의 웹 애플리케이션 개발을 위한 클라이언트 (MV*) 라이브러리입니다. 아주 작은 크기에도 불구하고 템플릿 엔진, 라우터, 이벤트 라이브러리, 엄격한 MVP 패턴 같은 모든 필요한 요소를 갖추고 있습니다.\n

\n
\n \n
\n\n

\n CanJS는 복잡한 애플리케이션을 쉽고 빠르게 개발할 수 있도록 해주는 JavaScript 프레임워크입니다. 배우기 쉽고 작으며 대단하진 않지만, 커스텀 태그나 양방향 바인딩 같은 최신 기능을 지원합니다.\n

\n

라이브러리

\n
\n \n
\n\n

\n Facebook이 공개한 React는 Facebook과 Instagram의 사용자 인터페이스를 만드는 데 사용된 JavaScript 라이브러리입니다. 많은 사람이 MVC의 V로써 React를 선택하고 있습니다.\n

\n
\n \n
\n\n

\n Handlebars는 의미론적인 템플릿을 효과적으로 만들 수 있게 해주는 라이브러리입니다.\n

\n
\n \n
\n\n

\n 브라우저와 node.js를 위한 비동기 템플릿 라이브러리입니다.\n

\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n

애니메이션

\n
\n \n
\n\n

\n Velocity는 jQuery의 $.animate()와 같은 API를 가지고 있는 애니메이션 엔진입니다.\n

\n
\n \n
\n\n

\n Bounce.js는 아름다운 CSS3 애니메이션 제작을 가능하게 하는 툴인 동시에 JavaScript 라이브러리입니다.\n

\n
\n \n
\n\n

\n HTML5와 JavaScript 프로퍼티의 tweening과 애니메이션을 지원하는 간단하지만 강력한 JavaScript 라이브러리입니다.\n

\n
\n \n
\n\n

\n Move.js는 CSS3기반 애니메이션을 아주 간단하고 우아하게 만들 수 있는 작은 JavaScript 라이브러리입니다.\n

\n
\n \n
\n\n

\n SVG는 스크린 사이즈와 해상도에 독립적이면서 상호작용하는 벡터 그래픽을 만드는 훌륭한 방법입니다.\n

\n
\n \n
\n\n

\n Rekapi는 canvas와 DOM 애니메이션을 만들기 위한 JavaScript 라이브러리입니다. 또한, 모던 브라우저를 위한 @keyframe 애니메이션도 지원합니다.\n

\n
\n \n
\n\n

\n 배지, 이미지, 비디오와 함께 favicon을 사용하세요.\n

\n
\n \n
\n\n

\n Textillate.js는 몇몇 멋진 라이브러리들을 통합하여 어떤 텍스트에든 CSS3 애니메이션을 적용가능하게 해주는 사용하기 편리한 플러그인입니다.\n

\n
\n \n
\n\n

\n Motio는 간단하지만 강력한 스프라이트 기반의 애니메이션과 panning을 지원하는 JavaScript 라이브러리입니다.\n

\n
\n \n
\n\n

\n Anima로 수백 개의 객체의 애니메이션을 쉽게 만들 수 있습니다. 각 객체는 질량과 점성을 가질 수 있어서 실제 세계의 객체를 모방할 수 있습니다!\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

게임 엔진

\n\n
\n
\n \n
\n\n

\n MelonJS는 무료이며 경량화된 HTML5 게임 엔진입니다. MelonJS는 tiled map format을 사용하여 레벨 디자인을 하기 쉽게 도와줍니다.\n

\n
\n \n
\n\n

\n ImpactJS는 2010년 말에 소개된 HTML5 게임 엔진입니다. ImpactJS는 꾸준히 업데이트되고 관리되고 있으며 대형 커뮤니티가 지원하고 있습니다. 많은 개발 문서가 있으며 ImpactJS를 이용해 게임을 제작하는 책도 있습니다.\n

\n
\n \n
\n\n

\n LimeJS는 모든 모던 터치스크린/데스크톱 브라우저에서 빠르고 네이티브 애플리케이션에 가까운 게임을 개발할 수 있게 도와주는 HTML5 게임 프레임워크입니다.\n

\n
\n \n
\n\n

\n Crafty는 2010년에 선보인 게임 엔진입니다. Crafty는 아주 쉽게 JavaScript 게임 개발을 시작할 수 있게 도와줍니다.\n

\n
\n \n
\n\n

\n Cocos2d-html5는 MIT 라이센스의 오픈소스 웹 2D 게임 프레임워크입니다. Cocos2d-html5는 Cocos2d-x 프로젝트의 HTML5 버전으로써 브라우저와 네이티브 환경을 아우르는 Cocos2d 크로스 플랫폼을 만드는 데 집중하고 있습니다.\n

\n
\n \n
\n\n

\n Phaser는 Flixel에 기반을 두고 있습니다. 수년 동안 HTML5 커뮤니티에서 왕성하게 활동해 온 Richard Davey (Photon Storm)가 Phaser를 관리하고 있습니다.\n

\n
\n \n
\n\n

\n Goo는 WebGL/HTML5 기반으로 제작된 3D JavaScript 게임 엔진입니다.\n

\n
\n \n
\n\n

\n LycheeJS는 JavaScript 게임 라이브러리입니다. 웹 브라우저와 네이티브 환경에서 HTML5 Canvas, WebGL 또는 native OpenGL(ES) 기반 게임의 프로토타이핑과 배포를 위한 통합 솔루션을 제공합니다.\n

\n
\n \n
\n\n

\n Quintus는 모듈화/경량화를 위해 디자인된 간결화 된 JavaScript 문법을 사용하는 HTML5 게임 엔진입니다.\n

\n
\n \n
\n\n

\n Kiwi.js는 재미있고 친근한 HTML5 게임 엔진입니다. 몇몇 사람들은 HTML5 게임 엔진 계의 워드프레스라고 부릅니다.\n

\n
\n \n
\n\n

\n Panda.js는 Canvas와 WebGL 렌더링을 사용하는 모바일/데스크톱용 HTML5 게임 엔진입니다.\n

\n
\n \n
\n\n

\n Rot.js is a set of JavaScript libraries, designed to help with a roguelike development in browser environment.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

뉴스

\n\n

웹사이트

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

뉴스레터

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

읽을거리

\n\n

게시물

\n\n\n
\n \n
\n\n

\n 저자: Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n 저자: Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n 저자: Scott Allen\n

\n\n\n
\n \n
\n\n

\n 저자: Ben Alman\n

\n\n\n
\n \n
\n\n

\n 저자: Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n 저자: Viljami S.\n

\n\n\n
\n \n
\n\n

\n 저자: Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n 저자: Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n 저자: JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n 저자: Ju Gonçalves\n

\n\n\n\n

책

\n\n\n
\n \n
\n\n

\n 저자: Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n 저자: David Flanagan\n

\n\n\n
\n \n
\n\n

\n 저자: Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n 저자: Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n 저자: James Coglan\n

\n\n\n
\n \n
\n\n

\n 저자: Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n 저자: Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n 저자: Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n 저자: Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n 저자: Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n 저자: John Resig\n

\n\n\n
\n \n
\n\n

\n 저자: Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n 저자: Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n 저자: Christian Johansen\n

\n\n\n
\n \n
\n\n

\n 저자: Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n 저자: Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n 저자: Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n 저자: David Herman\n

\n\n\n
\n \n
\n\n

\n 저자: Michael Fogus\n

\n\n\n
\n \n
\n\n

\n 저자: Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n 저자: DevFreeBooks\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

무료 E-Book

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

포탈

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

팟캐스트

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

스크린캐스트

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

팔로우 추천

\n\n
\n
\n
\n\n
\n
\n

PaaS 공급자

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

도움이 되는 프로그램

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"todo\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

만들고 고친 사람들:

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

기여자들

\n

이 프로젝트는 놀라운 기여자분들 없이는 존재할 수 없었을 겁니다. 이 문서를 만들어준 모두에게 정말 감사합니다!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
이 저작물은 크리에이티브 커먼즈 저작자표시-비영리-동일조건변경허락 4.0 국제 라이선스에 따라 이용할 수 있습니다.
원문: http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/pt-br/index.html", "content": "\n\n \n \n \n \n JS: A forma certa\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

Ei, você!

\n\n

\n Esse é um guia com a intenção de apresentar novos desenvolvedores ao JavaScript e ajudar desenvolvedores experientes a aprenderem mais sobre as melhores práticas.\n

\n\n

\n Apesar do nome, esse guia não significa necessariamente \"o único caminho\" em JavaScript.\n

\n\n

\n Nós apenas juntamos todos os artigos, dicas e artimanhas dos desenvolvedores top e colocamos aqui. Uma vez que esse material vem de pessoas excepcionais, nós podemos dizer que é \"a forma certa\", ou a melhor forma de fazer.\n

\n\n
\n
\n\n
\n
\n

Escolha seu caminho

\n\n \n
\n
\n\n
\n
\n

INICIANDO

\n

SOBRE

\n\n

\n Criado pela Netscape em 1995 como uma extensão do HTML para o navegador Netscape Navigator 2.0, o JavaScript teve como função principal a manipulação de documentos HTML e a validação de formulários.\n\n Antes de ganhar seu nome tão famoso hoje em dia, o JavaScript foi chamado de Mocha. Quando saiu pela primeira vez em uma versão beta foi chamado oficialmente de LiveScript e finalmente quando foi liberado pela Sun Microsystems foi batizado pelo nome que hoje nós conhecemos.\n\n Devido à similaridade de nomes, algumas pessoas confundem o JavaScript com o Java. Embora ambos tenham a estrutura léxica da programação, elas não são a mesma linguagem.\n\n Diferente do C, C# e do Java, o JavaScript é uma linguagem interpretada. Isso significa que ele precisa de um \"interpretador\". No caso do JavaScript, o interpretador é o navegador.\n

\n\n

VERSÃO ATUAL

\n\n

\n O padrão do JavaScript é o ECMAScript. Em 2012 todos os navegadores modernos passaram a dar suporte ao ECMAScript 5.1. Navegadores antigos suportam pelo menos o ECMAScript 3. Uma sexta revisão desses padrões está em andamento.\n

\n\n

\n Uma boa referência para versões, referências e novidades sobre o JavaScript pode ser encontrada no\n Mozilla Developer Network.\n

\n\n

O DOM

\n\n

\n O Modelo de Objetos de Documentos é uma API para documentos HTML e XML. Ele fornece uma representação estrutural do documento, permitindo que você modifique seu conteúdo e sua apresentação visual usando linguagens de script como o JavaScript. Leia mais em Mozilla Developer Network - Referência do DOM.\n

\n\n
\n
\n\n
\n
\n

ESTILOS DE CÓDIGO JS

\n

Convenções

\n\n

\n Assim como todas as linguagens, JavaScript tem muitos guias de estilo de código. Talvez o mais usado e recomendado seja o Google Code Style Guide for JavaScript, mas recomendamos a leitura do Idiomatic.js.\n

\n\n

Análise de código (Linting)

\n\n

\n Nos dias de hoje, a melhor ferramenta para analise de código em JavaScript é o JSHint. Nós recomendamos que sempre que possível você verifique o seu estilo de código e padrões com uma ferramenta de análise (Lint Tool).\n

\n\n
\n\n
\n
\n

AS PARTES BOAS

\n

Orientação a Objetos

\n\n

\n JavaScript tem fortes capacidades de programação orientada a objetos, apesar de ocorrerem algumas discussões devido às diferenças da orientação a objetos no JavaScript em comparação com outras linguagens.\n

\n\n

\n Fonte: Introdução ao JavaScript Orientado a Objeto\n

\n\n

Funções anônimas

\n\n

\n Funções anônimas são funções que são declaradas dinamicamente em tempo de execução. Elas são chamadas de funções anônimas devido ao fato de não receberem um nome, como as funções tradicionais.\n

\n\n

\n Fonte: JavaScript anonymous functions\n

\n\n

Funções como objetos de primeira classe

\n\n

\n Funções em JavaScript são funções de primeira classe. Isso significa que no JavaScript as funções são um tipo especial de objeto que podem fazer todas as coisas que um objeto normal pode fazer.\n

\n\n

\n Fonte: Functions are first class objects in JavaScript\n

\n\n

Tipagem fraca

\n\n

\n Para muitos desenvolvedores front-end, o JavaScript foi o primeiro gostinho de uma linguagem de script e/ou de linguagem interpretada. Para esses desenvolvedores, os conceitos e implicações de variáveis de tipagem fraca podem ser naturais. Entretanto, o crescimento explosivo na demanda por aplicações web modernas resultou no crescimento do número de desenvolvedores back-end que tiveram que enfiar seus pés nas tecnologias de client-side. Muitos desses desenvolvedores estão chegando com conhecimentos de uma linguagem fortemente tipada, como c# ou Java, e não estão familiarizados com a liberdade e as armadilhas envolvidas em trabalhar com variáveis de tipagem fraca.\n

\n\n

\n Fonte: Understanding Loose Typing in JavaScript\n

\n\n

Escopos e elevação (hoisting)

\n\n

\n Escopos: Em JavaScript, funções são nosso delimitador de escopo de facto para declaração de variáveis, o que significa que blocos usuais de loops e estruturas condicionais (como if, for, while, switch e try) NÃO delimitam escopos, diferente de muitas outras linguagens. Portanto, esses blocos irão compartilhar do mesmo escopo que a função que os contém. Dessa forma, pode ser perigoso declarar variáveis dentro de blocos, já que irá parecer que a variável pertence apenas ao bloco.\n

\n\n

\n Elevação (hoisting): Em tempo de execução, todas as variáveis e declarações de funções são movidas para o início de cada função (seu próprio escopo) - isso é conhecido como elevação (hoisting). Dito isso, é uma boa prática declarar todas as variáveis juntas na primeira linha, a fim de evitar falsas expectativas em relação a uma variável que foi declarada depois mas que acabou recebendo um valor antes - esse é um problema comum para programadores vindos de linguagens com escopos em blocos.\n

\n\n

\n Fonte: JavaScript Scoping and Hoisting\n

\n\n

Binding de funções

\n\n

\n Binding de funções será provavelmente a última de suas preocupações quando estiver começando com o JavaScript, mas quando você perceber que precisa de uma solução para o problema de como manter o contexto do 'this' dentro de outra função, então você pode se dar conta do que realmente precisa é a função Function.prototype.bind().\n

\n\n

\n Fonte: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Funções de fechamento (Closures)

\n\n

\n Closures (fechamentos) são funções que se referem a variáveis livres (independentes). Em outras palavras, a função definida no closure \"lembra\" do ambiente em que ela foi criada.\n\n Esse é um importante conceito a ser entendido, pois pode ser muito útil durante o desenvolvimento, como emulando métodos privados. Também pode ajudar a aprender como evitar erros comuns, como criando closures em loops.\n

\n\n

\n Fonte: MDN - Closures\n

\n\n

Modo rigoroso

\n\n

\n O modo rigoroso do ECMAScript 5 é um modo de optar por uma variação restrita do JavaScript. O modo rigoroso não é apenas um subconjunto, ele intencionalmente tem a semântica diferente do código normal. Navegadores que não suportam o modo rigoroso irão executar o código com o comportamento diferente de navegadores que suportam, então não confie no modo restrito sem contar com testes de funcionalidades em aspectos relevantes do modo restrito. Modo rigoroso de código e não rigoroso podem coexistir, então scripts podem optar pelo modo rigoroso incrementalmente.\n

\n\n

\n Fonte: MDN - Strict mode\n

\n\n

Expressão de Função Invocada Imediatamente (IIFE - Immediately-Invoked Function Expression)

\n\n

\n Uma função imediata é um padrão que produz um escopo léxico usando os escopos de função do JavaScript. Funções imediatas podem ser usadas para evitar a elevação de variáveis (hoisting) dentro de blocos, protegendo o ambiente global de ser poluído e simultanamente permite o acesso público a métodos enquanto retém a privacidade para as variáveis declaradas dentro da função.

\n Esse padrão tem sido referenciado como função anônima de auto execução, mas @cowboy (Ben Alman) introduziu o termo IIFE como um termo mais semântico para o padrão.\n

\n\n

\n Fonte: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

PADRÕES

\n \n

Descrição

\n\n

\n Apesar de o JavaScript possuir padrões de projeto exclusivos da linguagem, outros padrões clássicos também podem ser implementados.\n

\n\n

\n Uma boa maneira de aprendê-los é ler o livro de código aberto Learning JavaScript Design Patterns do Addy Osmani. A maioria dos links abaixo são baseados nesse livro.\n

\n\n

Padrões de projeto (Design Patterns)

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n Existem algumas implementações do tradicional padrão MVC e sua variações no JavaScript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

FERRAMENTAS DE TESTES

\n

Descrição

\n\n

Várias bibliotecas e frameworks para fazer testes em JavaScript.

\n\n\n

Links

\n
\n \n
\n\n

\n Mantida por TJ Holowaychuk\n

\n
\n \n
\n\n

\n Mantida por jQuery\n

\n
\n \n
\n\n

\n Mantida por Pivotal Labs\n

\n
\n \n
\n\n

\n Mantida pelo time por trás do AngularJS. Em maior parte por Vojta Jina\n

\n
\n \n
\n\n

\n Mantida por Sitepen\n

\n
\n \n
\n\n

\n Uma ferramenta de cobertura de código JavaScript escrita em JavaScript, mantida por Krishnan Anantheswaran\n

\n
\n \n
\n\n

\n Espiões de teste standalone, stubs (esboços) e mocks (simulação/imitação) para JavaScript. Sem dependências, funciona com qualquer framework de testes unitários. Criado por Sinon.JS community\n

\n
\n \n
\n\n

\n Um helper de testes para fazer mocks de funções e de objetos XHR, mantido por Leo Balter\n

\n
\n \n
\n\n

\n Test runner with asynchronous tests, maintained by Sindre Sorhus\n

\n
\n \n
\n\n

\n Painless JavaScript Testing, maintained by Facebook\n

\n\n
\n
\n\n
\n
\n

FRAMEWORKS

\n\n

PROPOSTA GERAL

\n
\n \n
\n\n

\n jQuery é uma biblioteca JavaScript rápida, pequena e cheia de recursos. Criada por John Resig.\n

\n
\n \n
\n\n

\n Criado pelo Yahoo!, YUI é uma biblioteca JavaScript e CSS de código aberto para criação de aplicações web ricas e interativas. Novas atualizações estão paradas desde 29 de Agosto de 2014.\n

\n
\n \n
\n\n

\n Zepto é uma biblioteca JavaScript minimalista para navegadores modernos com uma grande compatibilidade com a API do jQuery. Se você usa jQuery, você já sabe como usar o Zepto.\n

\n
\n \n
\n\n

\n Dojo é um kit de ferramentas JavaScript grátis e de código aberto para criação de aplicações web de alto desempenho. Os patrocinadores do projeto incluem IBM e SitePen.\n

\n
\n \n
\n\n

\n Underscore.js é uma biblioteca JavaScript que fornece uma enorme quantidade de helpers úteis sem estender qualquer objeto interno.\n

\n

MV*

\n
\n \n
\n\n

\n Framework JavaScript client-side muito popular, criado por @jashkenas.\n

\n
\n \n
\n\n

\n Criado por @wycats, desenvolvedores do núcleo do jQuery e Ruby on Rails .\n

\n
\n \n
\n\n

\n Simplifica interfaces de cliente dinâmicas criadas em JavaScript aplicando o modelo Model-View-View (MVVM).\n

\n
\n \n
\n\n

\n Criado pelo Google, Angular.js é como um polyfill para o futuro do HTML.\n

\n
\n \n
\n\n

\n Um framework.Mobile & desktop. Uma maneira de criar aplicativos com o Angular e usar seu código e habilidades para criar aplicativos para cada meta de implantação. Para web, web móvel, telefone móvel nativo e desktop nativo.\n

\n
\n \n
\n\n

\n Cappuccino é um framework de código aberto que torna fácil a criação de aplicações parecidas com desktop que rodam em um navegador.\n

\n
\n \n
\n\n

\n JavaScriptMVC é um framework de código aberto que contém as melhores ideias no desenvolvimento do jQuery.\n

\n
\n \n
\n\n

\n Meteor é uma plataforma de código aberto para criação rápida de aplicações web de alta qualidade, seja você um desenvolvedor experiente ou que está apenas começando.\n

\n
\n \n
\n\n

\n Spice é um framework MVC em JavaScript minúsculo (< 3k) e flexível. Spice foi construido para ser fácil de ser adicionado em qualquer aplicação existente e funciona bem com outras tecnologias como jQuery, pjax, turbolinks, node ou qualquer outra coisa que você esteja usando.\n

\n
\n \n
\n\n

\n Riot é uma biblioteca client-side (MV*) incrivelmente rápida, potente e pequena para criar aplicações web de grande escala. Apesar do tamanho pequeno todos os blocos de construção estão lá: um motor de templates, rotas, biblioteca de eventos e um padrão MVP rígido para manter as coisas organizadas.\n

\n
\n \n
\n\n

\n CanJS é um framework JavaScript que simplifica e agiliza o desenvolvimento de aplicações complexas. Fácil de aprender, pequeno e com uma estrutura modesta, mas com características modernas como tags customizadas e com binding de duas vias.\n

\n

Biblioteca

\n
\n \n
\n\n

\n Criado pelo Facebook. React é uma biblioteca JavaScript para criação de interfaces de usuários do Facebook e do Instagram. Muitas pessoas enxergam o React como o V do MVC.\n

\n
\n \n
\n\n

\n É uma biblioteca MVVM que provê two-way data binding, adiciona comportamento adicional ao HTML (através de diretivas) e componentes reativos. Ao utilizar add-ons nativos o desenvolvedor pode também contar com rotas, AJAX, gerenciamento de fonte de dados ao estilo Flux, validação de formulários e mais. Provê uma extensão para Chrome que é muito útil para inspecionar componentes construídos com Vue.\n

\n
\n \n
\n\n

\n Handlebars fornece de forma eficaz o poder necessário para você criar templates semânticos sem frustrações.\n

\n
\n \n
\n\n

\n Templates assíncronos para o navegador e para node.js.\n

\n

Animação

\n
\n \n
\n\n

\n Velocity é um motor de animações com a mesma API $.animate() do jQuery.\n

\n
\n \n
\n\n

\n Bounce.js é uma biblioteca JavaScript e uma ferramenta que permite você criar lindas animações em CSS3.\n

\n
\n \n
\n\n

\n Uma biblioteca JavaScript simples mas poderosa para interpolar e animar propriedades HTML5 e JavaScript.\n

\n
\n \n
\n\n

\n Move.js é uma biblioteca JavaScript pequena que torna animações em CSS3 super simples e elegantes.\n

\n
\n \n
\n\n

\n SVG é uma excelente forma de criar gráficos vetoriais interativos e independentes de resolução que ficam ótimos em qualquer tamanho de tela.\n

\n
\n \n
\n\n

\n Rekapi é uma biblioteca para fazer animações canvas e DOM com JavaScript, assim como animações @keyframe do CSS, para navegadores modernos.\n

\n
\n \n
\n\n

\n Faça uso do seu favicon com emblemas, imagens ou vídeos.\n

\n
\n \n
\n\n

\n Textillate.js combina algumas bibliotecas impressionantes para fornecer um plugin fácil de usar para aplicar animações CSS3 em qualquer texto.\n

\n
\n \n
\n\n

\n Motio é uma pequena biblioteca JavaScript para uma simples porém poderosa animação baseada em sprites e panning (panorâmica).\n

\n
\n \n
\n\n

\n Com a Anima é fácil de animar mais de cem objetos de cada vez. Cada item pode ter sua massa e viscosidade para simular objetos da vida real!\n

\n
\n \n
\n\n

\n With Anima it's easy to animate over a hundred objects at a time. Each item can have it's mass and viscosity to emulate reallife objects!\n

\n
\n
\n\n\n
\n
\n

MOTORES DE JOGOS

\n\n
\n
\n \n
\n\n

\n MelonJS é um motor de jogos leve e grátis. O motor integra o formato tiled map, tornando o level design mais fácil.\n

\n
\n \n
\n\n

\n ImpactJS é um dos motores de jogos mais \"testados e aprovados\" em HTML5, com sua primeira publicação no final de 2010. Ele é muito bem mantido e atualizado, conta com uma boa comunidade dando suporte. A documentação é boa e conta com dois livros falando sobre criação de jogos com esse motor.\n

\n
\n \n
\n\n

\n LimeJS é um framework de jogos em HTML5 para criação rápida de jogos com experiência nativa para navegadores modernos e dispositivos touch.\n

\n
\n \n
\n\n

\n Crafty é um motor de jogo lançado no final de 2010. Crafty torna realmente fácil começar a desenvolver jogos com JavaScript.\n

\n
\n \n
\n\n

\n Cocos2d-html5 é um framework de código aberto para desenvolvimento de jogos web em 2D, lançado sob a licença MIT. É uma versão HTML5 do projeto Cocos2d-x. O foco para o desenvolvimento do Cocos2d-html5 está em torná-lo multiplataforma entre navegadores e aplicações nativas.\n

\n
\n \n
\n\n

\n Phaser é baseado fortemente no Flixel. É mantido por Richard Davey (Photon Storm) que tem sido bem ativo por anos na comunidade HTML5.\n

\n
\n \n
\n\n

\n Goo é um motor de jogos JavaScript 3D feito inteiramente em WebGL/HTML5\n

\n
\n \n
\n\n

\n LycheeJS é uma biblioteca de jogos em JavaScript que oferece uma solução completa para prototipação e desenvolvimento de HTML5 Canvas, WebGL ou OpenGL(ES) nativo, baseado no navegador ou em ambientes nativos.\n

\n
\n \n
\n\n

\n Quintus é um motor de jogos HTML5 projetado para ser modular e leve, com uma sintaxe concisa e bem próxima ao JavaScript.\n

\n
\n \n
\n\n

\n Kiwi.js é um motor de jogos de código aberto. Algumas pessoas o chamam de o WordPress dos motores de jogos HTML5.\n

\n
\n \n
\n\n

\n Panda.js é um motor de jogos em HTML5 para dispositivos mobile e desktop com renderização de Canvas e WebGL.\n

\n
\n \n
\n\n

\n Isogenic é um motor de jogos que fornece as mais avançadas funcionalidades de rede e multiplayer em tempo real disponíveis em qualquer motor de jogos HTML 5. O sistema é baseado em streaming de entidades e inclui opções poderosas de simulação e interpolação de entidades no client a partir de delta updates.\n

\n
\n \n
\n\n

\n Isogenic is an advanced game engine that provides the most advanced networking and realtime multiplayer functionality available in any HTML 5 game engine. The system is based on entity streaming and includes powerful simulation options and client-side entity interpolation from delta updates. \n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

NOVIDADES

\n\n

Websites

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Newsletter

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

LEITURA

\n\n

Artigos

\n\n\n
\n \n
\n\n

\n por Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n por Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n por Scott Allen\n

\n\n\n
\n \n
\n\n

\n por Ben Alman\n

\n\n\n
\n \n
\n\n

\n por Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n por Viljami S.\n

\n\n\n
\n \n
\n\n

\n por Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n por Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n por JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n por Ju Gonçalves\n

\n\n\n\n

Livros

\n\n\n
\n \n
\n\n

\n por Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n por David Flanagan\n

\n\n\n
\n \n
\n\n

\n por Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n por Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n por James Coglan\n

\n\n\n
\n \n
\n\n

\n por Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n por Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n por Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n por Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n por Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n por John Resig\n

\n\n\n
\n \n
\n\n

\n por Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n por Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n por Christian Johansen\n

\n\n\n
\n \n
\n\n

\n por >Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n por Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n por Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n por David Herman\n

\n\n\n
\n \n
\n\n

\n por Michael Fogus\n

\n\n\n
\n \n
\n\n

\n por Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n por DevFreeBooks\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

E-Books grátis

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Portais

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Podcasts

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Screencasts

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

QUEM SEGUIR

\n\n
\n
\n
\n\n
\n
\n

PROVEDORES PaaS

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Helpers

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"todo\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Criado e mantido por

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Contribuidores

\n

Este projeto não existiria sem esses maravilhosos contribuidores. Obrigado galera por tornarem isso real!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: A forma certa por William Oliveira.
Licenciado sobre Creative Commons Atribuição-NãoComercial 4.0 Internacional.
Baseado no trabalho em http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/ru-ru/index.html", "content": "\n\n \n \n \n \n JS: Правильный путь\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

Привет!

\n\n

\n Это руководство призвано ввести в курс новичков в Javascript и помочь опытным разработчикам больше узнать и лучших практиках и подходах.\n

\n\n

\n Несмотря на название, это руководство не обязательно означает \"Единственно верный\" способ работать с JavaScript.\n

\n\n

\n Просто мы решили собрать все статьи, советы и секреты от ведущих разработчиков в одном месте. Так как мы говорим о выдающихся людях, мы можем сказачать что это \"правильный путь\", или лучший способ делать подобные вещи.\n

\n\n
\n
\n\n
\n
\n

Выбери свой путь

\n\n \n
\n
\n\n
\n
\n

С ЧЕГО НАЧАТЬ

\n

О ЯЗЫКЕ

\n\n

\n Созданный компанией Netscape в 1995 как расширение HTML для браузера Netscape Navigator 2.0, Javascript имел в качестве основной функции - манипулирование HTML-документом и проверку данных в формах.\n\n До того, как он стал известен в мире под современным названием, Javascript назывался Mocha. Когда он выпустился в первой бета-версии он назывался LiveScript. Свое текущее название он приобрел только после выпуска компанией Sun Microsystems.\n\n Из-за похожести названий люди иногда путают Javascript и Java. Эти языки имеют похожий синтаксис, но в остальном они сильно отличаются.\n\n В отличии от C, C# и Java, Javascript - интерпретируемый язык. Это означает, что он нуждается в интепретаторе. В случае с Javascript интерпретатором является браузер.\n

\n\n

ТЕКУЩАЯ ВЕРСИЯ

\n\n

\n Стандарт Javascript называется ECMAScript. По состоянию на 2012 год, все современные браузеры полностью поддерживают ECMAScript 5.1. Более старые браузеры поддерживают по-крайней мере ECMAScript 3. В июне 2015 была утверждена спецификация ES6/ES2015. Следуя новому годовму релизному циклу, ES7/ES2016 был утвержден в июне 2016. Подробнее читайте о спецификации языка ECMAScript 2016 на сайте Ecma International.\n

\n\n

\n Отличное описание версий, ссылок и изменений JavaScript можно найти на сайте Mozilla Developer Network.\n

\n\n

DOM

\n\n

\n Объектная модель документа (DOM) - это API, дающее возможность работать с HTML и XML документами. Она обеспечивает структурное представление документа, позволяя изменять содержимое и визуальное представление посредством скриптовых языков, таких как Javascript. Подробнее на странице Mozilla Developer Network - DOM.\n

\n\n
\n
\n\n
\n
\n

JS - СТИЛЬ НАПИСАНИЯ КОДА

\n

Условные обозначения

\n\n

\n Как любой другой язык, JavaScript имеет множество стилей кодирования. Возможно самый используемый и рекомендуемый это Руководство по оформлению Javascript кода от Google Code, но мы рекомендуем ознакомиться с Idiomatic.js.\n

\n\n

Валидация кода

\n\n

\n На сегодня лучшим инструментом для статической валидации Javascript кода является JSHint. Мы рекомендуем всегда, когда возможно, использовать валидаторы (линтеры) для проверки вашего кода и правил оформления.\n

\n\n
\n\n
\n
\n

СИЛЬНЫЕ СТОРОНЫ

\n

Объектно ориентированный

\n\n

\n Javascript имеет сильные объектно-ориентированные возможности. Несмотря на некоторые споры которые имеют место вокруг различий ООП в javascript по сравнению с другими языками.\n

\n\n

\n Подробнее: Введение в объектно-ориентированный JavaScript\n

\n\n

Анонимные функции

\n\n

\n Анонимные функции - функции которые динамически объявляются в процессе выполнения. Они называются анонимными потому, что они не именуются в отличие от обычных функций.\n

\n\n

\n Подробнее: Анонимные функции в JavaScript\n

\n\n

Функции как объекты первого класса

\n\n

\n Функции в Javascript - объекты первого класса. Это означает что функции это особый класс объектов, которые могут делать все то же самое что могут делать обычные объекты.\n

\n\n

\n Подробнее: Функции как объекты первого класса в JavaScript\n

\n\n

Нестрогая типизация

\n\n

\n Для многих фронтенд разработчиков Javascript был первым опытом в скриптовых/интерпретируемых языках. Для этих разработчиков принцип и реализация нестрогой типизации может быть само собой разумеещимся.\n Однако взрывной рост популярности современных веб-приложений приводит к тому, что все большее число бэкенд разработчиков вынуждено погружаться в мир клиентских технологий. Многие из этих разработчиков приходят с опытом работы с типизироваными языками вроде C# или Java, и им кажутся странными как вольности допускаемые нестрогой типизацией, так и подводные камни, которые она в себе скрывает.\n

\n\n

\n Подробнее: Понимание нестрогой типизации в JavaScript\n

\n\n

Область видимости и всплытие определений

\n\n

\n Область видимости: В JavaScript, функции по-факту являются ограничениями области видимости при объявлении переменных.\n Это означает, что обычные блоки из циклов и условных выражений (такие, как if, for, while, switch и try) НЕ ОГРАНИЧИВАЮТ область видимости, в отличии от большинства языков. Так что эти блоки имеют ту же самую область видимости, что и функции в которых они используются. Таким образом нужно быть внимательнее, объявляя переменные внутри блоков, так как может показаться, что переменные доступны только внутри блока (а это не так).\n

\n\n

\n \"Всплытие\": При выполнении все объявления переменных var и функций перемещаются в начало функции (перед ее \"телом\"). Это называется \"всплытием\" (hoisting). Так что хорошей практикой является объявление переменных в начале функции, чтобы явно задать область видимости и избежать двусмысленности, что возможно при объявлении переменных/функций ниже по коду. Это общая проблема для программистов, которые раньше писали на языках с блочной областью видимости.\n Это поведение получило корректировки в новом стандарте (ES6/ES2015 - почитайте про let/const).\n

\n\n

\n Подробнее: JavaScript - про всплытие и область видимости\n

\n\n

Контекст выполнения

\n\n

\n Контекст выполнения - это наименьшая из ваших проблем, когда вы начинаете работать с Javascript. Но однажды вы понимаете, что решение проблемы, которая у вас есть, заключается в вызове другой функции с сохранением текущего контекста. И вот в этот момент вы поймете, что Function.prototype.bind() - это то, что вам нужно. А еще вы можете почитать про \"стрелочные функции\" из нового стандарта Javascript.\n

\n\n

\n Подробнее: Что такое Function.prototype.bind в JavaScript\n

\n\n

Замыкания

\n\n

\n Замыкания - это функции, которые ссылаются на переменные вне себя. Другими словами функции посредством замыкания получают доступ к переменным, которые доступны в месте объявления функции.\n Очень важно это понимать, так как это часто используется при разработке, пример для эмуляции приватных методов. Это так же будет полезно, чтобы избежать частых ошибок, например создание замыканий в циклах.\n

\n\n

\n Подробнее: MDN - Замыкания\n

\n\n

Строгий режим

\n\n

\n Строгий режим из 5-й редакции ECMAScript - это способ ограничить возможности Javascript. Строгий режим - не просто подмножество, он намеренно ограничивает возможности вашего кода. Браузеры с поддержкой строгого режима и без него будут обрабатывать ваш код по-разному, так что не стоит рассчитывать на строгий режим без соответствующего тестирования вашего кода в обоих случаях. Строгий и нестрогий режимы могут сосуществовать (например, строгий режим может распространяться на отдельные функции), так что переписывать свой код под строгий режим можно постепенно.\n

\n\n

\n Подробнее: MDN - Строгий режим\n

\n\n

Самовызывающиеся функции (IIFE)

\n\n

\n Самовызывающиеся функции - это подход, который позволяет создать лексическое окружение использую функциональную область видимости в Javascript. Самовызывающиеся функции могут быть использованы, чтобы избежать всплытия переменных за пределы блока, предотвратить загрязнение глобальной области видимости и обеспечить доступ к публичным методам сохраняя недоступность данных, которые объявлены внутри функции.

\n Этот подход основывается на самовызывающихся анонимных функциях, но @cowboy (Ben Alman) ввел понятие IIFE как более семантически-верное для обозначения этого шаблона.\n

\n\n

\n Подробнее: Немедленно вызываемыми функциональные выражения (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

ТИПОВЫЕ РЕШЕНИЯ

\n\n

Описание

\n\n

\n Javascript содержит достаточное количество шаблонов, специфических для языка. Однако так же могут быть использованы многие классические шаблоны проектирования.\n

\n\n

\n Хорошим способом с этим разобраться будет чтение книги Addy Osmani Learning JavaScript Design Patterns (Изучение Шаблонов Проектирования Javascript), и ссылок ниже, которые частично взяты из книги.\n

\n\n

Шаблоны проектирования

\n\n
\n \n
\n\n

\n Порождающие шаблоны\n

\n\n
\n \n
\n\n

\n Структурные шаблоны\n

\n\n
\n \n
\n\n

\n Поведенческие шаблоны\n

\n\n

Шаблоны MV*

\n\n
\n Есть несколько реализаций традиционного MVC паттерна и его вариаций в Javascript.\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

ИНСТРУМЕНТЫ ДЛЯ ТЕСТИРОВАНИЯ

\n

Описание

\n\n

Различные библиотеки и фреймворки для тестирования кода на JavaScript.

\n\n\n

Links

\n
\n \n
\n\n

\n Поддерживается TJ Holowaychuk\n

\n
\n \n
\n\n

\n Поддерживается jQuery\n

\n
\n \n
\n\n

\n Поддерживается Pivotal Labs\n

\n
\n \n
\n\n

\n Поддерживается командой АнгуларJS. По-большей части Vojta Jina\n

\n
\n \n
\n\n

\n Поддерживается Sitepen\n

\n
\n \n
\n\n

\n A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\n

\n
\n \n
\n\n

\n Независимый набор тестовых 'шпионов', моков и заглушек для JavaScript. Без зависимостей, работает с любым тестовым фреймворком. Создан Sinon.JS community\n

\n
\n \n
\n\n

\n Вспомогательные утилиты для мока функций Javascript и объекта XHR, поддерживается Leo Balter\n

\n
\n \n
\n\n

\n Тест-ранер (утилита для запуска тестов) с асинхронными тестами, поддерживается Sindre Sorhus\n

\n
\n \n
\n\n

\n Безболезненное тестирование Javascript, поддерживается Facebook\n

\n\n
\n
\n\n
\n
\n

ФРЕЙМВОРКИ

\n\n

ОБЩЕГО НАЗНАЧЕНИЯ

\n
\n \n
\n\n

\n jQuery - это быстрая, маленькая библиотека с богатым функционалом. Создана John Resig.\n

\n
\n \n
\n\n

\n Создан Yahoo!, YUI - бесплатная библиотека с открытым исходным кодом. Использует набор решений на JavaScript и CSS для построения интерфейса интерактивных веб приложений. Разработка прекращена 29го августа 2014.\n

\n
\n \n
\n\n

\n Zepto - минималистичная JavaScript библиотека для современных браузеров. По-большей части имеет jQuery-совместимое API. Если вы пользовались jQuery, то вы уже знаете как работать с Zepto.\n

\n
\n \n
\n\n

\n Dojo - бесплатный инструмент с открытым исходным кодом для построения высокопроизводительных веб-приложений. Проект спонсируется IBM и SitePen.\n

\n
\n \n
\n\n

\n Underscore.js - JS библиотека, которая предоставляет полный набор разнообразных вспомогательных функций без изменения встроенных объектов.\n

\n

MV*

\n
\n \n
\n\n

\n Очень популярный JavaScript клиент-серверный фреймворк, созданный @jashkenas.\n

\n
\n \n
\n\n

\n Создан @wycats, который является значимым разрабочиком jQuery и Ruby on Rails.\n

\n
\n \n
\n\n

\n Упрощает построение динамических интерфейсов посредством использования паттерна Model-View-View Model (MVVM).\n

\n
\n \n
\n\n

\n Создан командой из Google. Angular.js похож на полифилл для будущих версий HTML.\n

\n
\n \n
\n\n

\n Framework.Mobile и рабочий стол. Один из способов создания приложений с угловым и использовать навыки и программный код для создания приложений для каждой цели развертывания. Для веб-страниц, мобильный Интернет, мобильный телефон родной и родной рабочий стол.\n

\n
\n \n
\n\n

\n Cappuccino проект с открытым кодом, который позволяет легко создавать приложения, похожие на десктопный, но так чтобы они работали в браузере.\n

\n
\n \n
\n\n

\n JavaScriptMVC проект с открытым кодом который сочетает в себе лучшие идеи разработки на jQuery.\n

\n
\n \n
\n\n

\n Meteor - opensource проект для создания высококачественных веб-приложений. Доступен как опытным разработчикам так и новичкам.\n

\n
\n \n
\n\n

\n Spice - супер минималистичный (< 3k) и гибкий MVC фреймворк для javascript. Spice был создан для быстрого добавления к существующим приложениям и хорошо сочетается с jQuery, pjax, turbolinks, node или что там еще вами используется.\n

\n
\n \n
\n\n

\n Riot - невероятно быстрая, мощная и маленькая библиотека, для использования паттерна (MV*) в построении расширяемых веб приложений. Несмотря на маленький размер содержит все необходимое - шаблонизатор, роутер, событийную модель и строгий MVP для организации структуры приложения.\n

\n
\n \n
\n\n

\n CanJS - JavaScript фреймворк, который делает разработку сложных приложений простой и быстрой. Легкий в освоении, маленький, нетребовательный к архитектуре вашего приложения, но с современными подходыми вроде пользовательских тегов и двустороннего биндинга\n

\n

Библиотеки

\n
\n \n
\n\n

\n Создана Facebook. React - это Javascript библиотека для создания пользовательского интерфейса в Facebook и Instagram. Многие люди предпочитают рассматривать React как V в MVC.\n

\n
\n \n
\n\n

\n MVVM библиотека обеспечивающая двустороннее связывание, расширение HTML посредством директив и реактивные компоненты. Используя дополнения разработчик так же получает роутинг, AJAX запрос, Flux-подобное управление состоянием, валидацию форм и многое другое. В наличии полезное расширение для Chrome, позволяющее инспектировать компоненты созданные на Vue.\n

\n
\n \n
\n\n

\n Handlebars - мощный и гибкий инструмент, позволяющий создавать семантические шаблоны (с использованием компонент/вспомогательных тегов).\n

\n
\n \n
\n\n

\n Асинхронный шаблонизатор для браузера и node.js.\n

\n

Анимации

\n
\n \n
\n\n

\n GSAP самый быстрый и полнофункциональный инструмент. Он во многих случаях даже быстрее CSS3 анимации и переходов.\n

\n
\n \n
\n\n

\n Velocity - библиотека для анимации с тем же API что и $.animate() из jQuery.\n

\n
\n \n
\n\n

\n Bounce.js - библиотека позволяющая задавать анимации, на базе CSS3.\n

\n
\n \n
\n\n

\n Простая, но мощная, Javascript библиотека для изменения и анимирования HTML5.\n

\n
\n \n
\n\n

\n Move.js - маленькая JavaScript библиотека делающая анимации на базе CSS3 простыми и элегантными.\n

\n
\n \n
\n\n

\n SVG - прекрасный способ реализовать взаимодействие с пользователем, векторная графика, которая не зависит от разрешения и размера экрана.\n

\n
\n \n
\n\n

\n Rekapi - библиотека для создания анимации на базе canvas или DOM, так же хорошо как CSS @keyframe анимации в современных браузерах.\n

\n
\n \n
\n\n

\n Позволяет использовать в качестве favicon спрайты, картинки или видео.\n

\n
\n \n
\n\n

\n Textillate.js - набор прикрасных библиотек предоставляющий легкие в использовании расширения для применения CSS3 анимации к любому тексту.\n

\n
\n \n
\n\n

\n Motio - маленькая JavaScript библиотека для простой, но мощной анимации и панарам на базе спрайтов.\n

\n
\n \n
\n\n

\n С Anima очень легко анимировать сотни объектов. Каждый объект может иметь свои характеристики, что упрощает моделирование объектов реального мира.\n

\n
\n
\n\n\n
\n
\n

ИГРОВЫЕ ДВИЖКИ

\n\n
\n
\n \n
\n\n

\n MelonJS - бесплатный и легковесный HTML5 игровой движок. Движок интеграрован с тайловыми картами, что делает разработку уровней еще проще.\n

\n
\n \n
\n\n

\n ImpactJS - один из самый проверенных и надежных движков для создания игр на HTML5. Первая версия вышла еще в конце 2010 года. Он прекрасно поддерживается и регулярно обновляется, имеет приличных размеров сообщество, которое его поддерживает. Сущестует достаточное колличество документации - даже две книги по созданию игр на этом движке.\n

\n
\n \n
\n\n

\n LimeJS - это фреймворк для создания быстрых HTML5 игр, с качественной поддержкой сенсорных экранов и десктопных браузеров.\n

\n
\n \n
\n\n

\n Crafty - игровой движок, который берет начало из конца 2010 года. Его создали чтобы начать делать игры на Javascript было действительно просто.\n

\n
\n \n
\n\n

\n Cocos2d-html5 - игровой 2D движек с открытым исходным кодом, распространяется под MIT лицензией. Это HTML5 версия проекта Cocos2d. Основное внимание при разработке Cocos2d-html5 уделено тому, чтобы сделать проект кроссплатформенным и доступным в разных браузерах и мобильных приложениях.\n

\n
\n \n
\n\n

\n Phaser в большой степени опирается на Flixel. Он поддерживается Richard Davey (Photon Storm), который долгие годы был очень активным участником HTML5 сообщества.\n

\n
\n \n
\n\n

\n Goo - это 3D игровой движок на JavaScript полностью построенный на WebGL/HTML5.\n

\n
\n \n
\n\n

\n LycheeJS - это JavaScript библиотека, предлагающая комплексное решение для создания и развертывания прототипов HTML5 игр с использованием Canvas, WebGL или нативного OpenGL(ES). Поддерживаются как игры для веб-браузеров так и для мобильных приложений.\n

\n
\n \n
\n\n

\n Quintus - это игровой движок для HTML5. Легковесный, модульный, с понятным Javascript API.\n

\n
\n \n
\n\n

\n Kiwi.js - забавный и дружелюбный игровой движок с открытым исходным кодом. Некоторые называют его WordPress в мире игровых движков для HTML5.\n

\n
\n \n
\n\n

\n Panda.js - это игровой движок для HTML5 под мобильные устройства и десктопные браузеры с поддержкой рендеринга через Canvas и WebGL.\n

\n
\n \n
\n\n

\n Rot.js - набор Javascript библиотек, призванный помочь с разработкой ролевых игр (roguelike) для браузеров.\n

\n
\n \n
\n\n

\n Isogenic - продвинутый игровой движок, который обеспечивает поддержку соверменных сетей и возможностей HTML5 для разработки многопользовательских игр c взаимодействием в реальном времени. Система основана на потоковой передаче данных и включает в себя мощные возможности по моделированию на стороне клиента на основе дельт-обновлений (передача изменений состояния).\n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

Где можно следить за новостями?

\n\n

Вебсайты

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

Рассылки

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

Что стоит прочитать?

\n\n

Статьи

\n\n\n
\n \n
\n\n

\n by Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n by Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n by Scott Allen\n

\n\n\n
\n \n
\n\n

\n by Ben Alman\n

\n\n\n
\n \n
\n\n

\n by Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Viljami S.\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n by JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n by Ju Gonçalves\n

\n\n\n\n

Книги

\n\n\n
\n \n
\n\n

\n by Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n by David Flanagan\n

\n\n\n
\n \n
\n\n

\n by Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by James Coglan\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n by Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n by Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n by Addy Osmani\n

\n\n\n
\n \n
\n\n

\n by John Resig\n

\n\n\n
\n \n
\n\n

\n by Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by Christian Johansen\n

\n\n\n
\n \n
\n\n

\n by Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n by Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n by Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n by David Herman\n

\n\n\n
\n \n
\n\n

\n by Michael Fogus\n

\n\n\n
\n \n
\n\n

\n by Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

Бесплатные электронные книги

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

Порталы

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

Подкасты

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

Скринкасты

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

К кому стоит присмотреться

\n\n
\n
\n
\n\n
\n
\n

Облачные сервисы

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

Утилиты

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"Webpack\"\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

Создано и поддерживается

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

Участники

\n

Этот проект не существовал бы без этих замечательных людей. Спасибо, ребята, что воплотили его в жизнь!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: Правильный путь by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
На базе http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n\n" }, { "path": "public/zh-cn/index.html", "content": "\n\n \n \n \n \n JS: The Right Way\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

嗨！你们好

\n\n

\n 这是一份为 JavaScript 新手准备的指南，同时也包含了可以给高手学习的最佳资料\n

\n\n

\n 虽然本网站的名字是 the right way,但并不代表是学习 JavaScript 的唯一方法。\n

\n\n

\n 我们只是将一些顶尖开发者的文章、提醒和技巧收集于此。由于它是由一些非常厉害的网名身上收集而来，故称之为 'the right way'或是最佳做法。\n

\n\n
\n
\n\n
\n
\n

选择你想看的主题

\n\n \n
\n
\n\n
\n
\n

开始入门

\n

关于

\n\n

\n 由网景公司在 1995 年给网景浏览器2.0创建的一个当做 HTML 扩展，JavaScript 最初主要的功能就是操作 HTML 文档和验证表单。 在取得这么大的名声之前，JavaScript 被叫做 Mocha，当它第一次发布 beta 版本时它的官方名字是 LiveScript，当被 Sun Microsystems 发布时，被称作这个名字一直到今天。 由于相似的名字，人们老是把 JavaScript 和 Java搞混。虽然两者都有编程的语法结构，但是他们是不同的语言。 和C、C#、Java不同， JavaScript 是一个脚本语言，也就是说他需要一个“解释器”，JavaScript的解释器就是浏览器。\n

\n\n

最新版本

\n\n

\n ECMAScript 是 JavaScript 的标准。截至2012年止，所有最新流行的浏览器都可以支持 ECMAScript 5.1。老的浏览器至少会支持 ECMAScript 3。2015年6月 ES6/ES2015 规范已完成。前往阅读 ECMAScript 2015 规范 Ecma International.\n

\n\n

\n JavaScript 的最佳参考版本、参考资料及最新消息可以前往 Mozilla Developer Network.\n

\n\n

DOM

\n\n

\n Document Object Model (DOM) 是 HTML 及 XML 文档的 API。它提供了文件的结构化展现，让你可以使用脚本语言（如 JavaScript）來更改它的內容及视觉展现。其他更详细的內容 Mozilla Developer Network - 文件对象模型（DOM）.\n

\n\n
\n
\n\n
\n
\n

JavaScript 代码风格

\n

编程风格规范

\n\n

\n JavaScript 和其他编程语言一样，有各种版本的编程风格指南。或许大家会推荐 Google Code Style Guide for JavaScript，但我们更推荐 Idiomatic.js\n

\n\n

代码检查

\n\n

\n 现在最好的 JavaScript 代码检查工具为 JSHint。我们强烈建议尽可能的使用检查工具来确认你的编码风格以及设计模式的正确性。\n

\n\n
\n\n
\n
\n

语言精粹

\n

面向对象

\n\n

\n JavaScriot 虽然和其他语言在面向对象上面有些不同的地方，但仍然具有面向对象的编程能力。\n

\n\n

\n 资源: JavaScript 面向对象编程介绍\n

\n\n

匿名函数

\n\n

\n 匿名函数是在代码运行时动态声明的函数。之所以叫做匿名函数是因为他跟其他函数不同，它并没有函数名称。\n

\n\n

\n 资源: JavaScript anonymous functions\n

\n\n

函数作为第一类对象

\n\n

\n 函数是 JavaScript 的一等对象。这意味着 JavaScript 中的函数只是一种特殊类型的对象，并拥有一般对象所具备的能力。\n

\n\n

\n 资源: Functions are first class objects in JavaScript\n

\n\n

弱类型

\n\n

\n 对于许多前端开发者而言，JavaScript 是他们所使用的第一个脚本语言和/或解释语言, 对这些开发者来说，弱类型的概念和含义或许像第二天性一样自然; 然而现在网页应用的需求爆炸式增长，致使越来越多的后端开发者必须顾及客户端技术, 大部分此类开发者有强类型语言的背景, 例如 C# 或 Java,因此并不熟悉弱类型语言所带来的高度自由及潜在的缺陷。\n

\n\n

\n 资源: Understanding Loose Typing in JavaScript\n

\n\n

作用域和提升

\n\n

\n 作用域： 在 JavaScript 中，函数是我们在声明变量时, 实际的作用域分隔符, 也就是说常见的循环及表达式（如 if, for, while, switch 及 try）并“不能“指定作用域, 这一点有别于大部分的程序语言。因此函数中的这些区块会共享作用域, 这样使得在这些区块内部声明只属于这些函数块的变量行为可能是危险的。\n

\n\n

\n 变量提升： 在运行时，所有的变量及函数声明将会被移到函数的起始位置（它的作用域）- 这就是所谓的变量提升。这么说，在作用域的一开始就声明所有变量，以避免因未声明就操作变量造成的未预期错误是一个好的实践。 -这是一个习惯使用支持块级作用域语言的开发者经常遇到的问题。\n

\n\n

\n 资源: JavaScript Scoping and Hoisting\n

\n\n

函数绑定

\n\n

\n 函数绑定最有可能是 JavaScript 初学者最少关心的问题, 但当你意识到你需要一个解决方案以在另一个函数中保持 this 的上下文环境时, 你可能会了解到你真需要的其实是函数原型绑定（Function.prototype.bind()）。\n

\n\n

\n 资源: Understanding JavaScript’s Function.prototype.bind\n

\n\n

闭包函数

\n\n

\n 闭包是引用独立(自由)变量的函数。换句话说, 闭包中定义的函数会“记住”它被创建时的环境。理解这个概念很重要, 因为它在开发过程中是有用的, 类似模拟的私有方法。它也可以帮助你学习如何避免一些常见的错误，例如在循环中使用闭包。\n\n

\n\n

\n 资源: MDN - Closures\n

\n\n

严格模式

\n\n

\n ECMAScript 5 的严格模式是一种可选的使用严格变量的 JavaScript 方式。严格模式并非只是一个子集：它特意地在语法上有别于一般的代码。各家浏览器对严格模式的支持也不同, 所以开启严格模式时建议进行功能测试。严格模式的代码与非严格模式的代码是可以并存的, 所以可以自由決定严格模式部分的多少。\n

\n\n

\n 来源: MDN - Strict mode\n

\n\n

立即调用函数 (IIFE)

\n\n

\n 一个立即调用函数表达式是采用 JavaScript 的函数作用域产生一个词法作用域的模式。立即调用函数可避免变量从其所在的块内提升到上面的块, 以避免污染全局环境, 并可使用公共方法访问它,同事保留隐私。

\n 这种模式被称为自执行匿名函数，但 @cowboy (Ben Alman) 为它定义了语义上更合适的名字 IIFE 。\n

\n\n

\n 资源: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

设计模式

\n \n

说明

\n\n

\n 虽然 JavaScript 有其独有的设计模式，但许多经典的设计模式仍然是可以实现的。\n\n

\n\n

\n Addy Osmani 的开源书 Learning JavaScript Design Patterns 是很好的学习资料，下面大多数的链接都出自本书。\n

\n\n

设计模式

\n\n
\n \n
\n\n

\n 创建型设计模式\n

\n\n
\n \n
\n\n

\n 结构性设计模式\n

\n\n
\n \n
\n\n

\n 行为设计模式\n

\n\n

框架模式（MV* Patterns）

\n\n
\n 底下有一些 JavaScript 传统 MVC 模式及从中衍生出来的模式。\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

测试工具

\n

说明

\n\n

JavaScript 代码测试相关的函数库和框架。

\n\n\n

Links

\n
\n \n
\n\n

\n 由 TJ Holowaychuk 维护。\n

\n
\n \n
\n\n

\n 由 jQuery 维护。\n

\n
\n \n
\n\n

\n 由 Pivotal Labs 维护。\n

\n
\n \n
\n\n

\n 由 the team behind AngularJS. Mostly by Vojta Jina 维护。\n

\n
\n \n
\n\n

\n 由 Sitepen 维护。\n

\n
\n \n
\n\n

\n JavaScript 代码覆盖率工具，由 Krishnan Anantheswaran 维护。\n

\n
\n \n
\n\n

\n JavaScript 独立测试套件 Test spy, stub 及 mock）。 不依赖于任何的单元测试框架。由 Sinon.JS community 创作。\n

\n
\n \n
\n\n

\n 模拟函数及 XHR 对象的测试帮助工具，由 Leo Balter 维护。\n

\n
\n \n
\n\n

\n Тест-ранер (утилита для запуска тестов) с асинхронными тестами, поддерживается Sindre Sorhus\n

\n
\n \n
\n\n

\n Безболезненное тестирование Javascript, поддерживается Facebook\n

\n\n
\n
\n\n
\n
\n

框架

\n\n

热门

\n
\n \n
\n\n

\n jQuery 是一个快速、轻巧及功能丰富的 JavaScript 库。由 John Resig 建立。\n

\n
\n \n
\n\n

\n 由 Yahoo 建立！ YUI 是一个免费、开源的 JavaScript 及 CSS 库，用于建立富交互的 web 应用。 已于 2014年8月29日停止更新.\n

\n
\n \n
\n\n

\n Zepto 是一个针对现在浏览器开发的，极简的 JavaScript 函数库，兼容大量的 jQuery API。只要你会用 jQuery，那么你已经会用 Zepto 了。\n

\n
\n \n
\n\n

\n Dojo 是一个免费、开源的 JavaScript 工具包，用来建立高效能的网站应用。赞助商有 IBM 及 SitePen。\n

\n
\n \n
\n\n

\n Underscore.js 是一个提供整套函数式编程的好工具，同时并不扩展原生 JavaScript 的库。\n

\n

MV*

\n
\n \n
\n\n

\n 非常热门的 JavaScript 客户端框架，由 @jashkenas 建立。\n

\n
\n \n
\n\n

\n 由 @wycats 建立， jQuery 及 Ruby on Rails 核心开发者。\n

\n
\n \n
\n\n

\n 使用 Model-View-View Model (MVVM) 构建简单动态的 JavaScript 用户界面。\n

\n
\n \n
\n\n

\n 由 Google 建立，Angular.js 类似 polyfill 用于 HTML。\n

\n
\n \n
\n\n

\n 一个framework.Mobile和桌面。 一种使用Angular创建应用程序的方法，并使用您的代码和技能为每个部署目标创建应用程序。 对于web，移动网站，本机手机和本地桌面。\n

\n
\n \n
\n\n

\n Cappuccino 是一个可以让人简单搭建运行在浏览器的桌面应用的开源框架。\n

\n
\n \n
\n\n

\n JavaScriptMVC 是一个包含 jQuery 最佳创意的开源框架。\n

\n
\n \n
\n\n

\n Meteor 是一个不管菜鸟还是高手都可以在短时间内建立起高质量的网络应用的开源平台。\n

\n
\n \n
\n\n

\n Spice 是一个非常小（< 3k）且有可扩展性的 javascript MVC 框架。 Spice 可以轻松的融合任何已有的应用正在使用的技术如 jQuery、pjax、turbolinks、node 或是和任何你正在使用的技术共同顺利工作。\n

\n
\n \n
\n\n

\n Riot 是快速且功能强大的轻量客户端（MV*）函数库，用于创建大型的网络应用。 尽管它的体积很小，但却包含以下组成：模版引擎、路由、事件函数库及标准的 MVP 模式，让代码保持模块化。\n

\n
\n \n
\n\n

\n CanJS 是一个可以让开发复杂应用程序变得简单且快速的框架。 学习简单、轻巧并且不改变你的应用结构，同时更提供一些新的功能，如自定义标签和双向绑定。\n

\n

函数库

\n
\n \n
\n\n

\n 由 Facebook 创建。 React 是一个 JavaScript 函数库，用于开发 Facebook 及 Instagram 的用户界面。 许多人认为 React 是 MVC 中的 V。\n

\n
\n \n
\n\n

\n Handlebars 让你可以无痛的建立有语义的模板。\n

\n
\n \n
\n\n

\n 浏览器和 node.js 的非同步模板。\n

\n
\n \n
\n\n

\n Асинхронный шаблонизатор для браузера и node.js.\n

\n

动画

\n
\n \n
\n\n

\n Velocity 是一个和 jQuery 的 $.animate() 有相同 API 的动画引擎。\n

\n
\n \n
\n\n

\n Bounce.js 是一个让你创造精美 CSS3 动画的工具及 JS 函数库。\n

\n
\n \n
\n\n

\n 一个简单且强大的 JavaScript 函数库，用来建立 HTML5 的。\n

\n
\n \n
\n\n

\n Move.js 是一个基于 CSS3 极为简单又优雅 JavaScript 函数库。\n

\n
\n \n
\n\n

\n SVG 是一个专门处理交互、高解析度的矢量图，让各种大小的屏幕都能完美的呈现画面。\n

\n
\n \n
\n\n

\n Rekapi 不但是一个创建 canvas 及 DOM 动画的 JavaScript 函数库，同时也是新一代浏览器中的 CSS @keyframe 动画。\n

\n
\n \n
\n\n

\n 用标识、图片或视频来建立你喜爱的图标。\n

\n
\n \n
\n\n

\n Textillate.js 结合许多写的不错的函数库来提供一个容易使用的的插件，让人可以在任何內容中使用 CSS3 的动画。\n

\n
\n \n
\n\n

\n Motio 是一个轻量的 JavaScript 函数库，基于动画和平移建立简单且强大的的 2D 动画。\n

\n
\n \n
\n\n

\n 使用 Anima 可以让人简单的同时操控近百个对象。 每一个对象都能有仿真的质量及速度效果！\n

\n
\n \n
\n\n

\n С Anima очень легко анимировать сотни объектов. Каждый объект может иметь свои характеристики, что упрощает моделирование объектов реального мира.\n

\n
\n
\n\n\n
\n
\n

游戏引擎

\n\n
\n
\n \n
\n\n

\n MelonJS 是一个免费、轻量的游戏引擎。 这个引擎集成了地图拼接格式，让关卡设计变得更轻松。\n

\n
\n \n
\n\n

\n ImpactJS 是从2010年底开始发布的可测试及运行的 HTML5 游戏引擎之一。 它保持良好的更新和维护，也用有一定的社区人员支持它。 它除了有两个关于如何使用此引擎建立游戏的书籍外，还有大量的文档可參考。\n

\n
\n \n
\n\n

\n LimeJS 是一个可以在各种触控屏幕及桌面浏览器上建立快速、原生体验游戏的 HTML5 游戏框架。\n

\n
\n \n
\n\n

\n Crafty 是从 2010 年开始就存在的一个游戏引擎。 Crafty 开发 JavaScript 游戏变得相当容易。\n

\n
\n \n
\n\n

\n Cocos2d-html5 是一个 MIT 许可的开源 2D 游戏框架。 它是一个 HTML5 版本的 Cocos2d-x 计划。 Cocos2d-html5 的开发者终于让 Cocos2d 可以跨平台。\n

\n
\n \n
\n\n

\n Phaser 依赖于 Flixel。 由已在 HTML5 社区活跃多年的 Richard Davey (Photon Storm) 维护。\n

\n
\n \n
\n\n

\n Goo 是一个基于 WebGL/HTML5 建立的 3D 游戏引擎。\n

\n
\n \n
\n\n

\n LycheeJS 是一个 JavaScript 游戏函数库，提供原型及 HTML5 Canvas，WebGL 或 原生 OpenGL(ES) 在网络浏览器或本地环境部署的完整解決方案。\n

\n
\n \n
\n\n

\n Quintus 是一个采用模块化设计的 HTML5 游戏引擎、轻量、使用容易具有简洁的 JavaScript 语法。\n

\n
\n \n
\n\n

\n Kiwi.js 是一个有趣且友善的开源 HTML5 游戏引擎。 有些人称它为 HTML5 游戏引擎界的 WordPress。\n

\n
\n \n
\n\n

\n Panda.js 是一个用于手机及电脑，使用 Canvas 和 WebGL 渲染的游戏引擎。\n

\n
\n \n
\n\n

\n Rot.js - набор Javascript библиотек, призваный помочь с разработкой ролевых игр (roguelike) для браузеров.\n

\n
\n \n
\n\n

\n Isogenic - продвинутый игровой движек, который обеспечивает поддержку соверменных сетей и возможностей HTML5 для разработки многопользовательских игр c взаимодействием в реальном времени. Система основана на потоковой передаче данных и включает в себя мощные возможности по моделированию на стороне клиента на основе дельт-обновлений (передача изменений состояния).\n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

资讯

\n\n

网站

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

订阅

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

阅读

\n\n

文章

\n\n\n
\n \n
\n\n

\n 作者 Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n 作者 Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n 作者 Scott Allen\n

\n\n\n
\n \n
\n\n

\n 作者 Ben Alman\n

\n\n\n
\n \n
\n\n

\n 作者 Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n 作者 Viljami S.\n

\n\n\n
\n \n
\n\n

\n 作者 Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n 作者 Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n 作者 JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n 作者 Ju Gonçalves\n

\n\n\n\n

书籍

\n\n\n
\n \n
\n\n

\n 作者 Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n 作者 David Flanagan\n

\n\n\n
\n \n
\n\n

\n 作者 Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n 作者 Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n 作者 James Coglan\n

\n\n\n
\n \n
\n\n

\n 作者 Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n 作者 Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n 作者 Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n 作者 Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n 作者 Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n 作者 John Resig\n

\n\n\n
\n \n
\n\n

\n 作者 Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n 作者 Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n 作者 Christian Johansen\n

\n\n\n
\n \n
\n\n

\n 作者 >Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n 作者 Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n 作者 Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n 作者 David Herman\n

\n\n\n
\n \n
\n\n

\n 作者 Michael Fogus\n

\n\n\n
\n \n
\n\n

\n 作者 Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n 作者 DevFreeBooks\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

免费电子书

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

入门学习网站

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

播客

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

拍客（Screencasts）

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

关注谁

\n\n
\n
\n
\n\n
\n
\n

PaaS 提供者

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

帮助

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"todo\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

网站创始兼维护者

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

贡献者

\n

如果没有这些伟大的贡献者，本网站也无法完成。谢谢你们帮忙完成这个网站！

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "public/zh-tw/index.html", "content": "\n\n \n \n \n \n JS: The Right Way\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n \n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n

注意！螢幕前的你！

\n\n

\n 這是一份為 JavaScript 新手準備的指南，同時也包含了可以給老手學習的最佳範本。\n

\n\n

\n 雖然本網站的名字是 the right way ，但並不表示是撰寫 JavaScript 的“唯一方法“。\n

\n\n

\n 我們只是將一些頂尖開發者的文章、提醒及技巧收集於此。由於它是由一些厲害非常的鄉民身上所收集而來，故稱之為“the right way“或是最佳做法。\n

\n\n
\n
\n\n
\n
\n

選擇你想看的主題

\n\n \n
\n
\n\n
\n
\n

開始入門

\n

關於

\n\n

\n 由 Netscape 於1995年為了 Netscape Navigator 針對 HTML 所開發的擴充套件，JavaScript 主要的功能為操作 HTML 文件及表單驗證。\n\n 在贏得今日的廣為人知的名字前，JavaScript 原名為 Mocha。在它發布第一次測試版時，官方將它命名為 LiveScript，最後在 Sun Microsystems 公布發行版時，被重新命名為今日廣為人知的名字。\n\n 由於 JavaScript 名字相近於 Java，所以常讓人搞混。雖然兩者在名字組成上有部分相同，但並不是相同的語言。\n\n 不同於 C、C# 及 Java，JavaScript 是直譯式語言。這意味者它需要一個“直譯器“。就 JavaScript 而言，瀏覽器就是它的直譯器。\n

\n\n

最新版本

\n\n

\n ECMAScript 是 JavaScript 的準則。截至2012年止，所有最新流行的瀏覽器都可以支援 ECMAScript 5.1。舊的瀏覽器至少會支援 ECMAScript 3。2015年6月 ES6/ES2015 準則已完成。前往閱讀 ECMAScript 2015 準則 Ecma International.\n

\n\n

\n JavaScript 的最佳參考版本、參考資料及最新消息可以前往 Mozilla Developer Network.\n

\n\n

DOM

\n\n

\n Document Object Model (DOM) 是 HTML 及 XML 文檔的 API。它提供了文件的結構化呈現，讓你可以使用腳本語言（如 JavaScript）來更改它的內容及視覺呈現。其他更詳盡的內容 Mozilla Developer Network - 文件物件模型（DOM）.\n

\n\n
\n
\n\n
\n
\n

JavaScript 編碼風格

\n

程式碼慣例

\n\n

\n JavaScript 和其他程式語言一樣，有各種版本的編碼風格指引。或許大家常會推薦 Google Code Style Guide for JavaScript，但我們更推薦 Idiomatic.js\n

\n\n

程式碼檢查

\n\n

\n 現今最好的 JavaScript 編碼檢查工具為 JSHint。我們強烈建議盡可能使用檢查工具來確認你的編碼風格及設計模式的正確性。\n

\n\n
\n\n
\n
\n

語言精粹

\n

物件導向

\n\n

\n JavaScript 即使跟其他語言在物件導向方面有些爭論的地方，但仍具有強烈物件導向的編程能力。\n

\n\n

\n 來源: JavaScript 物件導向介紹\n

\n\n

匿名函式

\n\n

\n 匿名函式是在程式運行時動態宣告的函式。之所以稱為匿名函式是因為它跟其他一般函式不同，它並沒有給予指定的函式名稱。\n

\n\n

\n 來源: JavaScript anonymous functions\n

\n\n

第一級物件為函式（function）

\n\n

\n 函式（function）是 JavaScript 的第一級物件。這意味著 JavaScript 中的函式（function）只是一種特殊型態的物件，並且能做到一般物件所能執行的行為。\n

\n\n

\n 來源: Functions are first class objects in JavaScript\n

\n\n

弱型別

\n\n

\n 對於許多前端開發者而言，JavaScript 是他們所使用的第一個腳本語言或是直譯語言。對這些開發者來說，弱型別變數的概念跟影響或許像是第二天性一般自然。然而現在網頁應用程式的爆炸性成長需求，使得後端開發者必需涉足客戶端技術。這類的開發者大部分都有強型別的語言背景，例如 C# 或是 Java，因此並不熟悉弱型別變數所給予的高度自由及潛在的陷阱。\n

\n\n

\n 來源: Understanding Loose Typing in JavaScript\n

\n\n

作用域及變數提升

\n\n

\n 作用域： 在 JavaScript 中，函式是我們在宣告變量時，實際的作用域分隔符，也就是說常見的迴圈及條件式（如 if, for, while, switch 及 try）並“不能“指定作用域，這一點是有別於大部分的程式語言。因此函式中的這些區塊將會共享相同的作用域。這樣使得在這些區塊內部宣告只屬於這些區塊的變量的行為變成可能是危險的。\n

\n\n

\n 變量提升： 在運行時，所有的變數及函式宣告將會被移至各函式的起始位置（即函式的作用域）- 這就是所謂的變量提升。雖然如此，但是良好的習慣還是在作用域的一開始就先宣告所有變量，避免因未宣告就操作變量造成未預期的錯誤。 - 這是一個習慣有區塊作用域語言開發者的常見問題。\n

\n\n

\n 來源: JavaScript Scoping and Hoisting\n

\n\n

函式綁定

\n\n

\n 剛開始學習 JavaScript 時，你可能不需花什麼時間在處理函式綁定上面，但你漸漸會遇到如何在另一個函式中保留 this 內容的問題，最終你會了解，你真正需要的其實是 函式原型綁定（Function.prototype.bind()）。\n

\n\n

\n 來源: Understanding JavaScript’s Function.prototype.bind\n

\n\n

閉包函式

\n\n

\n 閉包是參照獨立（自由）變量的函式。換句話說，閉包中所定義的函式會“保留“它被產生出來時的環境。\n 了解這個概念是很重要的，因為它在開發過程中是有用的，類似私有方法的功能。它也可以幫助你學習如何避免一些常見的錯誤，例如在迴圈中使用閉包。\n

\n\n

\n 來源: MDN - Closures\n

\n\n

嚴格模式

\n\n

\n ECMAScript 5 的嚴格模式是用來限制一些 JavaScript 不嚴謹的寫法。嚴格模式並非只是一個子集：它特地在語義上有別於一般的程式碼。各家瀏覽器對於嚴格模式有不同的支援度，所以在使用嚴格模式時，建議要進行功能測試。嚴格模式的程式碼與非嚴格模式的程式碼是可以並存的，所以可以自由決定嚴格模式部分的多寡。\n

\n\n

\n 來源: MDN - Strict mode\n

\n\n

立即調用函式 (IIFE)

\n\n

\n 立即調用函式是指使用 JavaScript 的函式來限制作用域範圍的模式。立即調用函式可以阻止區塊內的變量提升，保護區塊內的變量不被其他作用範圍的變量污染，同時也允許宣告公開方法來操作區塊中的私有變量。

\n 這種模式被稱為自執行匿名函式，但 @cowboy (Ben Alman) 為它定義了語義上更適合的字彙 IIFE 。\n

\n\n

\n 來源: Immediately-Invoked Function Expression (IIFE)\n

\n\n
\n
\n\n
\n
\n

MUST SEE

\n\n
\n
\n
Arindam Paul - JavaScript VM internals, EventLoop, Async and ScopeChains
\n
\n \n
\n
\n
\n
\n
\n\n
\n
\n

設計模式

\n \n

說明

\n\n

\n 雖然 JavaScript 包含了自身語言獨有的設計模式，但許多經典的設計模式仍然可以實作。\n

\n\n

\n Addy Osmani 的開源書 Learning JavaScript Design Patterns 是很好的學習範本，下面大多數的連結都出自本書。\n

\n\n

設計模式

\n\n
\n \n
\n\n

\n 創建型設計模式\n

\n\n
\n \n
\n\n

\n 結構型設計模式\n

\n\n
\n \n
\n\n

\n 行為型設計模式\n

\n\n

框架模式（MV* Patterns）

\n\n
\n 底下有一些 JavaScript 傳統 MVC 模式及從中衍生的變形模式的實作。\n
\n\n
\n \n
\n\n
\n
\n\n
\n
\n

測試工具

\n

說明

\n\n

JavaScript 程式測試相關的函式庫及框架。

\n\n\n

Links

\n
\n \n
\n\n

\n 由 TJ Holowaychuk 維護。\n

\n
\n \n
\n\n

\n 由 jQuery 維護。\n

\n
\n \n
\n\n

\n 由 Pivotal Labs 維護。\n

\n
\n \n
\n\n

\n 由 the team behind AngularJS. Mostly by Vojta Jina 維護。\n

\n
\n \n
\n\n

\n 由 Sitepen 維護。\n

\n
\n \n
\n\n

\n JavaScript 程式碼覆蓋率工具，由 Krishnan Anantheswaran 維護。\n

\n
\n \n
\n\n

\n JavaScript 獨立測試替身套件（包含 Test spy, stub 及 mock）。 不相依及共同運作於任何的單元測試框架。由 Sinon.JS community 原創。\n

\n
\n \n
\n\n

\n 模擬函式及 XHR 物件的測試幫助工具，由 Leo Balter 維護。\n

\n
\n \n
\n\n

\n Тест-ранер (утилита для запуска тестов) с асинхронными тестами, поддерживается Sindre Sorhus\n

\n
\n \n
\n\n

\n Безболезненное тестирование Javascript, поддерживается Facebook\n

\n\n
\n
\n\n
\n
\n

框架

\n\n

熱門

\n
\n \n
\n\n

\n jQuery 是一個快速、輕巧及功能豐富的 JavaScript 函式庫。由 John Resig 建立。\n

\n
\n \n
\n\n

\n 由 Yahoo 建立！ YUI 是一個免費、開源的 JavaScript 及 CSS 函式庫，適用於建立多互動的 web 應用程式。 已於2014年8月29日停止更新.\n

\n
\n \n
\n\n

\n Zepto 是一個針對現代瀏覽器開發，極簡的 JavaScript 函式庫，兼容大量的 jQuery API。只要你會用 jQuery，那麼你就已經會用 Zepto 了。\n

\n
\n \n
\n\n

\n Dojo 是一個免費、開源的 JavaScript 工具包，用來建立高效能的網站應用程式。專案贊助商有 IBM 及 SitePen。\n

\n
\n \n
\n\n

\n Underscore.js 是一個提供整套函式編程的有用助手，同時並不擴充原生物件的 JavaScript 函式庫。\n

\n

MV*

\n
\n \n
\n\n

\n 非常熱門的 JavaScript 客端框架，由 @jashkenas 建立。\n

\n
\n \n
\n\n

\n 由 @wycats 建立， jQuery 及 Ruby on Rails 核心開發者。\n

\n
\n \n
\n\n

\n 使用 Model-View-View Model (MVVM) 的簡單動態 JavaScript 用戶介面。\n

\n
\n \n
\n\n

\n 由 Google 建立，Angular.js 類似 polyfill 用於 HTML。\n

\n
\n \n
\n\n

\n 一个framework.Mobile和桌面。 一种使用Angular创建应用程序的方法，并使用您的代码和技能为每个部署目标创建应用程序。 对于web，移动网站，本机手机和本地桌面。\n

\n
\n \n
\n\n

\n Cappuccino 是一個可以讓人簡單架起運行在瀏覽器的桌面應用程式的開源框架。\n

\n
\n \n
\n\n

\n JavaScriptMVC 是一個包含 jQuery 最佳創意的開源框架。\n

\n
\n \n
\n\n

\n Meteor 是一個不論是新手或老手都可以在短時間內建立起高品質網路應用程式的開源平台。\n

\n
\n \n
\n\n

\n Spice 是一個超級迷你（< 3k）且有彈性的 javascript MVC 框架。 Spice 可以輕鬆的相容於任何已存在的應用且可和其他技術如 jQuery、pjax、turbolinks、node 或是任何你正在使用的技術共同順暢運作。\n

\n
\n \n
\n\n

\n Riot 是一個極快速且功能強大的輕量客戶端（MV*）函式庫，用於建立大型的網路應用程序。 儘管它的體形很小，但卻內含以下組成：模版引擎、路由、事件函式庫及嚴格的 MVP 模式，讓程式保持結構化。\n

\n
\n \n
\n\n

\n CanJS 是一個可以讓開發複雜應用程序變得簡單且快速的框架。 學習簡單、輕巧且不改變你的應用程序結構，同時更提供一些新的功能，如客製化標籤及雙向綁定。\n

\n

函式庫

\n
\n \n
\n\n

\n 由 Facebook 創立。 React 是一個 JavaScript 函式庫，用於產生 Facebook 及 Instagram 的用戶界面。 許多人認為 React 是 MVC 中的 V。\n

\n
\n \n
\n\n

\n Handlebars 讓你可以無痛的建立有語義的樣版。\n

\n
\n \n
\n\n

\n 瀏覽器和 node.js 的非同步樣版。\n

\n
\n \n
\n\n

\n Асинхронный шаблонизатор для браузера и node.js.\n

\n

動畫

\n
\n \n
\n\n

\n Velocity 是一個和 jQuery 的 $.animate() 有相同 API 的遊戲引擎。\n

\n
\n \n
\n\n

\n Bounce.js 是一個讓你可以創造美麗 CSS3 動畫的工具及 JS 函式庫。\n

\n
\n \n
\n\n

\n 一個簡單且強大的 JavaScript 函式庫，用來建立 HTML5 的補間動畫。\n

\n
\n \n
\n\n

\n Move.js 是一個基於 CSS3 極為簡單及優雅的輕量 JavaScript 函式庫。\n

\n
\n \n
\n\n

\n SVG 是一個專門處理互動、高解析度的向量繪圖，讓各種大小的螢幕都能完美的呈現畫面。\n

\n
\n \n
\n\n

\n Rekapi 不但是一個建造 canvas 及 DOM 動畫的 JavaScript 函式庫，同時也是新一代瀏覽器中的 CSS 影格動畫。\n

\n
\n \n
\n\n

\n 用標誌、圖片或影象來建立你的喜愛圖示。\n

\n
\n \n
\n\n

\n Textillate.js 結合許多寫得不錯的函式庫來提供一個容易使用的插件，讓人可以在任何內容中使用 CSS3 的動畫。\n

\n
\n \n
\n\n

\n Motio 是一個輕量的 JavaScript 函式庫，基於動畫及平移建立簡單但強大的 2D 動畫。\n

\n
\n \n
\n\n

\n 使用 Anima 可以讓人簡單的同時操控近百個物件。 每一個物件都能擁有仿真的質量及速度效果！\n

\n
\n \n
\n\n

\n С Anima очень легко анимировать сотни объектов. Каждый объект может иметь свои характеристики, что упрощает моделирование объектов реального мира.\n

\n
\n
\n\n\n
\n
\n

遊戲引擎

\n\n
\n
\n \n
\n\n

\n MelonJS 是一個免費、輕量的遊戲引擎。 這個引擎整合了圖磚格式，讓關卡設計變得更輕鬆。\n

\n
\n \n
\n\n

\n ImpactJS 是從2010年底開始發行的可測試及實行的 HTML5 遊戲引擎之一。 它保持良好的更新與維護，亦擁有一定數量的社群支持它。 它除了有兩本關於如何使用此引擎建立遊戲的書藉外，還有大量的文檔可參考。\n

\n
\n \n
\n\n

\n LimeJS 是一個可以在各種觸控螢幕及桌面瀏覽器上建立快速、本機體驗遊戲的 HTML5 遊戲框架。\n

\n
\n \n
\n\n

\n Crafty 是從2010年開始就存在的一個遊戲引擎。 Crafty 讓開發 JavaScript 遊戲變得相當容易。\n

\n
\n \n
\n\n

\n Cocos2d-html5 是一個 MIT 許可的開源網路 2D 遊戲框架。 它是一個 HTML5 版本的 Cocos2d-x 計劃。 Cocos2d-html5 的發展著重於讓 Cocos2d 可以跨越瀏覽器及本地應用程序等平台。\n

\n
\n \n
\n\n

\n Phaser 相依於 Flixel。 由已在 HTML5 社群活躍多年的 Richard Davey (Photon Storm) 維護。\n

\n
\n \n
\n\n

\n Goo 是一個基於 WebGL/HTML5 建立的 3D 遊戲引擎。\n

\n
\n \n
\n\n

\n LycheeJS 是一個 JavaScript 遊戲函式庫，提供原型及 HTML5 Canvas，WebGL 或 原生 OpenGL(ES) 在網路瀏覽器或本地環境部署的完整解決方案。\n

\n
\n \n
\n\n

\n Quintus 是一個採用模組化設計的 HTML5 遊戲引擎、輕量、使用友善且簡潔的 JavaScript 語法。\n

\n
\n \n
\n\n

\n Kiwi.js 是一個有趣且友善的開源 HTML5 遊戲引擎。 有些人戲稱它為 HTML5 遊戲引擎界的 WordPress。\n

\n
\n \n
\n\n

\n Panda.js 是一個用於手機及電腦，使用 Canvas 和 WebGL 渲染的遊戲引擎。\n

\n
\n \n
\n\n

\n Rot.js - набор Javascript библиотек, призваный помочь с разработкой ролевых игр (roguelike) для браузеров.\n

\n
\n \n
\n\n

\n Isogenic - продвинутый игровой движек, который обеспечивает поддержку соверменных сетей и возможностей HTML5 для разработки многопользовательских игр c взаимодействием в реальном времени. Система основана на потоковой передаче данных и включает в себя мощные возможности по моделированию на стороне клиента на основе дельт-обновлений (передача изменений состояния).\n

\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

最新訊息

\n\n

網站

\n
\n

\n JavaScript.com\n

\n

\n Echo JS\n

\n

\n The Treehouse Show\n

\n

\n /r/javascript on Reddit\n

\n

\n Open Web Platform Daily Digest\n

\n

\n Badass JavaScript\n

\n

\n AngularJS Daily\n

\n
\n

新訊訂閱

\n
\n

\n JavaScript Weekly\n

\n

\n A Drip of JavaScript\n

\n

\n Ember Weekly\n

\n

\n Node Weekly\n

\n

\n Meteor Weekly\n

\n

\n Grunt Weekly\n

\n

\n Gamedev.js Weekly\n

\n

\n HTML5 Weekly\n

\n

\n UDGWebDev Weekly\n

\n

\n The React Newsletter\n

\n
\n\n
\n
\n\n
\n
\n

延伸閱讀

\n\n

文章

\n\n\n
\n \n
\n\n

\n 作者 Quildreen Motta\n

\n\n\n
\n \n
\n\n

\n 作者 Yehuda Katz\n

\n\n\n
\n \n
\n\n

\n 作者 Scott Allen\n

\n\n\n
\n \n
\n\n

\n 作者 Ben Alman\n

\n\n\n
\n \n
\n\n

\n 作者 Nico Bevacqua\n

\n\n\n
\n \n
\n\n

\n 作者 Viljami S.\n

\n\n\n
\n \n
\n\n

\n 作者 Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n 作者 Kirupa Chinnathambi\n

\n\n\n
\n \n
\n\n

\n 作者 JavaScript Is Sexy\n

\n\n\n
\n \n
\n\n

\n 作者 Ju Gonçalves\n

\n\n\n\n

書藉

\n\n\n
\n \n
\n\n

\n 作者 Marijn Haverbeke\n

\n\n\n
\n \n
\n\n

\n 作者 David Flanagan\n

\n\n\n
\n \n
\n\n

\n 作者 Douglas Crockford\n

\n\n\n
\n \n
\n\n

\n 作者 Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n 作者 James Coglan\n

\n\n\n
\n \n
\n\n

\n 作者 Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n 作者 Nicholas C. Zakas\n

\n\n\n
\n \n
\n\n

\n 作者 Henrik Joreteg\n

\n\n\n
\n \n
\n\n

\n 作者 Stoyan Stefanov\n

\n\n\n
\n \n
\n\n

\n 作者 Dustin Diaz\n

\n\n\n
\n \n
\n\n

\n 作者 John Resig\n

\n\n\n
\n \n
\n\n

\n 作者 Nicolas Bevacqua\n

\n\n\n
\n \n
\n\n

\n 作者 Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n 作者 Christian Johansen\n

\n\n\n
\n \n
\n\n

\n 作者 >Kyle Simpson\n

\n\n\n
\n \n
\n\n

\n 作者 Ryan Burgess\n

\n\n\n
\n \n
\n\n

\n 作者 Ivo Wetzel\n

\n\n\n
\n \n
\n\n

\n 作者 David Herman\n

\n\n\n
\n \n
\n\n

\n 作者 Michael Fogus\n

\n\n\n
\n \n
\n\n

\n 作者 Reginald Braithwaite\n

\n\n\n
\n \n
\n\n

\n 作者 DevFreeBooks\n

\n\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n\n
\n \n
\n\n

\n by DevFreeBooks\n

\n\n\n\n

免費電子書

\n\n\n
\n\n

\n JSBooks\n

\n

\n DevFreeBooks\n

\n\n
\n\n

入口網站

\n\n\n
\n\n

\n JavaScript.com\n

\n

\n HTML5 Rocks\n

\n

\n W3Fools\n

\n

\n Mozilla Developer Network\n

\n

\n Web Platform\n

\n

\n Smashing Magazine\n

\n

\n Node School\n

\n

\n How to Node\n

\n

\n Felix’s Node.js Beginners Guide\n

\n\n
\n\n\n
\n
\n\n
\n
\n

播客

\n\n

\n
\n

\n Ember Hot Seat\n

\n

\n JavaScript Jabber\n

\n

\n Node Up\n

\n

\n 5 Minutes of JavaScript\n

\n

\n The Meteor Podcast\n

\n

\n JSConf\n

\n

\n JavaScript Air\n

\n
\n
\n
\n\n
\n
\n

拍客（Screencasts）

\n\n
\n \n \"Egghead\"\n \n
\n
\n \n \"DevFreeCasts\"\n \n
\n
\n \n \"tagtree.tv\"\n \n
\n
\n \n \"frontndmasters.com\"\n \n
\n\n
\n
\n\n
\n
\n

誰在關注

\n\n
\n
\n
\n\n
\n
\n

PaaS 提供者

\n\n

\n
\n\n

\n Heroku\n

\n

\n Modulus\n

\n

\n Nodejitsu\n

\n

\n OpenShift\n

\n

\n Getup\n

\n

\n Windows Azure\n

\n\n
\n
\n
\n\n
\n
\n

幫手

\n\n
\n\n \n
\n \"npm\"\n
\n \n \n
\n \"bower\"\n
\n \n \n
\n \"yeoman\"\n
\n \n \n
\n \"grunt\"\n
\n \n \n
\n \"gulp\"\n
\n \n \n
\n \"brunch\"\n
\n \n \n
\n \"Browser\n
\n \n \n
\n \"todo\n
\n \n \n
\n \"Rollup\"\n
\n \n \n
\n \"Browserify\"\n
\n \n \n
\n \"todo\n
\n \n\n
\n
\n
\n\n
\n
\n
\n

網站創始兼維護者

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

貢獻者

\n

如果沒有這些偉大的貢獻者，本網站也無法完成。謝謝你們幫忙完成這個網站！

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n" }, { "path": "scripts/tasks/i18n.js", "content": "/*\n * i18n\n *\n * Make/render the index file for each language\n * Copyright (c) 2015 Allan Esquina, contributors\n * Licensed under the MIT license.\n */\n\n'use strict';\n\nmodule.exports = function (grunt) {\n var path = require('path');\n var extend = require('node.extend');\n var mustache = require('mustache');\n var Entities = require('html-entities').AllHtmlEntities;\n var htmlMinify = require('html-minifier').minify;\n var entities = new Entities();\n\n // Constants\n var JSON_PATH = path.join(__dirname, '../../i18n');\n var TEMPLATE_PATH = path.join(__dirname, '../../templates');\n var PUBLIC_PATH = path.join(__dirname, '../../public');\n var TEMPLATE_FILE = 'index.html';\n var DEFAULT_LANGUAGE = 'en-us.json';\n\n // Read the i18n directory and render a template with the json's data\n var generate = function () {\n var template = grunt.file.read(path.join(TEMPLATE_PATH, TEMPLATE_FILE));\n var data, t, label;\n var defaultData = grunt.file.readJSON(path.join(JSON_PATH, DEFAULT_LANGUAGE.replace('.json', ''),DEFAULT_LANGUAGE));\n\n\n grunt.file.recurse( JSON_PATH, function (abspath, rootdir, subdir, filename){\n\n if(filename.indexOf('.json') !== -1) {\n data = getData(path.join(JSON_PATH, filename.replace('.json', ''), filename), filename.replace('.json', ''));\n\n // Extend from default language\n data = extend(true, defaultData, data);\n\n data.dropdown = {\n options: data.languages.map(function (lang) {\n var buf;\n if(lang.url !== filename.replace('.json', '')) {\n\n buf = {name:lang.name, url: DEFAULT_LANGUAGE.replace('.json', '') === lang.url ? '' : lang.url};\n } else {\n label = lang.name;\n buf = false;\n }\n return buf;\n }).filter(function (l) {\n return l;\n }),\n label: label\n };\n\n // Paths\n var prop = grunt.cli.tasks.indexOf('dist') !== -1 ? 'dist' : 'dev';\n data.paths = grunt.config.get('application')[prop];\n\n t = mustache.to_html(template, data);\n save(TEMPLATE_FILE, filename, entities.decode(t));\n\n // Save the index file on the Public derectory with the default language\n if(DEFAULT_LANGUAGE === filename) {\n save(TEMPLATE_FILE, '', entities.decode(t));\n }\n }\n });\n }\n\n // Save a file with the rendered template\n var save = function (name, dest, content) {\n try {\n grunt.log.write('Creating file ' + path.join(PUBLIC_PATH, dest.replace('.json', ''), name) + '\\n');\n grunt.file.write(path.join(PUBLIC_PATH, dest.replace('.json', ''), name), htmlMinify(content));\n } catch (e) {\n grunt.log.write(e);\n }\n }\n\n // Parse @link files if exists\n var getData = function (filename, lang) {\n var data = grunt.file.readJSON(filename);\n var re = /{{@link=([^\\s]+)}}/, res;\n data = (function r(o) {\n var tmp;\n if( typeof o === \"object\" ) {\n for (var v in o) {\n if (o.hasOwnProperty(v)) {\n o[v] = r(o[v]);\n }\n }\n }\n else {\n res= re.exec(o);\n if(res) {\n tmp = grunt.file.read(path.join(JSON_PATH,lang,res[1]));\n o = tmp !== '' ? tmp : 'File ' + path.join(JSON_PATH,lang,res[1]) + ' not found.'\n }\n }\n return o;\n }(data));\n return data\n }\n\n grunt.registerTask('i18n', function () {\n grunt.log.write('Translating...\\n');\n generate.call();\n });\n}\n" }, { "path": "templates/index.html", "content": "\n\n \n \n \n \n {{meta.title}}\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n\n \n
\n \n \n \n
\n\n
\n \n \n \n
\n

JavaScript

\n The Right Way\n
\n\n
\n \n \n
    \n {{ #dropdown.options }}\n
  • {{ name }}
    • \n {{ /dropdown.options }}\n
\n
\n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n\n
\n \n \n \n \"\"\n
\n
\n
\n
\n\n
\n
\n {{ welcome }}\n
\n
\n\n
\n
\n

{{ menu.title }}

\n\n
    \n {{#menu.links}}\n
  • {{title}}
    • \n {{/menu.links}}\n
\n
\n
\n\n
\n
\n

{{ gettingStarted.title }}

\n {{ gettingStarted.text }}\n
\n
\n\n
\n
\n

{{ codeStyle.title }}

\n {{ codeStyle.text }}\n
\n\n
\n
\n

{{ goodParts.title }}

\n {{ goodParts.text }}\n
\n
\n\n
\n
\n

{{ mustSee.title }}

\n\n
\n {{#mustSee.videos}}\n
\n
{{title}}
\n
\n \n
\n
\n {{/mustSee.videos}}\n
\n
\n
\n\n
\n
\n

{{ patterns.title}}

\n {{patterns.text}}\n
\n
\n\n
\n
\n

{{testingTools.title}}

\n {{testingTools.text}}\n\n

Links

\n {{#testingTools.links}}\n
\n \n
\n\n

\n {{description}}\n

\n {{/testingTools.links}}\n\n
\n
\n\n
\n
\n

{{frameworks.title}}

\n\n {{#frameworks.cat}}\n

{{title}}

\n {{#links}}\n
\n \n
\n\n

\n {{description}}\n

\n {{/links}}\n {{/frameworks.cat}}\n
\n
\n\n\n
\n
\n

{{gameEngines.title}}

\n\n
\n {{#gameEngines.links}}\n
\n \n
\n\n

\n {{description}}\n

\n {{/gameEngines.links}}\n\n
\n
\n\n
\n \n \n \n
\n\n
\n
\n

{{news.title}}

\n\n {{#news.cat}}\n

{{title}}

\n
\n {{#links}}\n

\n {{name}}\n

\n {{/links}}\n
\n {{/news.cat}}\n\n
\n
\n\n
\n
\n

{{reading.title}}

\n\n {{#reading.cat}}\n

{{title}}

\n\n {{#credit}}\n {{#links}}\n\n
\n \n
\n\n

\n {{description}}\n

\n\n {{/links}}\n {{/credit}}\n\n {{#box}}\n
\n\n {{#links}}\n

\n {{name}}\n

\n {{/links}}\n\n
\n {{/box}}\n\n {{/reading.cat}}\n\n
\n
\n\n
\n
\n

{{podcasts.title}}

\n\n

\n
\n {{#podcasts.links}}\n

\n {{name}}\n

\n {{/podcasts.links}}\n
\n
\n
\n\n
\n
\n

{{screencasts.title}}

\n\n {{#screencasts.links}}\n
\n \n \"{{name}}\"\n \n
\n {{/screencasts.links}}\n\n
\n
\n\n
\n
\n

{{whoToFollow.title}}

\n\n
\n
\n
\n\n
\n
\n

{{paasProviders.title}}

\n\n

\n
\n\n {{#paasProviders.links}}\n

\n {{name}}\n

\n {{/paasProviders.links}}\n\n
\n
\n
\n\n
\n
\n

{{helpers.title}}

\n\n
\n\n {{#helpers.links}}\n \n
\n \"{{name}}\"\n
\n \n {{/helpers.links}}\n\n
\n
\n
\n\n
\n
\n
\n

{{footer.credit}}

\n \n \"William\n William Oliveira\n \n\n \n \"Allan\n Allan Esquina\n \n
\n\n
\n\n
\n

{{footer.contributors}}

\n

{{footer.contribDesc}}

\n
\n
\n\n {{footer.licence}}\n\n
\n
\n\n
\n \n \n \n
\n\n \n \n
\n \n \n\n" }, { "path": "templates/old_index.html", "content": "\n\n \n \n JS: The Right Way\n \n \n \n \n \n \n \n \n \n \n \n\n \n
\n \"Fork\n\n
\n

JavaScript

\n The Right Way\n
\n
\n\n
\n
\n
\n \n\n \n\n \n
\n
\n\n
\n
\n Tweet\n\n
\n\n
\n
\n
\n
\n\n
\n
\n

Hey, you!

\n\n

\n This is a guide intended to introduce new developers to JavaScript and help experienced developers learn more about its best practices.\n

\n\n

\n Despite the name, this guide doesn't necessarily mean \"the only way\" to do JavaScript.\n

\n\n

\n We just gather all the articles, tips, and tricks from top developers and put it here. Since it comes from exceptional folks, we could say that it is \"the right way\", or the best way to do so.\n

\n
\n
\n\n
\n
\n

Choose your path

\n\n \n
\n
\n\n
\n
\n

GETTING STARTED

\n\n

ABOUT

\n\n

\n Created by Netscape in 1995 as an extension of HTML for Netscape Navigator 2.0, JavaScript had as its main function the manipulation of HTML documents and form validation.\n\n Before winning this name so famous nowadays, JavaScript was called Mocha. When it first shipped in beta releases, it was officially called LiveScript and finally, when it was released by Sun Microsystems, was baptized with the name by which it is known today.\n\n Because of the similar names, people confuse JavaScript with Java. Although both have the lexical structure of programming, they are not the same language.\n\n Different from C, C# and Java, JavaScript is an interpreted language. It means that it needs an \"interpreter\". In case of JavaScript, the interpreter is the browser.\n

\n\n

CURRENT VERSION

\n\n

\n The JavaScript standard is ECMAScript. As of 2012, all modern browsers fully support ECMAScript 5.1. Older browsers support at least ECMAScript 3. A 6th major revision of the standard is being worked on.\n

\n\n

\n A good reference to versions, references and news about JavaScript can be found at the Mozilla Developer Network.\n

\n\n

THE DOM

\n\n

\n The Document Object Model (DOM) is an API for HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript. See more at Mozilla Developer Network - DOM.\n

\n
\n
\n\n
\n
\n

JS CODE STYLE

\n\n

Conventions

\n\n

\n As every language, JavaScript has many code style guides. Maybe the most used and recommended is the Google Code Style Guide for JavaScript, but we recommend you read Idiomatic.js.\n

\n\n

Linting

\n\n

\n Nowadays the best tool for linting your JavaScript code is JSHint. We recommend that whenever possible you verify your code style and patterns with a Lint tool.\n

\n
\n
\n\n
\n
\n

THE GOOD PARTS

\n\n

Object Oriented

\n\n

\n JavaScript has strong object-oriented programming capabilities, even though some debates have taken place due to the differences in object-oriented JavaScript compared to other languages.\n

\n\n

\n Source: Introduction to Object-Oriented JavaScript\n

\n\n

Anonymous Functions

\n\n

\n Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.\n

\n\n

\n Source: JavaScript anonymous functions\n

\n\n

Functions as First-class Objects

\n\n

\n Functions in JavaScript are first class objects. This means that JavaScript functions are just a special type of object that can do all the things that regular objects can do.\n

\n\n

\n Source: Functions are first class objects in JavaScript\n

\n\n

Loose Typing

\n\n

\n For many front-end developers, JavaScript was their first taste of a scripting and/or interpretive language. To these developers, the concept and implications of loosely typed variables may be second nature. However, the explosive growth in demand for modern web applications has resulted in a growing number of back-end developers that have had to dip their feet into the pool of client-side technologies. Many of these developers are coming from a background of strongly typed languages, such as C# or Java, and are unfamiliar with both the freedom and the potential pitfalls involved in working with loosely typed variables.\n

\n\n

\n Source: Understanding Loose Typing in JavaScript\n

\n\n

Scoping and Hoisting

\n\n

\n Scoping: In JavaScript, functions are our de facto scope delimiters for declaring vars, which means that usual blocks from loops and conditionals (such as if, for, while, switch and try) DON'T delimit scope, unlike most other languages. Therefore, those blocks will share the same scope as the function which contains them. This way, it might be dangerous to declare vars inside blocks as it would seem the var belongs to that block only.\n

\n\n

\n Hoisting: On runtime, all var and function declarations are moved to the beginning of each function (its scope) - this is known as Hoisting. Having said so, it is a good practice to declare all the vars altogether on the first line, in order to avoid false expectations with a var that got declared late but happened to hold a value before - this is a common problem for programmers coming from languages with block scope.\n

\n\n

\n Source: JavaScript Scoping and Hoisting\n

\n\n

Function Binding

\n\n

\n Function binding is most probably the least of your concerns when beginning with JavaScript, but when you realize that you need a solution to the problem of how to keep the context of this within another function, then you might realize that what you actually need is Function.prototype.bind().\n

\n\n

\n Source: Understanding JavaScript’s Function.prototype.bind\n

\n\n

Closure Function

\n\n

\n Closures are functions that refer to independent (free) variables. In other words, the function defined in the closure 'remembers' the environment in which it was created in.\n \t\t It is an important concept to understand as it can be useful during development, like emulating private methods. It can also help to learn how to avoid common mistakes, like creating closures in loops.\n

\n\n

\n Source: MDN - Closures\n

\n\n \t

Strict mode

\n\n

\n ECMAScript 5's strict mode is a way to opt in to a restricted variant of JavaScript. Strict mode isn't just a subset: it intentionally has different semantics from normal code. Browsers not supporting strict mode will run strict mode code with different behavior from browsers that do, so don't rely on strict mode without feature-testing for support for the relevant aspects of strict mode. Strict mode code and non-strict mode code can coexist, so scripts can opt into strict mode incrementally.\n

\n\n

\n Source: MDN - Strict mode\n

\n\n

Immediately-Invoked Function Expression (IIFE)

\n\n

\n An immediately-invoked function expression is a pattern which produces a lexical scope using JavaScript's function scoping. Immediately-invoked function expressions can be used to avoid variable hoisting from within blocks, protect against polluting the global environment and simultaneously allow public access to methods while retaining privacy for variables defined within the function.

\n This pattern has been referred to as a self-executing anonymous function, but @cowboy (Ben Alman) introduced the term IIFE as a more semantically accurate term for the pattern.\n

\n\n

\n Source: Immediately-Invoked Function Expression (IIFE)\n

\n\n\n
\n
\n\n
\n
\n

PATTERNS

\n\n

Description

\n\n

\n While JavaScript contains design patterns that are exclusive to the language, many classical design patterns can also be implemented.\n

\n\n

\n A good way to learn about these is Addy Osmani’s open source book Learning JavaScript Design Patterns, and the links below are (in the majority) based on it.\n

\n\n

Design Patterns

\n\n
\n \n
\n\n

\n Creational Design Patterns\n

\n\n
\n \n
\n\n

\n Structural Design Patterns\n

\n\n
\n \n
\n\n

\n Behavioral Design Patterns\n

\n\n

MV* Patterns

\n\n
\n There are some implementations of the traditional MVC Pattern and its variations in JavaScript.\n
\n\n
\n \n
\n
\n
\n\n
\n
\n

TESTING TOOLS

\n\n

Description

\n\n

Various libraries and frameworks to do tests in JavaScript.

\n\n

Links

\n\n
\n \n
\n\n

\n Maintained by TJ Holowaychuk\n

\n\n
\n \n
\n\n

\n Maintained by jQuery\n

\n\n
\n \n
\n\n

\n Maintained by Pivotal Labs\n

\n\n
\n \n
\n\n

\n Maintained by the team behind AngularJS. Mostly by Vojta Jina\n

\n\n
\n \n
\n\n

\n Maintained by Sitepen\n

\n\n
\n \n
\n\n

\n A JavaScript code coverage tool written in JavaScript, maintained by Krishnan Anantheswaran\n

\n\n
\n \n
\n\n

\n Standalone test spies, stubs and mocks for JavaScript. No dependencies, works with any unit testing framework. Created by Christian Johansen, maintained by Sinon.JS community.\n

\n\n
\n \n
\n\n

\n A test helper to mock functions and the XHR object, maintained by Leo Balter\n

\n
\n
\n\n
\n
\n

Frameworks

\n\n

General Purpose

\n\n
\n \n
\n\n

\n jQuery is a fast, small, and feature-rich JavaScript library. Built by John Resig.\n

\n\n
\n \n
\n\n

\n Built by Yahoo!, YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. New development has stopped since August 29th, 2014.\n

\n\n
\n \n
\n\n

\n Zepto is a minimalist JavaScript library for modern browsers with a largely jQuery-compatible API. If you use jQuery, you already know how to use Zepto.\n

\n\n
\n \n
\n\n

\n Dojo is a free, open-source JavaScript toolkit for building high performance web applications. Project sponsors include IBM and SitePen.\n

\n\n
\n \n
\n\n

\n Underscore.js is a JavaScript library that provides a whole mess of useful functional programming helpers without extending any built-in objects.\n

\n\n
\n \n
\n\n

\n A tool for creating and composing asynchronous promises in JavaScript.\n

\n\n

MV*

\n\n
\n \n
\n\n

\n Very popular JavaScript client-side framework, built by @jashkenas.\n

\n\n
\n \n
\n\n

\n Built by @wycats, jQuery and Ruby on Rails core developer.\n

\n\n
\n \n
\n\n

\n Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM).\n

\n\n
\n \n
\n\n

\n Built by Google, Angular.js is like a polyfill for the future of HTML\n

\n\n
\n \n
\n\n

\n Cappuccino is an open-source framework that makes it easy to build desktop-caliber applications that run in a web browser.\n

\n\n
\n \n
\n\n

\n JavaScriptMVC is an open-source framework containing the best ideas in jQuery development.\n

\n\n
\n \n
\n\n

\n Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.\n

\n\n
\n \n
\n\n

\n Spice is a super minimal (< 3k) and flexible MVC framework for javascript. Spice was built to be easily added to any existent application and play well with other technologies such as jQuery, pjax, turbolinks, node or whatever else you are using.\n

\n\n
\n \n
\n\n

\n Riot is an incredibly fast, powerful yet tiny client side (MV*) library for building large scale web applications. Despite the small size all the building blocks are there: a template engine, router, event library and a strict MVP pattern to keep things organized.\n

\n\n
\n \n
\n\n

\n CanJS is a JavaScript framework that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding.\n

\n\n

Library

\n\n
\n \n
\n\n

\n Built by Facebook. React is a JavaScript library for creating user interfaces by Facebook and Instagram. Many people choose to think of React as the V in MVC.\n

\n\n
\n \n
\n\n

\n Handlebars provides the power necessary to let you build semantic templates effectively with no frustration.\n

\n\n
\n \n
\n\n

\n Asynchronous templates for the browser and node.js.\n

\n
\n
\n\n\n
\n
\n

Game Engines

\n\n
\n\n
\n \n
\n\n

\n MelonJS is a free, light-weight HTML5 game engine. The engine integrates the tiled map format making level design easier.\n

\n\n
\n \n
\n\n

\n ImpactJS is one of the more tested-and-true HTML5 game engines with the initial release all the way back at the end of 2010. It is very well maintained and updated, and has a good-sized community backing it. There exists plenty of documentation - even two books on the subject of creating games with the engine.\n

\n\n
\n \n
\n\n

\n LimeJS is a HTML5 game framework for building fast, native-experience games for all modern touchscreens and desktop browsers.\n

\n\n
\n \n
\n\n

\n Crafty is a game engine that dates back to late 2010. Crafty makes it really easy to get started making JavaScript games.\n

\n\n
\n \n
\n\n

\n Cocos2d-html5 is an open-source web 2D game framework, released under MIT License. It is a HTML5 version of Cocos2d-x project. The focus for Cocos2d-html5 development is around making Cocos2d cross platforms between browsers and native application.\n

\n\n
\n \n
\n\n

\n Phaser is based heavily on Flixel. It is maintained by Richard Davey (Photon Storm) who has been very active in the HTML5 community for years.\n

\n\n
\n \n
\n\n

\n Goo is a 3D JavaScript gaming engine entirely built on WebGL/HTML5\n

\n\n
\n \n
\n\n

\n LycheeJS is a JavaScript Game library that offers a complete solution for prototyping and deployment of HTML5 Canvas, WebGL or native OpenGL(ES) based games inside the Web Browser or native environments.\n

\n\n
\n \n
\n\n

\n Turbulenz is backed by $5M in venture funding. The engine is very polished, and primarily focused on high-quality HTML5 games. There appears to be less support for mobile devices, but they will soon catch up when all mobile devices support webGL.\n

\n\n
\n \n
\n\n

\n Quintus is an HTML5 game engine designed to be modular and lightweight, with a concise JavaScript-friendly syntax.\n

\n\n
\n \n
\n\n

\n Kiwi.js is a fun and friendly Open Source HTML5 Game Engine. Some people call it the WordPress of HTML5 game engines\n

\n\n
\n \n
\n\n

\n Panda.js is a HTML5 game engine for mobile and desktop with Canvas and WebGL rendering.\n

\n
\n
\n\n
\n
\n

News

\n\n

Websites

\n
\n

\n JavaScript.com\n

\n\n

\n DailyJS\n

\n\n

\n Echo JS\n

\n\n

\n The Treehouse Show\n

\n\n

\n /r/javascript on Reddit\n

\n\n

\n Open Web Platform Daily Digest\n

\n\n

\n Badass JavaScript\n

\n\n

\n AngularJS Daily\n

\n
\n\n

Newsletter

\n
\n

\n JavaScript Weekly\n

\n\n

\n A Drip of JavaScript\n

\n\n

\n Ember Weekly\n

\n\n

\n Node Weekly\n

\n\n

\n Meteor Weekly\n

\n\n

\n Grunt Weekly\n

\n\n

\n Gamedev.js Weekly\n

\n\n

\n HTML5 Weekly\n

\n\n

\n UDGWebDev Weekly\n

\n\n

\n The React Newsletter\n

\n\n

\n ng-newsletter\n

\n
\n
\n
\n\n
\n
\n

Reading

\n\n

Articles

\n\n
\n \n
\n\n

\n by Quildreen Motta\n

\n\n
\n \n
\n\n

\n by Yehuda Katz\n

\n\n
\n \n
\n\n

\n by Scott Allen\n

\n\n
\n \n
\n\n

\n by Yehuda Katz\n

\n\n
\n \n
\n\n

\n by Ben Alman\n

\n\n
\n \n
\n\n

\n by Nico Bevacqua\n

\n\n
\n \n
\n\n

\n by Viljami S.\n

\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n
\n \n
\n\n

\n by Kirupa Chinnathambi\n

\n\n
\n \n
\n\n

\n by JavaScript Is Sexy\n

\n\n
\n \n
\n\n

\n by Ju Gonçalves\n

\n\n

Books

\n\n
\n \n
\n\n

\n by Marijn Haverbeke\n

\n\n
\n \n
\n\n

\n by David Flanagan\n

\n\n
\n \n
\n\n

\n by Douglas Crockford\n

\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n
\n \n
\n\n

\n by James Coglan\n

\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n
\n \n
\n\n

\n by Nicholas C. Zakas\n

\n\n
\n \n
\n\n

\n by Henrik Joreteg\n

\n\n
\n \n
\n\n

\n by Stoyan Stefanov\n

\n\n
\n \n
\n\n

\n by Dustin Diaz\n

\n\n
\n \n
\n\n

\n by John Resig\n

\n\n
\n \n
\n\n

\n by Nicolas Bevacqua\n

\n\n
\n \n
\n\n

\n by Axel Rauschmayer\n

\n\n
\n \n
\n\n

\n by Christian Johansen\n

\n\n
\n \n
\n\n

\n by Kyle Simpson\n

\n\n
\n \n
\n\n

\n by Ryan Burgess\n

\n\n
\n \n
\n\n

\n by Ivo Wetzel\n

\n\n
\n \n
\n\n

\n by David Herman\n

\n\n
\n \n
\n\n

\n by Michael Fogus\n

\n\n
\n \n
\n\n

\n by Reginald Braithwaite\n

\n\n

Free E-Books

\n\n
\n

\n JSBooks\n

\n\n

\n DevFreeBooks\n

\n
\n\n

Portals

\n\n
\n

\n JavaScript.com\n

\n\n

\n HTML5 Rocks\n

\n\n

\n W3Fools\n

\n\n

\n Mozilla Developer Network\n

\n\n

\n Web Platform\n

\n\n

\n Smashing Magazine\n

\n\n

\n Node School\n

\n\n

\n How to Node\n

\n\n

\n Felix’s Node.js Beginners Guide\n

\n
\n
\n
\n\n
\n
\n

PODCASTS

\n\n

\n
\n

\n Ember Hot Seat\n

\n\n

\n JavaScript Jabber\n

\n\n

\n Node Up\n

\n\n

\n 5 Minutes of JavaScript\n

\n\n

\n The Meteor Podcast\n

\n
\n
\n
\n\n
\n
\n

SCREENCASTS

\n\n
\n \n \"egghead\"\n \n
\n\n
\n \n \"DevFreeCasts\"\n \n
\n\n
\n \n \"tagtree.tv\"\n \n
\n\n
\n \n \"frontndmasters.com\"\n \n
\n
\n
\n\n
\n
\n

Who To Follow

\n\n
\n
\n
\n\n
\n
\n

PaaS Providers

\n\n

\n
\n

\n Heroku\n

\n\n

\n Modulus\n

\n\n

\n Nodejitsu\n

\n\n

\n OpenShift\n

\n\n

\n dotCloud\n

\n\n

\n Getup\n

\n\n

\n Windows Azure\n

\n
\n
\n
\n\n
\n
\n

HELPERS

\n\n
\n \n
\n \"npm\"\n
\n \n\n \n
\n \"bower\"\n
\n \n\n \n
\n \"yeoman\"\n
\n \n\n \n
\n \"grunt\"\n
\n \n\n \n
\n \"gulp\"\n
\n \n\n \n
\n \"brunch\"\n
\n \n\n \n
\n \"Browser\n
\n \n\n \n
\n \"todo\n
\n \n
\n
\n
\n\n
\n
\n
\n

Created and maintained by

\n \n \"William\n William Oliveira\n \n\n

\n Creator of http://jstherightway.org and TDD Jedi.
\n JavaScript Lover, VIM addicted and Python programmer.\n

\n
\n\n
\n\n
\n

CONTRIBUTORS

\n

This project wouldn't exist without these amazing contributors. Thank you guys for making this real!

\n
\n
\n\n

\n \n \"Creative\n \n
\n JavaScript: The Right Way by William Oliveira.
Licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Based on work at http://jstherightway.org.\n

\n
\n
\n\n \n \n
\n \n \n\n" } ]