background preloader

ES6 app

Facebook Twitter

Understanding JavaScript Promises, Pt. I: Background & Basics. # The Promised Land Native Promises are amongst the biggest changes ES2015 make to the JavaScript landscape.

Understanding JavaScript Promises, Pt. I: Background & Basics

They eliminate some of the more substantial problems with callbacks, and allow us to write asynchronous code that more nearly abides by synchronous logic. Promises feature a fairly simple API, but come with a bit of a learning curve. They can be conceptually exotic if you've never seen them before, but all it takes to wrap your head around them is a gentle introduction and ample practice. By the end of this article, you'll be able to: Articulate why we have promises, and what problems they solve;Explain what promises are, from the perspective both of their implementation and their usage; andReimplement common callback patterns using promises. Oh, one note. Just clone it down and checkout the Part_1 branch: git clone git checkout Part_1-Basics.

Learn ES2015 · Babel. Es6features This document was originally taken from Luke Hoban's excellent es6features repo.

Learn ES2015 · Babel

Go give it a star on GitHub! REPL Be sure to try these features out in the online REPL. Introduction ECMAScript 2015 is an ECMAScript standard that was ratified in June 2015. ES2015 is a significant update to the language, and the first major update to the language since ES5 was standardized in 2009. See the ES2015 standard for full specification of the ECMAScript 2015 language. ECMAScript 2015 Features Arrows and Lexical This Arrows are a function shorthand using the => syntax. Classes ES2015 classes are a simple sugar over the prototype-based OO pattern. Class SkinnedMesh extends THREE.Mesh { constructor(geometry, materials) { super(geometry, materials); this.idMatrix = SkinnedMesh.defaultMatrix(); this.bones = []; this.boneMatrices = []; //... } update(camera) { //... super.update(); } static defaultMatrix() { return new THREE.Matrix4(); }} Enhanced Object Literals Template Strings.

Babel · The compiler for writing next generation JavaScript. Object-Oriented JavaScript — A Deep Dive into ES6 Classes. This article was peer reviewed by Nilson Jacques and Tim Severien.

Object-Oriented JavaScript — A Deep Dive into ES6 Classes

Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be! Often we need to represent an idea or concept in our programs—maybe a car engine, a computer file, a router, or a temperature reading. Representing these concepts directly in code comes in two parts: data to represent the state and functions to represent the behavior. Classes give us a convenient syntax to define the state and behavior of objects that will represent our concepts. They make our code safer by guaranteeing an initialization function will be called, and they make it easier to define a fixed set of functions that operate on that data and maintain valid state. Top 10 ES6 Features Every Busy JavaScript Developer Must Know. I recently went to HTML5 Dev conference in San Francisco.

Top 10 ES6 Features Every Busy JavaScript Developer Must Know

Half of the talks I went to were about ES6 or, as it’s now called officially, ECMAScript2015. Build your first ES2015/ES6 application. GitHub - EscuelaIt/Curso-ECMAScript-6: Repositorio del Curso ECMAScript 6. What is PhantomJS and How is it Used? PhantomJS is a headless WebKit scriptable with a JavaScript API.

What is PhantomJS and How is it Used?

It has fast and native support for various web standards: DOM handling, CSS selector, JSON, Canvas, and SVG. JavaScript for Line of Business Applications. How to Use ES6 for Universal JavaScript Apps — JavaScript Scene. The ES6 love is in the `env` and `ecmaFeatures` keys.

How to Use ES6 for Universal JavaScript Apps — JavaScript Scene

You’ll need those to prevent errors when ESLint encounters your ES6-specific code. If you also want object rest & spread (an ES7 proposal commonly used in React code), you’ll also need `babel-eslint`. Compiling For most cases, you can simply replace your `node` calls with `babel-node` calls. `babel-node` caches modules in memory, so there’s a significant startup delay and potentially a lot of memory usage. Babel’s docs make compiling look like a breeze: $ babel script.js --out-file script-compiled.js Couldn’t be easier, right?

$ babel -d build-dir source-dir Note that the output directory comes first. If you want the debugger to work properly, you will want to add source maps with the `-s` option: $ babel -d build-dir source-dir -s To compile for the browser, you want to use Webpack, or the Babelify Browserify transform. Firebase + riot + es6. Guía paso a paso para crear una Isomorphic app con React, Express y ES6. Seguramente te estarás preguntando qué será eso de Isomorphic app.

Guía paso a paso para crear una Isomorphic app con React, Express y ES6

Dicho término no es más que un concepto que describe que el código JavaScript que normalmente ejecutamos en el cliente (Browser) también puede correr en el servidor (Node). Por ejemplo, nuestros componentes de React también pueden ser renderizados en el Backend. Esto abre un abanico de posibilidades que podrás ya estar evidenciando, y de las que muy probablemente trataremos a lo largo de este tutorial.

Últimamente suele hablarse mucho acerca de cómo las Single Page Applications(SPA) contribuyen al mejoramiento de la interacción con el usuario; en comparación a como se venía haciendo con el desarrollo tradicional de una app. Pero no debemos olvidar que el mayor problema de una SPA, es su relación con el SEO. ¿Existirá alguna alternativa para encontrar el equilibrio y brindar una excelente UX sin que nos afecte el posicionamiento?