Añadido Gruntfile para automatizar y agilizar tareas de desarrollo

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+npm-debug.log

Gruntfile.js

@@ -0,0 +1,81 @@
+'use strict';
+
+module.exports = function(grunt) {
+
+    // Carga todos los plugins de Grunt que indicamos en `package.json`
+    require('load-grunt-tasks')(grunt);
+
+    // Tareas por defecto
+    grunt.registerTask('default', ['connect:livereload','watch'])
+
+    // Configuración de tareas
+    grunt.initConfig({
+
+    // Settings del proyecto (rutas configurables)
+    sfotipy: {
+        app: 'templates',
+    },
+
+    // Vigila los cambios que se efectuan en los archivos y ejecuta
+    // las tareas asignadas
+    watch: {
+      // Esto nos permite que el navegador se recargue con cada cambio
+      // que hagamos en el código. Todas las subtareas que incluyamos en
+      // en la tarea `watch` ejecutarán livereload a menos que le indiquemos
+      // lo contrario
+        livereload: {
+            options: {
+                livereload: '<%= connect.options.livereload %>'
+            },
+            files: [
+                '<%= sfotipy.app %>/css/estilos.css',
+                '<%= sfotipy.app %>/index.html',
+                '<%= sfotipy.app %>/img/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
+            ]
+        },
+        styles: {
+            files: ['<%= sfotipy.app %>/stylus/{,*/}*.styl'],
+            tasks: ['stylus']
+        }
+    },
+
+    // Automatiza el proceso de compilado de Stylus a CSS y su minificación
+    stylus: {
+        options: {
+            use: [require('nib')]
+        },
+        compile: {
+            options: {
+                paths: ['<%= sfotipy.app %>/stylus/{,*/}*.styl'],
+                'include css': true
+            },
+            files: {
+                '<%= sfotipy.app %>/css/estilos.css': '<%= sfotipy.app %>/stylus/estilos.styl'
+            }
+        }
+    },
+
+    // Crea un servidor web de desarrollo para utilizar en local
+    // La aplicación se muestra en http://localhost:9000 o http://0.0.0.0:9000
+    // Podemos acceder desde otros dispositivos en nuestra red, por ejemplo
+    // un celular o un tablet, simplemente ingresando en nuestros dispostivos
+    // la URL del equipo en la red (ej: http://192.168.1.X:9000)
+    connect: {
+      options: {
+        port: 9000,
+        hostname: '0.0.0.0',
+        livereload: 35729
+      },
+      // Ejecuta la función livereload para poder ver los cambios del código
+      // en el navegador en tiempo real
+      livereload: {
+        options: {
+          open: true,
+          base: ['<%= sfotipy.app %>/']
+        }
+      }
+    }
+
+  });
+
+};

README.md

@@ -1,8 +1,48 @@
-sfotipy
-=======
+#sfotipy
 
-El proyecto oficial del curso de Frontend Profesional
+El proyecto oficial del [curso de Frontend Profesional](http://mejorando.la/frontend)
 
 Los archivos trabajados en las clases 1, 2 y 3 están en una nueva rama https://github.com/Sfotipy/sfotipy/tree/clases_123
 
 Se libre de contribuir al proyecto terminando el resto del diseño de Sfotipy :)
+
+## Instalación
+
+### Grunt.js y Node.js
+
+Para automatizar y agilizar el desarrollo frontend del proyecto, hemos instalado
+[Grunt](http://gruntjs.com), que es un gestor de tareas que corre en JavaScript
+
+Necesitas tener instalado [NodeJS](http://nodejs.org/downloads), ya que Grunt lo utiliza,
+pero no hay que preocuparse, no es necesario saber Node.js para utilizarlo. Es igual
+que Stylus, lo utiliza como motor por debajo.
+
+Si tienes MAC, puedes instalar con `homebrew`:
+```sh
+# Instala Homebrew en tu equipo
+$ ruby -e "$(curl -fsSL https://raw.github.com/Homebrew/homebrew/go/install)"
+# Instala Node con Brew
+$ brew install node
+```
+### Dependencias globales
+Una vez tenemos Node instalado, podemos instalar las siguientes dependencias
+globalmente ya que las utilizaremos en este y otros proyectos
+```
+$ sudo npm install -g stylus
+$ sudo npm install -g nib
+$ sudo npm install -g grunt
+$ sudo npm install -g grunt-cli
+```
+
+## Ejecución
+Para arrancar el proyecto, primero necesitamos instalar las dependencias de
+desarrollo que hemos definido en el `package.json` lo hacemos con
+```
+$ npm install
+```
+Entonces ya podemos correr el servidor y empezar a desarrollar el frontend e ir visualizando los cambios, lo hacemos con la tarea por defecto de `Grunt`
+```
+$ grunt
+```
+Esto nos abrirá por defecto una ventana del navegador en la URL [http://0.0.0.0:9000](http://0.0.0.0:9000) y gracias a `livereload` podemos ver los cambios son necesidad de recargar la
+página

package.json

@@ -0,0 +1,16 @@
+{
+    "name": "sfotipy",
+    "description": "Proyecto oficial del curso de Frontend Profesional",
+    "version": "0.0.1",
+    "dependencies": {},
+    "devDependencies": {
+        "grunt": "0.4.4",
+        "grunt-cli": "~0.1.13",
+        "grunt-contrib-connect": "~0.7.1",
+        "grunt-contrib-stylus": "~0.13.2",
+        "grunt-contrib-imagemin": "~0.5.0",
+        "grunt-contrib-watch": "~0.6.1",
+        "load-grunt-tasks": "~0.4.0",
+        "nib": "~1.0.2"
+    }
+}