Cargando



Primeros pasos con Sails.js

En este tutorial veremos todo lo que necesitamos saber para dar los primeros pasos con Sails.js, desde su instalación, estructura del framework y creación de una aplicación sencilla para demostrar su poder y versatilidad.


mar 09 2015 04:16
Profesional
mar 09 2015 10:08
JavaScript está evolucionando de manera exponencial, no solo posicionándose como base para desarrollos del lado del Front-End con la ayuda de distintos frameworks y tecnologías sino que también haciéndolo para el Back-End, esto gracias a la introducción de la famosa plataforma Node.js y todas las prestaciones que vienen inherentes a ella.

En la actualidad tenemos frameworks que nos ayudan de manera eficiente a trabajar con estas tecnologías, y uno de estos es Sails.js, el cual no es más que un framework MVC orientado al Back-End y engloba conceptos como REST, HTTP o WebSockets, permitiéndonos desde el desarrollo de APIs, servir archivos HTML hasta manejar múltiples peticiones en nuestras aplicaciones.

Requisitos


1- Para llevar a cabo los ejercicios y ejemplos propuestos en este tutorial debemos poseer una instalación con la versión más reciente de Node.js. Esto es muy sencillo de obtener, para este caso vamos a utilizar el instalador de Windows que conseguimos directamente en la web oficial de Node.js, este se ejecuta como cualquier instalador y luego nos genera un acceso directo a la consola Node.js donde podremos ejecutar los scripts necesarios. Sino conocemos nada de Node.js y queremos darle un vistazo primero recomendamos darle un vistazo al siguiente tutorial.

2- Necesitamos un editor de textos enriquecido al estilo de Sublime Text o NotePad ++ para poder escribir el código necesario para cumplir los ejemplos y ejercicios que estaremos mostrando.

3- Por último necesitamos acceso a Internet para poder hacer la descarga de Sails.js aunque sea una vez.

Instalación


La instalación de Sails.js es tan sencilla como ejecutar una línea de comandos en nuestra consola de Node.js. Abrimos la misma y utilizamos el gestor de paquetes de Node.js para realizar la instalación escribiendo lo siguiente:
npm -g install sails
Ejecutamos nuestro comando, el cual puede demorarse unos minutos mientras verifica las dependencias y realiza la instalación de todo lo necesario para nuestro framework:

primeros-pasos-sailsjs.jpg



Luego de finalizar el proceso creamos una nueva aplicación para verificar que todo ha ido sin problemas con el siguiente comando:
sails new proyectoPrueba
Lo cual debería darnos un mensaje de éxito con el nombre de nuestra aplicación como podemos ver en la siguiente imagen:


primeros-pasos-sailsjs-2.jpg


Adicionalmente, si nos posicionamos en nuestra aplicación y listamos el directorio podemos apreciar todos los archivos generados por el mismo:


primeros-pasos-sailsjs-3.jpg


Por último, solo nos queda levantar nuestro servidor, para ello estando en la aplicación ejecutamos el siguiente comando:
sails lift
Con esto ya habremos levantado nuestro servidor, dándonos varios mensajes interesantes como el ambiente que en este caso es desarrollo y el puerto donde está corriendo la aplicación que es el 1337, abrimos el navegador de nuestra preferencia y visitamos la siguiente dirección http:localhost:1337 lo cual debe verse de la siguiente forma:



Como podemos ver tenemos una vista que nos despliega el home por defecto, el cual contiene entre otras cosas los siguientes pasos a realizar para seguir nuestro camino en este framework. Ya habiendo verificado que todo funciona correctamente, vamos a hacer un paréntesis para conocer un poco la estructura de nuestra aplicación y que tenemos a disposición para trabajar.

Estructura de nuestra aplicación


Sails.js es un framework bastante completo por lo cual nos genera una cantidad de directorios y archivos importantes para nuestro desarrollo, veamos:

Api


Este el directorio en el cuál son gestionados los controladores y modelos de nuestra aplicación, además también se crea un directorio llamado policies que es donde se definen reglas de autorización y de control de acceso.

También tenemos el directorio responses donde se gestionan las respuestas del servidor y por último services que podemos pensarlo como el directorio donde están colocadas las librerías las cuales contienen funciones que nos ayudan a lograr distintas funcionalidades en nuestra aplicación.

Assets


Los assets se refieren a esos archivos estáticos tales como js, css, imágenes, etc., que se encuentran en nuestro servidor y que queramos que sean accesibles de manera externa. En Sails.js estos archivos son colocados en el directorio assets, el cual tiene una funcionalidad de procesar y de sincronizar estos archivos y colocarlos en una carpeta temporal cada vez que levantamos nuestra aplicación, donde el contenido de esta carpeta temporal es lo que Sails.js se encarga de servir.

Config


Luego tenemos nuestro directorio config, el cual contiene dos sub-directorios y una cantidad bastante extensa de archivos pensados en la configuración de nuestra aplicación. El primer directorio es env, el cual posee dos archivos, uno para definir los parámetros cuando estamos trabajando en desarrollo y el otro en producción. El segundo directorio es llamado locales y nos permite crear nuestros JSON con los distintos lenguajes manejados por la aplicación.

Uno de los archivos más importantes en el directorio config es aquel llamado connections.js el cual permite gestionar las distintas conexiones a Bases de Datos, ya las conexiones están definidas y nosotros solo debemos agregar los parámetros de conexión. Esto se debe a que Sails.js ya viene por defecto con Waterline un poderoso ORM para el manejo de las operaciones con Bases de Datos relacionales y no relaciones como tal.

Es por ello que podemos tener conexiones a una Base de Datos MySQL:
someMysqlServer: { adapter: 'sails-mysql', host: 'YOUR_MYSQL_SERVER_HOSTNAME_OR_IP_ADDRESS', user: 'YOUR_MYSQL_USER', password: 'YOUR_MYSQL_PASSWORD', database: 'YOUR_MYSQL_DB' },
A una Base de Datos noSQL como MongoDB:
someMongodbServer: { adapter: 'sails-mongo', host: 'localhost', port: 27017, // user: 'username', // password: 'password', // database: 'your_mongo_db_name_here' },
O incluso PostgreSQL:
somePostgresqlServer: { adapter: 'sails-postgresql', host: 'YOUR_POSTGRES_SERVER_HOSTNAME_OR_IP_ADDRESS', user: 'YOUR_POSTGRES_USER', password: 'YOUR_POSTGRES_PASSWORD', database: 'YOUR_POSTGRES_DB' }
Solo debemos instalar las dependencias para la Base de Datos que necesitamos y estaremos listos para trabajar con Sails.js de manera rápida y sencilla.

Tasks


El directorio tasks contiene algunas reglas para nuestra aplicación pero en cuanto a cómo son manejados algunos archivos, por ejemplo el archivo pipeline.js define en qué orden deberán ser compilados nuestros js, css y plantillas para luego ser enlazados y servidos por las vistas en nuestra aplicación.

Adicionalmente en este directorio tenemos algunas funciones bastantes útiles como un archivo que se encarga de realizar el proceso de minificado a nuestros css e incluso uno que utiliza CoffeeScript para compilar código JavaScript.

Views


Por último tenemos nuestras vistas, las cuales no son más que plantillas que son compiladas en el servidor y son servidas como páginas HTML, donde la mayoría de las veces estas vistas son el resultado de una petición HTTP para servir la misma.

Ya habiéndonos familiarizados un poco más con nuestro framework y los archivos que tenemos a disposición, vamos a continuar con el caso práctico de este tutorial y así demostrar el poder y la versatilidad de Sails.js.

Creando un API REST


Ya con nuestra aplicación creada vamos utilizar la misma para generar un API REST, para ello verificamos que no tengamos nuestro servidor ejecutándose todavía, si es así lo paramos con CTRL + C. Luego nos posicionamos dentro de nuestra aplicación y ejecutamos el siguiente comando:
sails generate api usuario
Con lo cual la consola nos responderá con un mensaje de éxito sobre nuestro nuevo api creado, lo cual adicionalmente nos generará dos nuevos archivos relacionados a este proceso, un modelo y por supuesto un controlador.



Ahora que hemos hecho esto nos preguntamos: ¿Qué hacemos ahora? Aunque puede parecer difícil de creer hemos generado un CRUD básico, solo nos falta probarlo, para ello levantamos nuestro servicio de nuevo con sails lift y nos dirigimos a la dirección que suministramos anteriormente, pero esta vez vamos a acceder a nuestro ruta usuario, veamos:


primeros-pasos-sailsjs-6.jpg


Como podemos ver no tenemos ningún usuario, situación que podemos cambiar rápidamente, Sails.js nos permite crear los valores que necesitamos directamente desde el navegador, para ello colocamos lo siguiente:
http://localhost:1337/usuario/create?name=Jonathan Acosta
Esta acción nos creará nuestro primer usuario en la aplicación, si nos fijamos debemos definir el atributo a incluir utilizando esa notación ya que la misma procesa esos valores como un JSON, veamos la respuesta de Sails cuando ejecutamos esta URL en nuestro navegador:


primeros-pasos-sailsjs-7.jpg


Agregamos unos usuarios más, pero nos damos cuenta que escribimos un nombre mal, no hay ningún problema podemos modificarlo, para ello colocamos lo siguiente en nuestra URL y el valor será actualizado sin ningún problema:
http://localhost:1337/usuario/update/5?name=Manuel%20Perez
Como vemos no varía mucho de nuestra operación anterior, lo que es importante destacar es que necesitamos enviar el ID del usuario y el nuevo valor del atributo a modificar, con lo cual Sails nos responderá de la siguiente forma:


primeros-pasos-sailsjs-8.jpg



Adicionalmente si algunos de los registros que hemos introducido decidimos que ya no es de utilidad para nuestra aplicación podemos eliminarlo sin problema, para ello solo hacemos lo siguiente:
http://localhost:1337/usuario/destroy/5
Consultamos nuestros usuarios y vemos como nuestro usuario con el ID 5 ya no existe:


primeros-pasos-sailsjs-9.jpg



Esto que acabamos de hacer son denominados atajos o shortcuts, para efectos de este tutorial y aplicaciones que no estén en producción podemos hacerlo de esta manera, sin embargo es recomendable que se desactiven los mismos por seguridad, para ello nos dirigimos a nuestro archivo blueprints.js y buscamos la opción shortcuts y le asignamos el valor false. Con esto al tratar de usar create, update o destroy por la URL nos dará una página de error 404:




Con esto finalizamos este tutorial, donde apenas vimos la punta del iceberg de Sails.js, un framework potente y versátil que nos permite construir aplicaciones en cuestión de segundos dándonos el control total sobre nuestra aplicación logrando resultados óptimos y profesionales.

¿Te ayudó este Tutorial?


Sin comentarios, sé el primero!

No esperes más y entra en Solvetic
Deja tus comentarios y aprovecha las ventajas de la cuenta de usuario ¡Únete!

X