Improving the Yeoman Generator Gulp Angular

The Yeoman generator generator-gulp-angular is a great tool for building AngularJS and in my opinion is much better than the official Yeoman generator for AngularJS (generator-angular), because it uses Gulp and not Grunt as the task runner, it has a component-like folder structure for the code instead of the “drawer” style, it uses libsass instead of compass (ruby), it supports Typescript and has a lot of options for configuration.

But there is a thing that I don’t like: how it handles bootstrap-sass. Continue reading “Improving the Yeoman Generator Gulp Angular”

Working with Sass, Bootstrap and Gulp

For frontend developers, the days when you manually linked css files to your index.html are over. Modern workflows needs some compilation steps before having a css file that can be use in development or production. Most notably, sass has become the most important language that extends css functionalities, while gulp has won the battle on the building tools front. Continue reading “Working with Sass, Bootstrap and Gulp”

Introduction to the Typescript Transpiler

Typescript is the new kid on the block, a newly attempt to bring order to the javascript chaos. ES6 is around the corner and is a fantastic step forward for frontend development (classes!) but it will take years to be fully implemented in all major browsers. That’s when Typescript comes to the rescue. Typescript goal is to be a superset of ES6 that, in addition to all the new stuff that the standard is defining, will add a static type system. Typescript has also a transpiler that converts our Typescript code (i.e. ES6 + types) to ES5 or ES3 javascript code so we can use it in today browsers. Continue reading “Introduction to the Typescript Transpiler”

Abstract/Concrete Inheritance Model in AngularJS

In a previous post I showed how to create a “classic” inheritance model in AngularJS using directives. This time I will show another inheritance model: the abstract/concrete.

In OOP, an abstract class cannot be instantiated, it serves only to provide common properties and functionality to child classes. In Angular, we have to make an analogy and define that an abstract directive is one that does not have a template or a link function, only a controller. The template is provided by child directives.

Continue reading “Abstract/Concrete Inheritance Model in AngularJS”

Directive Inheritance in AngularJS

Inheritance is a powerful way to extend directives functionality and at the same time, improve code reuse. Lets see how it works in Angular with a simple example. The first step is to create a directive called “outer” which is going to be our top-level directive in our hierarchy.

Continue reading “Directive Inheritance in AngularJS”

Story Points: Definiendo el esfuerzo relativo

Scrum es una metodología de desarrollo de software muy popular en la actualidad. Una de las herramientas de Scrum para la planificación de la duración de un proyecto, es la actividad conocida como “planning poker” en donde el equipo de desarrollo le asigna a cada funcionalidad del sistema, o lo que en Scrum se conoce como “historia de usuario”, una cantidad de puntos que miden su dificultad relativa. Continue reading “Story Points: Definiendo el esfuerzo relativo”