Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>About the tools:</p> <ul> <li><strong>JSLint</strong> is an online tool developed by Douglas Crockford at <a href="http://www.jslint.com/" rel="noreferrer">http://www.jslint.com/</a>. It tells you why, even if the possibility is improbable, your code may break.</li> <li><strong>JSMin</strong> is a one-file javascript minifier written in C. Compile it, put it in your $PATH, and use it to create build scripts for your app. Minified javascript is considered faster to load. Get it at <a href="http://www.crockford.com/javascript/jsmin.html" rel="noreferrer">http://www.crockford.com/javascript/jsmin.html</a>.</li> <li>Having a JS Read-Eval-Print Loop is always handy. The most downloaded one is <a href="http://nodejs.org/" rel="noreferrer"><strong>node.js</strong></a>, a REPL based on V8, the Chrome javascript engine. It lets you interactively test javascript snippets. It also functions as one of the most powerful web servers, through a witty event-loop system. You are encouraged to use it this way!</li> <li>A JS prompt is good, but you do need an outstanding <strong>Web Inspector</strong>. It provides generous debugging and better understanding of your code. In that field, both Google Chrome and Firebug are considered top-notch. The difference is, Google Chrome's is built-in. Right click > inspect, and you're done.<br> But the best features in there can only be discovered <a href="https://github.com/borismus/DevTools-Lab/raw/master/cheatsheet/chromedev-cheatsheet.png" rel="noreferrer">in this colorful cheatsheet</a>.</li> <li><a href="http://jsfiddle.net/" rel="noreferrer">JSFiddle</a> is an online tool to try out snippets too.</li> <li>@mathias is quite proud to maintain <a href="http://jsperf.com/" rel="noreferrer">jsPerf</a>, a collection of items which test JS snippets and can tell, cross-browser, which algorithm is fastest.</li> <li><a href="http://developer.yahoo.com/yslow/" rel="noreferrer">YSlow</a> is another really accurate tool to tell you if your website is fast, and how you can improve it, with witty advice.</li> </ul> <p>As far as <strong>IDEs</strong> are concerned, there is no single development environment that is proved more effective. The best people in the field only use the text editor they fancy most (@phoboslab, the man behind ImpactJS, uses <a href="http://www.activestate.com/komodo-edit" rel="noreferrer">KomodoEdit</a>, for instance. Paul Irish uses TextMate, which is good, but Mac-only. A lot of people use Vim. Fabrice Bellard, the guy behind JSLinux, uses his own Emacs version, I think. This does not matter a single bit).</p> <p><strong>Unit testing</strong> is important, but that is never an issue. Javascript is powerful enough that you can build yourself a better-suited unit testing software in a couple of lines than anything out there. What does matter is that, thanks to node.js (the JS prompt that I recommend above), you can automate those tests by putting them in a *.js script file and launch all the testing with the single line: <code>$ node test.js</code>.</p> <p>What <em>really</em> counts to be effective is to have the <a href="https://developer.mozilla.org/en/javascript" rel="noreferrer">mdn <strong>javascript documentation</strong></a> under your pillow, and the <a href="http://developers.whatwg.org/" rel="noreferrer">html specification</a> always open. Mind you, the version I point you to is not widely known, but it is by far the best out there! It even uses the cache manifest so that you can re-read the pages you have already downloaded, when you're offline! Let alone an outstanding search feature!</p> <p>And now, since I really want that bounty, I'll give you one nifty page that lists <strong>all the <a href="http://platform.html5.org/" rel="noreferrer">documentation</a></strong> that you will ever need to build a <strong>web app</strong>. It really is a jewel. It contains a link to all information you need. That is the index of all bibles out there.</p> <p>In the end, the question that really targets what you are wondering is, can you do a huge app in javascript?<br> The answer is yes. Javascript does have what Crockford calls "bad parts", but using JSLint warns you against them. On the other hand, Javascript has powerful weapons:</p> <ul> <li>Closures: you can define a function inside another function, and it will have access to ouside variables, even after the outer function is done running.</li> <li>First-class functions: you can create arrays of functions, pass in functions as parameters to other functions, return a function from another function, all this for free!</li> <li>Object literals, array literals: this is the basis of JSON. It is very easy to use. All javascript engines now have a <code>JSON.parse(aString)</code> and a <code>JSON.stringify(anObject)</code> built-in object.</li> <li>Prototyping: objects can inherit from any variable you have previously defined.</li> </ul> <p>This makes working efficient and easy. There are some specific patterns that you can use in Javascript. I'll let <a href="http://paulirish.com/2010/10-things-i-learned-from-the-jquery-source/" rel="noreferrer">Paul Irish enlighten you</a>.</p> <p>One last advice, when using javascript in the browser: never use <code>&lt;script&gt;/* some javascript here */&lt;/script&gt;</code>. Always use <code>&lt;script src="javascript-file.js"&gt;&lt;/script&gt;</code>.</p> <p>And a couple more links.</p> <ul> <li><a href="http://my.opera.com/emoller/blog/2011/05/01/javascript-performance" rel="noreferrer">http://my.opera.com/emoller/blog/2011/05/01/javascript-performance</a> or how to not fear implementing ZIP in the browser.</li> <li><a href="http://paperjs.org/features/" rel="noreferrer">http://paperjs.org/features/</a> about how far we can go now. Editing precompiled javascript on the go!</li> <li><a href="http://brendaneich.com/2011/05/mozillas-nodeconf-presentation/" rel="noreferrer">http://brendaneich.com/2011/05/mozillas-nodeconf-presentation/</a> about the future of javascript.</li> </ul>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload