Sí vale la pena aprender Typescript

Some people really like static type checking.

A simple vista parece que Typescript se siente como JavaScript pero con anotaciones lo cual es una ventaja “static typing”.

TypeScript Deep Dive

Typescript

Un lenguaje es “statically typed” si el tipo de una variable se conoce en su tiempo de compilación. La ventaja principal es que todos las verificaciones de tipos pueden ser realizadas por el compilador, lo que permite atrapar de manera temprana una gran cantidad de errores estúpidos.

Un lenguaje es “dynamically typed” si el tipo de una variable se interpreta en tiempo de ejecución, esto favorece al desarrollador ya que puede escribir código un poco más rápido, ya que no tiene que especificar el tipo cada vez.

La mayoría de los “scripting languages” tienen esta característica ya que no hay compilador para hacer “static typechecking” de todos modos, pero el desarrollador puede terminar buscando un error que se debe a la mala interpretación del tipo de una variable por parte del intérprete. Por suerte, la mayoría de los scripts tienden a ser pequeños, así que los errores no tienen tantos lugares para esconderse.

Por supuesto es posible desarrollar con ES6 y ES7, por ejemplo, usando Babel, lo interesante es que Typescript proporciona características similares a las de Babel, pero con el extra de la comprobación de tipos (es opcional).

Quickstart

The core concepts of Angular 2

Buenas excusas para aprender Angular 2

RTFM

Books

ng-book 2 Become a Ninja with Angular 2

Cheatsheet

Style GuideS

Awesome

Angular 2 Education

Learn Angular 2

Seeds, starters and boilerplates

AMD Modules and CommonJS Packages

Design Patterns

AMD Modules

/* -------------------------------------------------------------------------- */

/*
* AMD (Asynchronous Module Definition):
*
*   The module and dependencies can be asynchronously loaded. It helps to
*   removes the tight coupling between code and module identity.
*
*  JavaScript is single-threaded amd runs synchronous code executed in sequence:
*
*    All the time works on a synchronous code-flow executionn (in sequence).
*
*    Feel free to use Asynchronous code when performing expensive and
*    time-consuming operations.
*
*    We should always use XMLHttpRequest Asynchronously and update "the page"
*    when responses are available.
*
* Please read and enjoy:
*
*   https://github.com/amdjs/amdjs-api/wiki/AMD
*   
*   http://addyosmani.com/writing-modular-js
*/

/* -------------------------------------------------------------------------- */

/*
* My First Module.
*/
define('myFirstModule', [
  // Module Dependencies.
  'mySecondModule',
  'myThirdModule'
],
// Module definition function: Dependencies are mapped to Function Parameters.
function (mySecondModule, myThirdModule) {
  // Our Module Code Lives Here.
  var myFirstModule = {
    // Do stuff and Respond to requests.
    myResponse: function() {
      return '{"status": "success", "data": {"var": "val"}, "message": null}';
    };
  };
  // Returns a value that defines the Module Export.
  return myFirstModule;
});

/* -------------------------------------------------------------------------- */

/*
* Basic Example.
*/
define('myFirstModule', [
  'mySecondModule',
  'myThirdModule'
],
// Code lives here.
function (mySecondModule, myThirdModule) {
  return {
    myResponse: function(arg1, arg2) {
      return mySecondModule.yourResponse(
        myThirdModule.theirResponse(arg1, arg2)
      );
    };
  };
};
});

/* -------------------------------------------------------------------------- */

/*
* AMD Modules with jQuery.
*/
define('myjQeuryModule', [
  'js/jquery.js',
  'js/lodash.js'
],
// Here we map jQuery with $ and Lodash with _
function($ , _) {
  // Here we can use: https://jquery.com an d https://lodash.com
  // through the use of the parameters $ and _
  return {
    // What we return here can be used by other modules.
  };
});

/* -------------------------------------------------------------------------- */

/*
* Most Commonly Used Browser Module Loader: http://requirejs.org
*
* "yourModule" and "theirModule" are two external modules.
*
* The "exports" from this two modules loaded are passed as function
* arguments to the callback (yourModule, theirModule) so that they can
* similarly be accessed.
*/
require([
  'yourModule',
  'theirModule'
],
function (yourModule, theirModule) {
  // Rest of the Code Lives Here.
  yourModule.yourResponse();
  theirModule.theirResponse();
});

/* -------------------------------------------------------------------------- */

/*
* Dynamically-loaded Dependencies.
*/
define(function ( require ) {
  var isReady = false,
      myResponse;
  // Note the inline require within our module definition above.
  require([
    'yourModule',
    'theirModule'
  ],
  // Code lives here.
  function (yourModule, theirModule) {
    isReady = true;
    myResponse = yourModule.yourResponse() + theirModule.theirResponse();
  });
  // We can still return a module.
  return {
      isReady: isReady,
      myResponse: myResponse
  };
});

/* -------------------------------------------------------------------------- */

CommonJS Packages

/* -------------------------------------------------------------------------- */

/*
* CommonJS the Module Format Optimized For The Server.
*
* Is a Standard for Asynchronous Modules.
*
* The CommonJS module specifies a simple API for declaring server-side modules.
* It covers a set of concerns such as: io, filesystem, promises and more.
*
* Contains two primary parts:
*
*   A free variable named "exports" which contains the objects a module wishes
*   to make available to other modules.
*
*   A "require" function that modules can use to import the exports of other
*   modules.
*/

/* -------------------------------------------------------------------------- */

/*
* Package/library is a dependency we require.
*/
var library = require('package/library');

function myMethod() {
  return library.theirMethod();
}

// Exports/Exposes myMethod to other modules.
exports.myMethod = myMethod;

/* -------------------------------------------------------------------------- */

/*
* Most Commonly Used Server Module Loader: http://nodejs.org
*
* Node adapter for RequireJS: http://requirejs.org/docs/node.html
*
* Node.js is single-threaded amd runs synchronous code executed in sequence:
*
*   Sometimes have both asynchronous and synchronous versions of things:
*    - writeFile.
*    - writeFileSync.
*
*  "Node.js handles requests with a single thread concurrently by multiplexing
*   and sequencing all your JS logic in a single stream of execution which works
*   well for IO-bound workloads."
*
*   Always behave Asynchronous when I/O is involved or when in doubt.
*
* Please read and enjoy:
*
*   http://www.nodewiz.biz/your-doing-node-js-wrong-avoid-synchronous-code
*/

/* -------------------------------------------------------------------------- */

/*
* Basic consumption of exports.
*/
function messages() {
  this.success = function() {
    return '{"status": "success", "data": {"var": "val"}, "message": null}';
  }

  this.error = function() {
    return '{"status": "error", "data": null, "message": "System Message"}';
  }
}

// Exposes messages to other modules.
exports.messages = messages;

/* -------------------------------------------------------------------------- */

/*
* An application/module consuming 'messages'.
*/
var messages = require('./modules/messages').messages;

var res = new messages();

res.success();

/* -------------------------------------------------------------------------- */

Handy Sass “Mixins”

Sass Style Guide

Compass Mixins

A Simple and Lightweight Mixin Library

Useful SASS Mixins Library

Reusable Mixins

Really Simple Media Queries

Serving High Resolution Background Images

Sassaparilla Grid

Sass MediaQueries

Set Text on the Web to a Baseline Grid

A Grid System for Humans

A Lightweight, Responsive CSS Layout Engine

Unicorn UI Buttons

Sassy Buttons

Bootstrap Sass