====== [hemmerling] Web Technologies ( HTML5, HTML, XML & Javascript ) 4/5 - Javascript Development Tools ======
Related pages:
  *[[api.html|Application programming interface ( API )]].
  *[[databases.html|Databases, Webserver, Webservices, SQL, XML]] -> XML.
  *[[sframeworks.html|Software Frameworks]].
  *[[uscripting.html|Scripting Programming Languages for Unix / Linux and Windows]].
  *[[snetworks03.html|Social Networks 3/3 - IT / SystemEngineering Forums and IT / SystemEngineering Communities]].
  *[[rest.html|Representational State Transfer ( REST )]].
  *[[wasm.html|WebAssembly ( WASM )]].
  *[[webtech.html|Web Technologies ( HTML5, HTML, XML & Javascript ) 1/5]].
  *[[webtech02.html|Web Technologies ( HTML5, HTML, XML & Javascript ) 2/5 - HTML & CSS]].
  *[[webtech03.html|Web Technologies ( HTML5, HTML, XML & Javascript ) 3/5 - Javascript]].
  *[[webtech05.html|Web Technologies ( HTML5, HTML, XML & Javascript ) 5/5 - Javascript Frameworks]].
===== Browser Tools for Javascript =====
==== Browser Plugin ====
  *See [[remoteaccess.html|Remote Access Tools for Computers & Network Clients]].
==== Tools ====
  *[[http://addons.mozilla.org/de/firefox/addon/greasemonkey/|Mozilla Firefox Addon "Greasemonkey"]].
    *[[http://en.wikipedia.org/wiki/Greasemonkey|EN.Wikipedia "Greasemonkey"]], [[http://de.wikipedia.org/wiki/Greasemonkey|DE.Wikipedia "Greasemonkey"]].
  *[[http://code.google.com/p/blockly/|Google Code "blockly - A visual programming editor"]].
  *[[http://www.gruntjs.com/|Grunt]] - "A task-based command line build tool for JavaScript projects".
  *[[http://www.requirejs.org/|RequireJS]] - "A JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code".
===== IDEs & Editors for Javascript Development =====
==== Free IDEs for Development of Desktop Apps & Smartphone Apps with Javascript ====
=== Appcelerator ===
  *Appcelerator, Inc. : The free IDE "Appcelerator Studio", the OpenSource IDE "Aptana Studio" -> See [[webtech05.html|Web Technologies ( HTML5, HTML, XML & Javascript ) 5/5 - Javascript Frameworks]].
=== Microsoft ===
  *The free IDE Visual Studio 2013 Community Edition -> See [[sdevtools.html|Software Development Tools]].
==== Free and/or OpenSource IDEs & Editors for Javascript ====
=== Code Lobster ===
  *[[http://www.codelobster.com/|Code Lobster PHP Edition]] - "Free Portable PHP IDE (HTML, PHP, CSS, JavaScript code editor)", "Free portable IDE for PHP/HTML/CSS/JavaScript development", "PHP/HTML/CSS/JavaScript highlighting; advanced PHP/HTML/CSS/JavaScript autocomplete; a powerful PHP debugger; context and dynamic Help; a code validator; a SQL manager".
=== "Eclipse" with "Dynamic Languages Toolkit" ( DLTK ) ===
  *The OpenSource IDE "Eclipse" with "Dynamic Languages Toolkit" ( DLTK ) -> See [[sdevtools.html|Software Development Tools]].
    *[[http://www.eclipse.org/downloads/packages/eclipse-php-developers/lunasr2|Eclipse for PHP Developers]] is shipped with DLTK :-).
=== Microsoft ===
  *The free editor Visual Studio 2013 Community Edition -> See [[sdevtools.html|Software Development Tools]].
=== NetBeans ===
  *The OpenSource editor NetBeans - See [[java.html|Java & Java Platform Languages]].
==== Free and/or OpenSource IDEs & Editors for Javascript with Node.js ====
=== Atom ( Discontinued ) ===
== The Tool ==
  *The OpenSource editor [[http://www.atom.io/|Atom]], [[http://www.github.com/atom/|GitHub "atom"]] for Windows, Linux - "A desktop application built with HTML, JavaScript, CSS, and Node.js".
  *[[http://www.github.com/atom/atom/releases/|GitHub "atom/atom - Releases"]] - Downloads of binaries ( for Win-32bit,..).
  *[[http://discuss.atom.io/t/atom-for-windows-32-bit/40491|Atom Discuss "ATOM for Windows 32-BIT"]] - "It is. You need to click “Other Platforms” from the website and then download AtomSetup.exe".
  *[[http://www.twitter.com/atomeditor|Twitter "Atom Editor, @AtomEditor"]].
== End of Life ==
  *"Sunsetting Atom. We are archiving Atom and all projects under the Atom organization for an official sunset on December 15, 2022".
  *"January 30, 2023 Update: Update to the previous version of Atom before February 2".
  *"Action needed for GitHub Desktop and Atom users. Update to the latest version of Desktop and previous version of Atom before February 2".
== Packages ==
  *[[http://atom.io/packages/build-python|Atom Packages "build-python"]] - "Atom Build provider for python/python3/py, runs Python".
  *[[http://atom.io/packages/linter-python|Atom Packages "linter-python"]] - "Linter for python files. Lint operation based on pylama application".
  *[[http://atom.io/packages/microbit-micropython|Atom Packages "microbit-micropython"]] - "Microbit Micropython support for Atom", "Please note, that this package only supports Linux".
  *[[https://atom.io/packages/microbit-python|Atom Packages "microbit-python"]] - "A package to compile python code for the MicroBit".
== Resources ==
  *The editor offers the "Code Completion" feature with choice suggestions :-).
  *Windows desktop icon:
    *Target "C:\Users\Administrator\AppData\Local\atom\Update.exe --processStart atom.exe".
    *Start in "C:\Users\Administrator\AppData\Local\atom\app-1.0.7".
  *[[http://www.codeforgeek.com/2014/09/5-must-have-packages-atom-editor/|Code for geek "5 Must Have Packages for Atom Editor"]].
  *[[http://www.gentlenode.com/journal/atom-2-our-favorite-packages-and-themes/11|Gentlenode, A Meteor & Growth Hacking Studio "Atom #2: Our Favorite Packages and Themes"]].
  *[[http://www.gnuu.org/2014/03/10/my-week-with-githubs-atom-editor/|Gnuu. my word against yours... fight "My Week With GitHub’s Atom Editor"]].
  *[[http://reza.jelveh.me/2014/02/28/a-critical-look-at-atom.html| Reza Jelveh "A critical look at Atom.io"]].
=== Brackets ===
== The Tool ==
  *The OpenSource editor [[http://www.brackets.io/|Adobe Brackets]], [[http://www.github.com/adobe/brackets/|GitHub "adobe/brackets"]] for Windows and Linux.
    *Wiki [[http://www.github.com/adobe/brackets/wiki/Troubleshooting|GitHub Wiki "adobe/brackets"]].
      *[[http://www.github.com/adobe/brackets/wiki/Troubleshooting|GitHub Wiki "adobe/brackets" - "Troubleshooting"]].
    *Blog [[http://blog.brackets.io/|Brackets Blog]].
      *[[http://blog.brackets.io/2013/08/28/theseus-javascript-debugger-for-chrome-and-nodejs/?lang=en|Brackets Blog "Theseus JavaScript Debugger for Chrome and NodeJS"]], 2013-08-28.
      *[[http://blog.brackets.io/2013/05/31/better-javascript-debugging-with-theseus/|Brackets Blog "Better JavaScript Debugging with Theseus"]], 2015-05-31.
    *Videos [[http://www.youtube.com/channel/UCCvv6VM72jjNrFx80YYg3og|YouTube Channel "Brackets"]].
== Plugins ==
  *JSLint.
    *"Bracket" is shipped with "JSLint" -> See [[goodcoding.html|Good Coding ! - Software Coding, Coding Rules, Static Code Analysis, Code Reviews]].
  *Theseus.
    *[[http://www.github.com/adobe-research/theseus|GitHub "adobe-research/theseus"]]
    *"A new type of JavaScript debugger for Node.js, Chrome, and both simultaneously. It is an extension for the Brackets code editor".
    *"For Node.js support, also run npm install -g node-theseus in a terminal to get the command-line helper. Theseus requires node-theseus". Be shure to do a global installation, by adding the "-g" parameter.
    *[[http://github.com/adobe-research/node-theseus|GitHub "adobe-research/node-theseus"]], [[http://www.npmjs.com/package/node-theseus|npm "node-theseus"]] - "wrapper of the node command for debugging scripts with Theseus".
    *Videos.
      *Video [[http://www.youtube.com/watch?v=T6d5C3rLeFY|YouTube "Theseus JavaScript Debugger for Brackets"]].
      *Video [[http://www.youtube.com/watch?v=5QkTRT2skKI|YouTube "Theseus JavaScript Debugger (Extended Demo)"]].
      *Video [[http://www.youtube.com/watch?v=-J5LG2bFPMg|YouTube "Brackets: Better JavaScript Debugging with Theseus"]].
  *[[http://www.github.com/TheBenji/brackets-node-debugger|GitHub "TheBenji/brackets-node-debugger"]].
    *[[http://www.github.com/adobe-research/theseus/wiki/Theseus-Development|GitHub Wiki "adobe-research/theseus" - "Theseus Development"]].
      *[[http://www.github.com/johnhidey/hdy.brackets-shell/|GitHub "johnhidey/hdy.brackets-shell"]].
  *[[http://www.github.com/DennisKehrig/brackets-v8-node-live|GitHub "DennisKehrig/brackets-v8-node-live"]] - "Node.js/V8 Live Development with the Brackets editor".
== Brackets with Theseus - Howto ==
  *Brackets with Theseus plugin is useful to debug processes of Node.js application, e.g of a Http server, e.g.<code>
/*jslint node: true */
"use strict";
var http = require("http");
function process_request(req, res) {
    var body = 'Thanks for calling!\n';
    var content_length = body.length;
    res.writeHead(200, {
            'Content-Length': content_length,
                'Content-Type': 'text/plain'
                });
    res.end(body);
}
var s = http.createServer(process_request);
s.listen(8080);
</code>  
  *How to start debugging:
    -Run Brackets and load the Node.js application file, e.g. "apps.js".
    -In a shell ( e.g. COMMAND.COM or Bash ), call "node-theseus app.js*, as if you would normally call "node app.js", to execute the application.
  *Now you should be able to see the debug infos in Brackets, e.g. how many times a Http server and its functions are called.
== Brackets with Theseus - NoGo ==
  *Brackets can't be used to do classical single step debugging of straight Javascript scripts, e.g.<code>
/*jslint node: true */
"use strict";
console.log("Hello World");
console.log("Hi there");
</code>
== Resources ==
  *The editor offers the "Code Completion" feature with choice suggestions :-).
  *[[http://blogs.adobe.com/open/behind-the-scenes-with-theseus-an-open-source-javascript-debugger-for-brackets/|Adobe "Open at Adobe: Behind the scenes with Theseus, an open source JavaScript debugger for Brackets"]].
  *[[http://www.bracketsplus.com/|Brackets [+]. The place to find extensions and themes for Brackets !]].
  *[[http://www.coderwall.com/p/-h1h1w/how-to-use-jslint-in-node-js-projects-properly|coderwall "How to use jslint in node.js projects properly"]] - "But when writing node.js code, you probably get a lot of false positive problems counted, if you JSLint your code. Most probably they are all about '//require// is not defined' or '//module// is not defined'". Solution? Put this at the top of your code!<code>
/*jslint node: true */
"use strict";
</code>
  *[[http://mwebhack.blogspot.de/2013/06/nodejs-debugging-with-theseus-and.html|Hack into the LIFE ;-) "Node.js debugging with Theseus and Brackets"]].
  *[[http://www.quora.com/Which-one-is-the-best-and-completely-free-IDE-for-Node-js-development|Quora "Which one is the best and completely free IDE for Node.js development?"]] - "Brackets editor with the Theseus plugin. Capable of providing auto-complete suggestions due to integration with Tern.js (in-built) and Theseus helps debug backend code through IDE. It is the only free 'IDE' for Node.js development with traditional IDE features - live debugging (w/ breakpoints) and code completion".
  *[[http://stackoverflow.com/questions/12490220/adobe-brackets-debugging-node-js-node-inspector|StackOverflow "Adobe Brackets - debugging Node.js & Node-inspector"]].
  *[[http://en.wikipedia.org/wiki/Brackets_%28text_editor%29|EN.Wikipedia "Brackets (text editor)"]], [[http://de.wikipedia.org/wiki/Adobe_Brackets|DE.Wikipedia "Adobe_Brackets"]].
  *Videos:
    *[[http://www.youtube.com/results?search_query=brackets+javascript|YouTube - Search for "brackets javascript"]].
    *[[http://www.youtube.com/results?search_query=brackets+js|YouTube - Search for "brackets js"]].
    *[[http://www.youtube.com/results?search_query=brackets+adobe|YouTube - Search for "brackets adobe"]].
    *[[http://www.youtube.com/watch?v=jGoErIDq_4Y|YoutTube "Developer's Toolbox: Brackets"]].
=== CodeLite ===
== The Tool ==
  *The OpenSource editor [[http://www.codelite.org/|CodeLite IDE]], [[http://www.github.com/eranif/codelite|GitHub "eranif/codelite"]], [[http://codelite.sourceforge.net/|SourceForge "CodeLite IDE"]], [[http://sourceforge.net/projects/codelite/|SourceForge "CodeLite: an open source, cross platform C/C++/PHP and JavaScript IDE "]] - "A Free, open source, cross platform C,C++,PHP and Node.js IDE".
  *Wiki [[http://codelite.org/LiteEditor/Documentation|CodeLite Wiki "Documentation"]].
    *[[http://www.codelite.org/LiteEditor/Nodejs|CodeLite Wiki "Documentation", Topic "Nodejs"]].
== Resources ==
  *The editor offers the "Code Completion" feature with multiple choice suggestions :-).
  *CodeLite installs a Node.js at "C:\Users\<user>\AppData\Roaming\codelite\webtools\js\node.exe" ( e.g. "C:\Users\Administrator\AppData\Roaming\codelite\webtools\js\node.exe" for user "Administrator ), which is executed by default by "Build / Run".
  *The Node.js debugger integrated in the IDE is suitable to do classical single step debugging of straight Javascript scripts, e.g.<code>
/*jslint node: true */
"use strict";
console.log("Hello World");
console.log("Hi there");
</code>
  *[[http://forums.codelite.org/viewtopic.php?f=11&t=3059&p=13834#p13834|Codelite IDE Forums, Thread "CodeLite: Keyboard Input doesn´t work in the 'Output View'"]].
=== Microsoft ===
  *The free IDE [[http://www.microsoft.com/web/webmatrix/|Microsoft/web "WebMatrix"]] - "A free, lightweight, cloud-connected web development tool"
    *[[http://en.wikipedia.org/wiki/Microsoft_WebMatrix|EN.Wikipedia "Microsoft WebMatrix"]], [[http://de.wikipedia.org/wiki/Microsoft_WebMatrix|DE.Wikipedia "Microsoft WebMatrix"]] - "with full support for ASP.NET, PHP, Node.js and HTML 5".
  *The free "Visual Studio Code" -> See [[sdevtools.html|Software Development Tools]].
  *The OpenSource [[http://nodejstools.codeplex.com/|CodePlex "Node.js Tools for Visual Studio"]], [[http://www.github.com/Microsoft/nodejstools|GitHub "Microsoft/nodejstools"]].
=== NetBeans with Node.js Plugin ===
  *The OpenSource editor NetBeans -> See [[java.html|Java & Java Platform Languages]].
    *[[http://plugins.netbeans.org/plugin/36653/nodejs|NetBeans  / Plugin Portal "NodeJS"]].
    *[[http://timboudreau.com/modules|Tim Boudreau's NetBeans Update Center]] - "Node.js Projects. Support for creating NodeJS projects, running Javascript sources with NodeJS and natively opening any project with a package.json as a NodeJS project; support for adding and managing NodeJS libraries using npm".
    *[[http://www.timboudreau.com/blog/NetBeans_Tools_for_Node_js/read|Tim Boudreau "NetBeans Tools for Node.js"]], [[http://www.github.com/timboudreau/nb-nodejs|GitHub "timboudreau/nb-nodejs"]].
  *[[http://www.codediesel.com/javascript/installing-nodejs-on-netbeans/|Codediesel "Installing NodeJS on NetBeans"]].
  *[[http://techblog.chegg.com/2013/10/14/ide-for-node-js/|Chegg Engineering. Projects and Experiences from the Chegg Engineering Team "IDE for node.js"]] - "Netbeans with node.js plugins - No code-completion 'features'" :-(.
=== Nodeclipse & Enide ===
== The Tools ==
  *[[http://www.nodeclipse.org/|Nodeclipse & Enide]] - "Tools for JavaScript and Java: Node.js, Android, Gradle and more".
    *The OpenSource IDE [[http://www.nodeclipse.org/enide/2015/|Nodeclipse & Enide "Enide 2015"]], [[http://nodeclipse.sourceforge.net/|SoureForge "Nodeclipse "Enide 2015. Node.js & Java development in Eclipse-based IDE"]], [[http://www.sourceforge.net/projects/nodeclipse/|SoureForge "Nodeclipse "Enide 2015. Node.js & Java development in Eclipse-based IDE"]] for Windows, Linux.
    *[[http://www.nodeclipse.org/community/|Nodeclipse & Enide "Community"]].
    *[[http://www.github.com/Nodeclipse/eclipse-node-ide|GitHub "Nodeclipse/eclipse-node-ide"]].
    *[[http://www.npmjs.com/package/nodeclipse|NPM "nodeclipse"]] - "nodeclipse CLI - prepare Node.js project to be imported into Eclipse (Nodeclipse); Installer - eclipse plugin CLI installer. Node.js Development with Eclipse or Enide Studio".
== Resources ==
  *The editor offers just "Word Completion" without choice suggestions, i.e. without any preview :-(.
  *The Node.js debugger integrated in the IDE is suitable to do classical single step debugging of straight Javascript scripts, e.g.<code>
/*jslint node: true */
"use strict";
console.log("Hello World");
console.log("Hi there");
</code>
  *[[http://www.github.com/joyent/node/wiki/using-eclipse-as-node-applications-debugger|GitHub Wiki "joyent/node" - "Using Eclipse as Node Applications Debugger"]].
  *[[http://techprd.com/how-to-setup-node-js-project-in-eclipse/|TECHPRD "How to setup Node.js project in Eclipse"]].
  *[[http://en.wikipedia.org/wiki/Nodeclipse|EN.Wikipedia "Nodeclipse"]].
=== Zed Editor ===
  *[[http://www.zed.dev/|Zed Industries]].
    *[[http://www.zed.dev/docs/|Zed Industries "Documentation"]].
      *[[http://www.zed.dev/docs/development/windows|Zed Industries "Documentation - Building Zed for Windows"]].
  *[[http://www.github.com/zed-industries/|GitHub "Zed Industries. The fast and social code editor"]].
  *[[http://www.heise.de/hintergrund/Sourcecode-Editor-Zed-Erfahrungen-aus-einem-Jahr-mit-einem-Underdog-9623943.html|heise.de "Sourcecode-Editor Zed: Erfahrungen aus einem Jahr mit einem Underdog"]], 2024-02.
  *I was told by experts in 2024-07, that Zed editor is the successor of the ATOM editor :-).
==== Commercial IDEs & Editors ====
=== Sublime Text ===
  *The ShareWare editor "Sublime Text 2" for Windows, Linux. See -> [[python.html|Python 1/7]].
=== Webstorm ===
  *The commercial IDE [[http://www.jetbrains.com/webstorm/|JetBrains "WebStorm - The smartest JavaScript IDE"]] for Windows.
  *The editor offers the "Code Completion" feature with choice suggestions :-).

==== Free Online IDEs & Application Platforms for Javascript with Node.js ====
=== Cloud 9 IDE ===
  *Cloud 9 is a  free Online IDE for Node.js development and offers free and paid Node.js application hosting. See [[webtech05.html|Web Technologies ( HTML5, HTML, XML & Javascript ) 5/5 - Javascript Frameworks]].
=== Koding ===
== The Service ==
  *The free Online IDE and online service [[http://www.koding.com/|Koding]] - "Develop in Go, Python, Node, Ruby, PHP, ect. or play with Docker, WordPress, Django, Laravel or create Android, IOS/iPhone, HTML5 apps. All for FREE!".
    *[[http://learn.koding.com/|Koding University]].
      *[[http://learn.koding.com/guides/ide-introduction/|Koding University "Koding IDE Introduction"]].
      *[[http://learn.koding.com/guides/terminal-introduction/|Koding University "Koding Terminal Introduction"]].
      *[[http://learn.koding.com/guides/hello-world/|Koding University "Hello World on Koding"]] for Python,... :-), but not for Javascript / Node.js :-(.
      *[[http://learn.koding.com/guides/getting-started-kpm/Koding University "Getting started with the Koding Package Manager"]].
        *[[http://learn.koding.com/guides/getting-started-nodejs/|Koding University "Getting Started with NodeJS"]].
  *[[http://www.twitter.com/koding|Twitter "Koding, @koding"]].
  *User communications questions & answers system:
    *[[http://www.koding.com/Activity/Public|Koding "Activity", Topic "#public"]].
      *[[http://www.koding.com/Activity/Topic/node|Koding "Activity", Topic "#node"]].
== Tips & Tricks ==
  *It's hard to find: **The account settings are available by klicking on the "__^__" character at bottom of the left menu frame/pane**, next to the user name and avantar picture!
  *As of 2015-08, there are 2 Node.js instances:
    *"$ node -v"  -> "v0.10.26".
    *"$ nodejs -v" -> "v0.10.37".
  *"To run a command as the `root` user, prefix any command with `sudo <command>`. But remember, with great power, comes great responsibility! :-)".
  *"By default, you sudo password is blank. Most people like it that way but if you prefer, you can use the `sudo passwd` command and change the default (blank) password to something more secure".
== Resources ==
  *[[http://www.quora.com/Why-did-Koding-switch-from-Node-js-to-Go|Quora "Why did Koding switch from Node.js to Go?"]].
    *Top reasons against server-side Javascript :-(, by Devrim Yasar, CEO / Co-Founder @ Koding.com:
      -'If your codebase grows large, javascript is not the friendliest language for your unit tests'.
      -'When node leaks memory you don't know why unless you can do this: [[http://blog.nodejs.org/2012/04/25/profiling-node-js/|NodeJS Blog "Profiling Node.js"]]'.
      -'Even after intensive profiling, you don't really know what exactly is wrong. You could only gather ideas. your debugging still largely remains as guess work'.
  *[[http://en.wikipedia.org/wiki/Koding|EN.Wikipedia "Koding"]].
==== Free Online Compiler for Javascript ====
  *[[http://www.babeljs.io/|Babel.JS]] - "Babel is a JavaScript compiler. Use next generation JavaScript, today".
    *[[http://www.babeljs.io/docs/learn-es2015/|Babel.JS "Learn ES2015. A detailed overview of ECMAScript 2015 features"]].
===== Javascript Sandboxes =====
  *[[http://alternativeto.net/software/js-bin/|alternativeTo "JS BIN"]] - "JS Bin Alternatives and Similar Software".
  *[[http://www.codepen.io/|CodePen - Pens picked by the Editors of CodePen]].
  *[[http://www.cssdesk.com/|CSSDesk - Online CSS Sandbox]].
  *[[http://www.csslint.net/|CSS LINT - Will hurt your feelings* (And help you code better)]].
  *[[http://www.dabblet.com/|dabblet - The first commented line is your dabblet’s title]].
  *[[http://www.hashify.me/|hashify.me]].
  *[[http://www.html5rocks.com/|HTML5 Rocks - A resource for open web HTML5 developers]].
  *[[http://www.ideone.com/|Ideone.com - Your great ideas will be born here]].
  *[[http://www.jsfiddle.net/|jsFiddle - Create a new Fiddle]].
  *[[http://www.jsbin.com/|JS Bin - Collaborative JavaScript Debugging]].
  *[[http://www.jsdo.it/|jsdo.it - Share JavaScript, HTML5 and CSS]].
  *[[http://www.liveweave.com/|Liveweave - HTML, CSS3, Javascript]].
  *[[http://www.rnplay.org/|React Native Playground]] - "Share and test your React Native code in the browser".
  *[[http://www.tinker.io/|Tinker - Social Code Collaboration]].
  *[[http://www.tinkerbin.com/|Tinkerbin]] - "Lets you play around with HTML, JavaScript and CSS without creating files or uploading to servers".
  *[[http://www.webpackbin.com/|WebpackBin]] - With support for loading NPM packages.
    *[[http://www.youtube.com/watch?v=yf3Jhjw5Btc|YouTube "webpackbin - beta2"]].
===== Resources =====
  *A Javascript IDE is a tool, which supports editing of Javascript code ( by syntax highlighting, code completion,.. ) and which may execute Javascript by a built-in or external Javascript engine ( without leaving the tool, optional built-in Javascript debugger, console window ). IDEs for some targets like "Windows Desktop" and smartphones ( "Android", "iOS", "Windows Phone" ) support the generation of complete applications ready for installation or upload to the appstores.
  *A Javascript editor is a tool, which supports editing of Javascript code by syntax highlighting, code completion,.. ) only. You must have a shell ( e.g. COMMAND.COM, Bash ) or your browser open to execute the javascript code.
  *Be aware! Some IDEs and editors with "Javascript support" don´t support code completion :-(".
  *For Node.js, you must supply the "node_modules" dirctory with all locally installed packages in the working directory of your project - the same as if you execute Node.js from shell.
  *[[http://techblog.chegg.com/2013/10/14/ide-for-node-js/|Chegg Engineering. Projects and Experiences from the Chegg Engineering Team "IDE for node.js"]] - Feature matrix.
  *[[http://www.codecondo.com/best-ide-for-node-js/|Codecondo "Top 10 IDEs for Developing Node.js Apps"]].
  *[[http://www.javaworld.com/article/2094847/enterprise-java/review-10-javascript-editors-and-ides-put-to-the-test.html|Java World "Review: 10 JavaScript editors and IDEs put to the test"]] - "Visual Studio Code",...
  *[[http://www.paulb.gd/comparing-nodejs-ides/|Paul's Blog "Comparing NodeJS IDEs (now with ST3 and WebStorm!)"]].
  *[[http://www.quora.com/Which-one-is-the-best-and-completely-free-IDE-for-Node-js-development|Quora "Which one is the best and completely free IDE for Node.js development?"]].
  *[[http://www.strongloop.com/strongblog/node-js-compare-sublime-vs-atom-cloud-9/|StrongLoop "Node.js Editor Comparison: Sublime vs Atom vs Cloud 9"]].
  *[[http://en.wikipedia.org/wiki/Comparison_of_integrated_development_environments#JavaScript|EN.Wikipedia "Comparison of integrated development environments"]], <del>[[http://de.wikipedia.org/wiki/Liste_von_Integrierten_Entwicklungsumgebungen|DE.Wikipedia "Liste von Integrierten Entwicklungsumgebungen"]]</del>.
===== Appropriate OpenDirectory Directory Pages =====
  *[[http://www.dmoz.org/Computers/Programming/Languages/JavaScript/|OpenDirectory "Top: Computers: Programming: Languages: JavaScript]].
  *[[http://www.dmoz.org/Computers/Programming/Languages/HTML/|OpenDirectory "Top: Computers: Programming: Languages: HTML]].
  *[[http://www.dmoz.org/World/Deutsch/Computer/Programmieren/Sprachen/JavaScript/|OpenDirectory "Top: World: Deutsch: Computer: Programmieren: Sprachen: JavaScript"]].
  *[[http://www.dmoz.org/World/Deutsch/Computer/Programmieren/Sprachen/HTML/|OpenDirectory "Top: World: Deutsch: Computer: Programmieren: Sprachen: HTML"]].
{{tag>"web technologies" HTML5 HTML XML Javascript "web frameworks" "software frameworks for web applications" "web applications" web applications application}}
<footnote_navi_en>