Free Tools For JavaScript Developers

Free Tools For JavaScript Developers
by Janeth Kent Date: 16-04-2013


We have compiled a list of really useful Free Tools For JavaScript that will help you.

Testing

  • JSLint – The JavaScript Verifier
    JSLint takes a JavaScript source and scans it. If it finds a problem, it returns a message describing the problem and an approximate location within the source. The problem is not necessarily a syntax error, although it often is. JSLint looks at some style conventions as well as structural problems. It does not prove that your program is correct. It just provides another set of eyes to help spot problems.
  • JsUnit
    JsUnit is a Unit Testing framework for client-side (in-browser) JavaScript. It is essentially a port of JUnit to JavaScript. Also included is a platform for automating the execution of tests on multiple browsers and multiple machines running different OSs.
  • SugarTest
    SugarTest makes it easy to write elegant and understandable JavaScript tests. Its API is inspired by both RSpec, Shoulda and jQuery. It works as a DSL running on top of JsUnitTest.
  • YUI Test
    YUI Test is a testing framework for browser-based JavaScript solutions. Using YUI Test, you can easily add unit testing to your JavaScript solutions.
  • Obtrusive JavaScript Checker
    Available as a Firefox extension, Greasemonkey user script, as well as a Ubiquity command; Obtrusive JavaScript Checker is a tool to traverse through all elements in a web page, and when it finds a HTML element with inline events (which is bad, JavaScript should be unobtrusive), it highlights it with a red border.
  • JSpec
    JavaScript Testing Framework.  JSpec can run in a variety of ways, such as via the terminal with Rhino support, via browsers using the DOM or Console formatters, or finally by using the Ruby JavaScript testing framework which runs browsers in the background, reporting back to the terminal.
  • Crosscheck
    Crosscheck is an open source testing framework for verifying your in-browser JavaScript. It helps you ensure that your code will run in many different browsers such as Internet Explorer and Firefox, but without needing installations of those browsers.
  • JSLitmus
    JSLitmus is a lightweight tool for creating ad-hoc JavaScript benchmark tests.
  • JavaScriptMVC’s Test Plugin
    Testing library for JavaScriptMVC that provides event simulation, unit testing, Ajax fixtures, and a console.
  • FireUnit
    JavaScript Unit Testing Extension for Firefox/Firebug.

Debugging

  • Javascript Debug Toolkit
    JavaScript Debug Toolkit is a an eclipse plugin to debug JavaScript cross browser，it can debug JavaScript in IE,Firefox,Safari,Chrome,Opera and even in mobile browser.
  • Firebug
    One of the most popular web developer tool – Firebug is a Firefox add-on that allows you to edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. It provides JavaScript logging and debugging console with useful features such as AJAX requests logging, JavaScript interpreter, DOM explorer and more. You can use Firebug Lite in IE, Opera, and Safari.
  • Venkman
    Venkman provides a powerful JavaScript debugging environment for Gecko-based browsers. The debugger is available as an add-on for Firefox & Mozilla. Venkman is both a graphic and a console debugger. Features such as breakpoint management, call stack inspection, and variable/object inspection are available from the user interface and from console commands, letting you work in the way you are most accustomed to.
  • NitobiBug
    NitobiBug is a browser-based JavaScript object logger and inspection tool – similar to Firebug. NitobiBug runs across different browsers (IE6+, Safari, Opera, Firefox) to provide a consistent and powerful tool for developing rich Ajax applications.
  • DamnIT
    DamnIT is a free service that emails you when a user encounters a JavaScript error in your web page.
  • JS Bin
    JS Bin is an online  web application specifically designed to help JavaScript developers test code snippets within some context, and debug the code collaboratively. JS Bin allows you to online edit and test JavaScript and HTML code. Once you’re done you can save, and send the URL to a peer for review or help.
  • Blackbird
    A lot of JavaScript developers simply use alert() to show various messages in order to debug their code. Blackbird offers a simple way to log messages in JavaScript and an attractive console to view and filter them.
  • JSON Formatter
    The JSON Formatter was created to help with debugging. As data expressed as JSON is often written without line breaks to save space, it became extremely difficult to actually read it. This tool hopes to solve the problem by formatting the JSON into data that is easily readable by human beings.
  • Faux Console
    Faux Console is a JavaScript that simulates a debugging console for IE. If you write JavaScript you obviously need to debug your scripts while you write them.

HTTP Monitoring

  • Fiddler
    Fiddler is a Web Debugging Proxy which logs all HTTP(S) traffic between your computer and the Internet. Fiddler allows you to inspect all HTTP(S) traffic, set breakpoints, and “fiddle” with incoming or outgoing data.
  • TamperData
    TamperData is a Firefox extension to track and modify http/https requests. You can use it for security testing of Web based applications and tracking request/responses.
  • Live HTTP Headers
    Allows you to view HTTP headers of a page while browsing. You can use Live HTTP Headers for debugging web application, find out which kind of web server the remote site is using, and see cookies sent by remote site.

Documentation

  • jGrouseDoc
    jGrouseDoc allows generation of API documentation from the comments in the source code. The tool allows you to document all the necessary constructs that you might need – not only functions and variables, but also classes, interfaces, namespaces, packages and others. And it does not matter at all which JavaScript frameworks are being used – you can document your code the way you want it, not the way it is being imposed by a framework or a tool.
  • JSDoc Toolkit
    A documentation generator for JavaScript. Written in JavaScript; it automatically generates template-formatted, multi-page HTML (or XML, JSON, or any other text-based) documentation from commented JavaScript source code.

Compression

  • Online Javascript Compression Tool
    An online JavaScript compressor that allows you to compress your JavaScript files using a few different compression algorithms like JSMin and Packer. Compressed JavaScript files are ideal for production environments since they typically reduce the size of the file by 30-90%.  Most of the filesize reduction is achieved by removing comments and extra whitespace characters that are not needed by web browsers or visitors.
  • Scriptalizer
    An Online tool that combines multiple JavaScript files into one.
  • Dojo ShrinkSafe
    A Java command line utility that allows you to reduce the size, and therefore latency, of JavaScript by browsers. Instead of brittle regular expressions, the Dojo compressor is based on Rhino, a JavaScript engine from the Mozilla project. Being based on a real parse stream, the Dojo compressor can get a better idea for the context of a token (variable name, etc.) than the regular-expression based tools.
  • YUI Compressor
    The YUI Compressor is a JavaScript compressor which, in addition to removing comments and white-spaces, obfuscates local variables using the smallest possible variable name. This obfuscation is safe, even when using constructs such as ‘eval’ or ‘with’ (although the compression is not optimal is those cases) Compared to jsmin, the average savings is around 20%.
  • Online JavaScript Compressor
    Compress and obfuscate Javascript code online completely free using this compressor.

Formatting

  • JavaScript Beautifier
    This beautifier can process your messy or compacted JavaScript, making it all neatly and consistently formatted and readable.

Editors & IDE

  • Aptana Studio
    Aptana Studio is a complete web development environment that provides JavaScript code completion and debugging, HTML/CSS/JavaScript code assist, and support for all the leading Ajax libraries. Aptana Studio even provides code assist for any JavaScript in your page – including your own!
  • Komodo Edit
    Komodo Edit is a free – open source editor that provides auto complete, call tips, multi-language file support, syntax coloring, syntax checking, Vi emulation, Emacs key bindings, and more. One of the most useful feature is ability to extend Komodo Edit. You can find numerous extensions useful for JavaScript developers (e.g., JSLint plugin for Komodo, Venkman JavaScript Debugger, etc).
  • Spket IDE
    Spket IDE is powerful toolkit for JavaScript and XML development. The powerful editor for JavaScript, XUL/XBL and Yahoo! Widget development. The JavaScript editor provides features like code completion, syntax highlighting and content outline that helps developers productively create efficient JavaScript code. Spket IDE is free for non-commercial use.

Other Tools

  • Google’s AJAX APIs Playground
    The AJAX API Playground is loaded with samples for Google JavaScript APIs (Maps, Search, Feeds, Calendar, Visualization, Language, Blogger, Libraries and Earth, etc) that you can edit and run to help you explore what Google’s APIs have to offer. There are also save and export features. The save feature allows you to hold onto an edited sample so you can continue working on it later, while export lets you modify a sample and publish the code to a permanent URL.
  • QuirksMode – Compatibility Tables
    Most popular source to check compatibility status of major web browsers for CSS2, CSS3, DOM Core, DOM HTML, DOM CSS, DOM Events and CSS Object Model View.
  • HTML to JavaScript Convertor
    The HTML to JavaScript convertor takes your markup and converts it to a series of document.write() statements that you can use in a block of JavaScript.
  • Glimmer
    Glimmer is a desktop application that allows you to easily create interactive elements on your web pages by harnessing the power of the jQuery library. It allows you to easily create interactive experiences like rotating photo-galleries/mastheads,drop-down navigation, hover effects, or custom animations.
  • jQuery Function Builder
    You can use this tool to quickly build up a collection of functions that will be called when the page has loaded/is ready.
  • Bookmarklet Maker
    Online tool that generates bookmarklet from you JavaScript function.
  • JavaScript Regex Generator
    An online tools for creating regular expression

Other Browser Extensions

  • Web Developer Extension For Firefox, Flock & Seamonkey
    The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools including ability to validate your XHTML, find JavaScript/CSS errors, visualize a web page’s structure, testing web forms, change XHTML on-the-fly, inspect HTTP headers information, etc.
  • Opera Dragonfly
    Opera Dragonfly is a cross device, cross platform debugging environment for the Opera browser—debug JavaScript, inspect and edit CSS and the DOM, and view any errors on your mobile or computer.
  • Developer Toolbar For IE6/7
    The Microsoft Internet Explorer Developer Toolbar provides a variety of tools for quickly creating, understanding, and troubleshooting Web pages

Cheat Sheets

 
by Janeth Kent Date: 16-04-2013 hits : 5457  
 
Janeth Kent

Janeth Kent

Licenciada en Bellas Artes y programadora por pasión. Cuando tengo un rato retoco fotos, edito vídeos y diseño cosas. El resto del tiempo escribo en MA-NO WEB DESIGN AND DEVELOPMENT.