Dentro de los desarrollos Web cada vez son más conocidas herramientas como Bower, NPM, Node, Grunt, etc. Y, dentro de estas herramientas, Yeoman se está popularizando cada vez más.
¿Qué es Yeoman?
Yeoman es un creador de proyectos, de tal forma que evita a los desarrolladores los problemas de crear un proyecto de inicio. Dentro de este creador de proyectos, se introducen las lecciones aprendidas previamente, así como las buenas prácticas de los mismos. Por ejemplo, si utilizamos una determinada librería (como puede ser PnP), cuando tenemos creado el proyecto esta librería ya está disponible.
En la práctica podemos definir Yeoman como un «plugin» que se ejecuta dentro de NodeJs por el cual podemos crear proyectos de los principales proyectos Web, como pueda ser una aplicación vNext, una SPA basada en el framework JavaScript que decidamos utilizar en nuestro desarrollo (ReactJS, AngularJS, Backbone, etc..). De la misma forma, estas plantillas pueden utilizar otras herramientas de FrontEnd como Grunt, Bower o npm.
¿Cómo podemos utilizarlo?
Está claro que hay multitud de plantillas, incluso hay una plantilla para realizar Add-In de Office, pero en ENCAMINA lo estamos utilizando para tener una serie de plantillas dependiendo del proyecto que llevemos a cabo. Por ejemplo, si tenemos un proyecto de un sitio de Colaboración de SharePoint Onpremise, tenemos una plantilla Yeoman que crea una solución de Visual Studio con los proyectos que creemos que deben tener un proyecto de tipo:
- Proyecto de Despliegue (PowerShell)
- Proyecto de Clases de Modelo
- Proyecto de Clase de Servicio
- Proyecto de Test Unitarios
- Proyecto de SharePoint
Además, dentro de estos proyectos tienen las librerías necesarias en un principio. Por ejemplo, si para el desarrollo en la parte cliente necesitamos tener descargado JQuery pues dentro del proyecto correspondiente estará cargado. O si en el proyecto de Test Unitarios utilizamos un determinado Inyector de Dependencias pues ya lo tenemos descargado.
La principal ventaja de la utilización de Yeoman es que podemos estandarizar los proyectos que llevamos desarrollando entre manos. Independientemente de que lo realice un equipo de desarrollo u otro, ambos utilizarán las mismas herramientas/utilidades/librerías con lo que conseguimos que todo el equipo crezca en una misma dirección.
¿Cómo creamos la plantilla?
Como preriquisitos para empezar a crear la plantilla debemos tener instalado NodeJS, y dentro de node tener instalado «yo». Para instalar yo basta con el siguiente comando:
npm install -g yo
El siguiente paso que vamos a realizar es crearnos una carpeta a la que le pondremos como nombre «Generator» (el nombre de nuestra plantilla). En nuestro caso «encamina sharepoint». A continuación, tendremos una plantilla generator, que por un lado contiene un fichero index.js y, por otro lado, tiene una carpeta llamada «Templates» (en la que tenemos la plantilla que queremos replicar).
Dentro de la carpeta «Templates» tendremos nuestra solución de Visual Studio que deseamos replicar. Dentro de esta solución, modificamos el fichero de solución, cambiando el nombre del proyecto por una variable projectName (de tal forma que cuando creemos el nuevo proyecto, la solución contenga los proyectos con su nuevo nombre).
El siguiente paso es crear el fichero index.js. Dentro de este fichero vamos a extender el funcionamiento por defecto de Yeoman y lo adaptaremos a nuestras necesidades. Para ello, podemos utilizar el siguiente ejemplo:
'use strict';
var yeoman = require('yeoman-generator');
var chalk = require('chalk');
var yosay = require('yosay');
var rename = require('gulp-rename');
var mkdirp = require('mkdirp');
module.exports = yeoman.generators.Base.extend({
prompting: function () {
var done = this.async();
// Have Yeoman greet the user.
this.log(yosay(
'Welcome to the rad ' + chalk.red('Encamina Sharepoint') + ' generator!'
));
var prompts = [{
name: 'applicationName',
message: 'What\'s the name of your SharePoint application?',
default: "Encamina.Project.Template"
}];
this.prompt(prompts, function (props) {
this.props = props;
// To access props later use this.props.someOption;
done();
}.bind(this));
},
writing: {
app: function () {
var directories = ["Service", "Model", "SP", "Test", "WCF"];
var contexto = this;
var appName = {projectName: this.props.applicationName};
directories.forEach(function(directory) {
var projectName = contexto.props.applicationName + "." + directory;
var projectInfo = {
directory: directory,
projectName : projectName,
pathProjectFolder: contexto.destinationRoot() + "/" + projectName,
pathTemplateFolder: 'Encamina.Project.Template.' + directory,
appName: appName
}
mkdirp(projectInfo.pathProjectFolder);
mkdirp(projectInfo.pathProjectFolder + "/Properties", function() {
contexto.fs.copyTpl(contexto.templatePath(projectInfo.pathTemplateFolder + '/Properties/AssemblyInfo.cs'),
contexto.destinationPath() + "\\" + projectInfo.projectName + "\\Properties\\AssemblyInfo.cs",
projectInfo.appName);
})
mkdirp(projectInfo.pathProjectFolder + "/bin");
mkdirp(projectInfo.pathProjectFolder + "/obj");
contexto.fs.copyTpl(contexto.templatePath(projectInfo.pathTemplateFolder + '/' + projectInfo.pathTemplateFolder +'.csproj'),
contexto.destinationPath() + "\\" + projectInfo.projectName + "\\" + projectInfo.projectName + ".csproj",
projectInfo.appName);
createProjectTypeSpecificItems(contexto, projectInfo);
});
this.fs.copyTpl(this.templatePath('Encamina.Project.Template.sln'),
this.destinationPath() + "\\" + this.props.applicationName + ".sln",
appName);
}
},
install: function () {
this.installDependencies();
}
});
Para poder utilizarlo independientemente de la ruta donde nos encontremos, deberemos introducir el siguiente comando:
npm link
Ejecutamos desde cualquier consola node yo encamina-sharepoint se muestra la siguiente pantalla:
Yeoman vs Templates Visual Studio
Anteriormente a la existencia de Yeoman, la opción escogida era crear varios templates de Visual Studio y, de esta forma, instalarla y distribuirla en cada equipo de desarrollo. Ahora bien, si con los templates cumplía con su misión… ¿Por qué utilizar Yeoman?
La primera ventaja de Yeoman es que todos los equipos de desarrollo lo pueden utilizar. Puede haber equipos que desarollen en Java, o aplicaciones multiplataformas ya sean Web o móvil. Yeoman es una herramienta que la pueden utilizar todos los equipos y de esta forma se estandariza la creación.
Otra ventaja es la distribución. Con NodeJS podemos crear un repositorio central dentro de la organización para poder tener todos los templates que vamos a utilizar. Otra opción es tener un «npm» privado y alojar allí las plantillas. Con los Templates habría que hacer una regla desde IT para que cada que vez que se instale Visual Studio se instalen estos templates ó bien que el propio desarrollador lo instale cuando considere oportuno (esto sin tener en cuenta que muchas veces desarrollamos en una máquina virtual que no esta dentro de la organización con lo cual las reglas de IT no se cumplen).
Conclusión
El desarrollo multiplataforma cada vez esta más presente. La unificación/estandarización de las herramientas es un echo cada vez más presente. Mi recomendación es utilizar estas herramientas y ver en qué nos pueden ayudar a mejorar nuestro proceso en el desarrollo software. Si es algo que mejora lo que utilizamos ahora mismo, deberemos incorporarlo a este ciclo. Yeoman es una herramienta muy útil y que cumple de sobra la tarea de estandarizar la plantilla de los proyectos que desarrollamos.
¡Suscríbete a nuestras RRSS!
