Publish "Temporal Dead Zone (TDZ) demystified" article; fix typos in other articles; harmonic.js is now transpiled with 6to5 instead of Traceur

Author: UltCombo

2014/05/ecmascript-6-a-better-javascript-for-the-ambient-computing-era/index.html

@@ -121,14 +121,14 @@ <h2>ECMAScript 6 - A Better JS for the Ambient Computing Era</h2>
                     </div>
 
                     <div class="main-article wrapper">
-                        <article class="article-content"><p>
-Allen Wirfs-Brock (<a href="https://twitter.com/awbjs">awbjs</a> on Twitter) is a TC39 member. Actually, he is the &quot;Project Editor of the ECMAScript Language Specification&quot;.
-I&#39;m not pretty sure where he gave this talk, but i&#39;m looking forward to watch the recording.
-The slides content are great and explains a lot of things about ES6, and about the JavaScript itself.</p>
+                        <article class="article-content">
+<p>Allen Wirfs-Brock (<a href="https://twitter.com/awbjs">awbjs</a> on Twitter) is a TC39 member. Actually, he is the &quot;Project Editor of the ECMAScript Language Specification&quot;.
+I&#39;m not pretty sure where he gave this talk, but I&#39;m looking forward to watch the recording.
+The slides content is great and explains a lot of things about ES6, and about JavaScript itself.</p>
 <p>A little descriptions about his talk (by him):
 &quot;We&#39;ve entered the Ambient Computing Era and JavaScript is its dominant programing language, But a new computing era needs a new and better JavaScript. It&#39;s called ECMAScript 6 and it&#39;s about to become the new JavaScript standard. Why do we need it? Why did it take so long? What&#39;s in it? When can you use it? Answers will be given.&quot;</p>
 <p>As soon as this talk recording is available, we&#39;ll post it here.
-By now, follows the slides.  </p>
+For now, here are the slides.  </p>
 <iframe src="http://www.slideshare.net/slideshow/embed_code/34230355" width="427" height="356" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border:1px solid #CCC; border-width:1px 1px 0; margin-bottom:5px; max-width: 100%;" allowfullscreen> </iframe> <div style="margin-bottom:5px"> <strong> <a href="https://www.slideshare.net/allenwb/wdc14-allebwb" title="ECMAScript 6: A Better JavaScript for the Ambient Computing Era" target="_blank">ECMAScript 6: A Better JavaScript for the Ambient Computing Era</a> </strong> from <strong><a href="http://www.slideshare.net/allenwb" target="_blank">Allen Wirfs-Brock</a></strong> </div><br>
 [UPDATE October, 2014]<br>The video is already online! (Thanks <a href="https://github.com/cirocosta">Ciro Costa</a> for point this).<br><iframe width="560" height="315" src="//www.youtube.com/embed/ZGY8Cktn6W4" frameborder="0" allowfullscreen></iframe>
 </article>

2014/05/practical-workflows-es6-modules/index.html

@@ -121,8 +121,8 @@ <h2>Practical Workflows for ES6 Modules, Fluent 2014</h2>
                     </div>
 
                     <div class="main-article wrapper">
-                        <article class="article-content"><p>
-<a href="https://twitter.com/guybedford">Guy Bedford</a> gave an awesome talk about a practical workflows with ES6 modules last month at Fluent Conf.<br>Also, he write up an article about it. If you are interested on this subject, you must read the full article.<br>Introduction:  </p>
+                        <article class="article-content">
+<p><a href="https://twitter.com/guybedford">Guy Bedford</a> gave an awesome talk about a practical workflows with ES6 modules last month at Fluent Conf.<br>Also, he write up an article about it. If you are interested on this subject, you must read the full article.<br>Introduction:  </p>
 <p>&quot;ES6 modules are set to become the future replacement for the AMD and CommonJS module formats. They are defined by the current ES6 Specification and will be implemented in JavaScript engines in the future in both the browser and the server.  This article covers a variety of practical workflows for implementing ES6 modules. These approaches are very new, and there will still be edge cases, but these principles provide a path forward towards ES6 for use in both new and existing projects today&quot;.  </p>
 <p>Full article: <a href="http://guybedford.com/practical-workflows-for-es6-modules">http://guybedford.com/practical-workflows-for-es6-modules</a>.  </p>
 <p>You can watch the talk below.  </p>

2014/08/what-you-need-to-know-about-block-scope-let/index.html

@@ -125,8 +125,8 @@ <h2>What you need to know about block scope - let</h2>
                     </div>
 
                     <div class="main-article wrapper">
-                        <article class="article-content"><p>
-Variables declaration in any programming language are something pretty basic.<br>Regardless the language, understanding how variable scope works is essential to write any kind of program.<br>In Python, for example, as well as in most languages​​, there are two scopes: Local and Global.<br>Variables defined at the top of the file, without identation, are global scope variables.<br>Variables declared inside the function body are considered as local scope.<br>So far, everything is very similar. In JavaScript, the behavior is quite similar.<br>Let&#39;s see one example in both languages:  </p>
+                        <article class="article-content">
+<p>Variables declaration in any programming language are something pretty basic.<br>Regardless the language, understanding how variable scope works is essential to write any kind of program.<br>In Python, for example, as well as in most languages​​, there are two scopes: Local and Global.<br>Variables defined at the top of the file, without identation, are global scope variables.<br>Variables declared inside the function body are considered as local scope.<br>So far, everything is very similar. In JavaScript, the behavior is quite similar.<br>Let&#39;s see one example in both languages:  </p>
 <pre><code class="lang-python"># Python
 x = 1 # global scope
 y = 3

2014/12/using-es6-modules-in-the-browser-with-gulp/index.html

@@ -121,8 +121,8 @@ <h2>Using ES6 modules in the browser with gulp</h2>
                     </div>
 
                     <div class="main-article wrapper">
-                        <article class="article-content"><p>
-There is a lot of information about <a href="http://gulpjs.com/">gulp</a>, not so much for ES6 and just a very few articles about how to implement ES6 modules (for the browser) properly. </p>
+                        <article class="article-content">
+<p>There is a lot of information about <a href="http://gulpjs.com/">gulp</a>, not so much for ES6 and just a very few articles about how to implement ES6 modules (for the browser) properly. </p>
 <p>On my last project I was using <a href="http://gulpjs.com/">gulp</a> + ES6 and I had to spend some time figuring out how to get ES6 modules working properly. This is how I finally did it without using <a href="http://browserify.org/">Browserify</a> or any <a href="http://requirejs.org/">AMD loader</a>.</p>
 <p>My first attempt was to use <a href="https://www.npmjs.org/package/gulp-es6-transpiler">gulp-es6-transpiler</a> (that basically is a wrapper for <a href="https://www.npmjs.org/package/es6-transpiler">es6-transpiler</a>) but it doesn’t support modules, then I took a look to <a href="https://www.npmjs.org/package/gulp-es6-module-jstransform">gulp-es6-module-jstransform</a> but it only transpiles to CommonJS, meaning that we’ll need to use <a href="http://browserify.org/">Browserify</a>, then I tried <a href="https://github.com/google/traceur-compiler">Traceur</a> (from Google) and it has two options for browser modules, one is ‘AMD’ (meaning that we’ll need to use <a href="http://requirejs.org/">RequireJS</a> or similar) and ‘inline’ that, basically, generates one file with all the transpiled modules on it (which is the closest option to “native” ES6 modules).
 The thing is that the ‘inline’ option works perfect if you are using the command line, but if you use the Traceur’s node API (like <a href="https://www.npmjs.org/package/gulp-traceur">gulp-traceur</a>) it’ll throw an error. <strong>[UPDATE]</strong> I’ve put this issue on <a href="https://github.com/google/traceur-compiler/issues/1282">their Github</a> and finally got fixed, but then we realized that the transpile from the node API wasn’t generating the same output as the command line, so we finally decided to build a small <a href="http://gulpjs.com/">gulp</a> plugin wrapper for the command line Traceur (Thanks Edward!)</p>