Full Stack Developer | Agilizando tus proyectos
Mejora el flujo de trabajo es una de las tareas mas complicadas de hacer, pero gracias a herramientas como
Yeoman nos permitiran hacer mas agil y en automatico tareas para el desarrollo de nuestros proyectos.
Pero Hablemos un poco de
Yeoman que es un conjunto de herramientas compuestas por
Bower y Grunt que en minutos crean el esqueleto de tus proyectos web. La instalacion es muy sencilla pero como requisito necesitamos tener instalado Node.js entonces una vez que tengamos Node js tendremos que abrir la consola y escribir la siguiente instruccion.
npm install -g yo bower grunt-cli
De esta forma tendremos instalado Yeoman ademas de
Yo, Bower y Grunt pero hablemos ahora de como usar esta herramienta comenzando por los Generadores
Generadores
Para comenzar a usar
Yeoman y crear nuestro primer esqueleto, lo que tenemos que hacer es instalar uno de los generadores que se encuentran disponibles, buscar y elegir cual es que se adecue a nuestras necesidades de nuestro proyecto. Pero que es un generador no es mas que una rutina escrita para construir un esqueleto en particular.
Actualmente exiten unos 20 generadores oficiales mantenidos por el equipo de
Yeoman, de los cuales el más utilizado suele ser el generador de aplicaciones basadas en Angular. Ademas existen actualmente más de 700 generadores mantenidos por la comunidad teniendo desde
Wordpress, Jekyll, MEAN y mucho más.
Por lo que en este caso como ejemplo vamos a crear un proyecto Web sencillo por lo que instalaremos uno de los generadores para crear una aplicacion web haciendo uso de esta instruccion
npm install -g yo
npm install -g generator-webapp
Ahora que tenemos nuestro ambiente preparado ya podemos comenzar a armar nuestra aplicación.
Entonces procederemos a crear una carpeta llamada
Desarrolladores FullStack y accederemos a ella enseguida colocaremos el comando "yo" o su equivalente "yo webapp" Podemos ver que ahora tenemos una nueva opción en nuestro helper de
Yeoman.
Si seguimos con el proceso veremos algo como esto:
?] What would you like to do? Run the Webapp generator (0.4.9)
Make sure you're in the directory you want to scaffold into.
This generator can also be run with: yo webapp
_-----_
| |
|--(o)--| .--------------------------.
`---------´ | Welcome to Yeoman, |
( _´U`_ ) | ladies and gentlemen! |
/___A___\ '__________________________'
| ~ |
__'.___.'__
´ ` |° ´ Y `
Out of the box I include HTML5 Boilerplate, jQuery, and a Gruntfile.js to build your app.
[?] What more would you like? Bootstrap
create Gruntfile.js
create package.json
create .gitignore
create .gitattributes
create bower.json
create .jshintrc
create .editorconfig
create app/favicon.ico
create app/404.html
create app/robots.txt
create app/.htaccess
create app/styles/main.css
create app/index.html
create app/scripts/main.js
I'm all done. Running bower install & npm install for you to install the required dependencies. If this fails, try running the command yourself.
npm WARN package.json aplicacion-web@0.0.0 No description
npm WARN package.json aplicacion-web@0.0.0 No repository field.
npm WARN package.json aplicacion-web@0.0.0 No README data
npm http GET https://registry.npmjs.org/grunt-bower-install
npm http GET https://registry.npmjs.org/grunt-autoprefixer
npm http GET https://registry.npmjs.org/grunt-mocha
...
...
Ahora dentro de los archivos que fueron creados vamos a abrir package.json, Grunt.js y bower.json donde podemos ver todo lo instalado asi como las versiones ademas de las rutas de cada archivo.
Introduccion al Desarrollo FullStack | Node JS y MongoDB 
