Introducción a Sails.js



Introducción

Para los amantes del Javascript, hoy SailsJS nos ofrece un framework Realtime MVC para backends modernos y se muestra como una alternativa muy interesante a django.



Es notable como cada día tenemos opciones más robustas para generar aplicaciones usando Javascript, lenguaje que a la fecha ha sido adoptado por un gran número de desarrolladores.

Sails es un framework Javascript diseñado para parecerse a la arquitectura MVC de framework como Ruby on Rails. Esto hace que el proceso de construcción de aplicaciones Node.js sea más sencillas, especialmente APIs, aplicaciones de una sola página y características en tiempo real, como el chat.

SailsJS, entre otras cosas, nos facilita en gran medida el desarrollo de APIs REST, servidores de archivos, seguridad y websockets.

Está creado con la filosofía "Convención sobre Configuración" o CoC, por sus siglas en inglés; esto significa que nos permite enfocarnos en el desarrollo de la idea, ahorrándonos mucho tiempo en configuración inicial y es un complemento ideal para frameworks como AngularJS, BackboneJS o ReactJS.

Esto se logra gracias a que SailsJS sigue un conjunto cuidadosamente selecto de convenciones modernas, automatizando una gran parte del proceso de desarrollo.

Un aspecto interesante es lo relativamente cómodo que resulta para casi cualquier programador el adoptar esta tecnología.

Quienes hayan trabajado con Laravel, CodeIgniter, Django o Rails serán capaces de identificar elementos en SailsJS que les proporcionarán un entorno familiar pero con nuevas posibilidades.

Otra convención importante que sigue SailsJS es el "loose Coupling," lo cual quiere decir que los componentes son opcionales, por lo que puedes agregar, quitar o cambiar elementos con relativa facilidad, el secreto está en crear componentes diseñados para integrarse al proceso de nuestra aplicación, pero que su ausencia no detenga el funcionamiento de la misma, en otras palabras, SailsJS se enfoca en el uso de micro-servicios.

A diferencia de hace unos años, hoy ya damos por comprobado que no existen realmente las soluciones universales, cada proyecto tiene necesidades muy específicas y, lo que es más importante, estas necesidades cambian con el tiempo y el presupuesto, además la escala y complejidad van aumentando; SailsJS nos da la opción de poder cambiar los componentes cuando sea necesario de forma eficiente.

SailsJS posee un conjunto de herramientas llamadas "blueprints" que nos ayuda a configurar rápidamente nuestro backend. Otra gran ventaja es que este framework corre en los principales Sistemas Operativos, tienen métodos oficiales para instalarlo en Mac OSX, Linux y Windows.

Por si no ha quedado claro, podeis ver el siguiente video sobre Introducción a Sails.js.


Instalación

Para instalar Sails, es bastante simple. Los requisitos son tener Node.js instalado y también la NPM, que viene con Node. Entonces uno debe emitir el siguiente comando en el terminal:

sudo npm install sails -g

1.) Crear un Nuevo Projecto

Con el fin de crear un nuevo proyecto de Sails, se utiliza el siguiente comando:

sails new myProject

Sails generará una nueva carpeta con el nombre del proyecto y añadirá todos los archivos necesarios para tener una aplicación básica construida. Para ver lo que se ha generado, acaba de obtener en la carpeta del proyecto y ejecutar el servidor Sails emitiendo el siguiente comando en el terminal:

sails lift

Sails usa por defecto el puerto 1337, por lo que si visita http://localhost:1337 debe obtener la página index.html por defecto de Sails.

Ahora, vamos a echar un vistazo a lo que Sails genera para nosotros. En nuestra carpeta de mi proyecto se han creado los siguientes archivos y subcarpetas:


La carpeta api

En esta sección almacenamos la mayor parte de la lógica de nuestro backend, el Modelo y el Controlador son definidos por los contenidos de esta carpeta y esta a su vez contiene la siguientes carpetas:


La carpeta assets

La carpeta de activos contiene subdirectorios para los archivos JavaScript y CSS que deben ser cargados en tiempo de ejecución. Este es el mejor lugar para almacenar bibliotecas auxiliares utilizados por la aplicación.

Sección en la que vamos a colocar los archivos estáticos de nuestro proyecto; el favicon y el robots.txt los encontramos en la raíz del directorio y el resto los agrupamos en estas carpetas:

Tan solo debe añadir sus archivos javasctipt y css y cuando lance el servidor, sails se encargará de añadirlos al fichero layout.ejs. Sin embargo, homepage.ejs es la página que se inicia por defecto al lanzar el servidor. Más adelante veremos como cambiar la página inicial a layout.ejs.


La carpeta config

Esta es una de las carpetas importantes. Sails está diseñado para ser flexible. Asume algunas convenciones estándar, sino que también permite al desarrollador cambiar la forma de que sails configura la aplicación creada para adaptarse a las necesidades del proyecto. La siguiente es una lista de los archivos de configuración presentes en la carpeta config:

La documentación sails.js contiene información detallada sobre cada una de estas carpetas.


Carpeta node_modules

Aquí se carga todas las dependencias que tengamos en el fichero package.json.

Si intalamos una nueva dependencia que queramos utilizar como fs (para leer/escribir ficheros) deberemos ponernos en el path donde ejecutamos sails lift y hacemos lo siguiente:

npm install fs --save

Si alguna vez borramos la carpeta node_modules tendremos que volver a instalar todo de la siguiente manera:

npm install

Carpeta tasks

Se usa para guardar tareas y configuraciónes de Grunt.


La carpeta views

Las vistas de la aplicación se almacenan en esta carpeta. En cuanto a su contenido, nos damos cuenta de que las opiniones se generan por defecto como (JavaScript incrustado) EJS. Además, la carpeta contiene vistas para el manejo de errores (404 y 500) y también el archivo de diseño (layout.ejs) y los puntos de vista para el controlador de la casa, que se genera mediante Sails.

Cuando creamos un nuevo controlador,por ejemplo UserController, aqui creamos una carpeta con el mismo nombre del modelo, user; y dentro las diferentes vistas como index.ejs, show.ejs, edit.ejs, destroy.ejs, associations.ejs, etc... Y dentro de cada uno de las vistas, introducimos el html y lenguaje para cargar información de la base de datos.



Para cambiar la vista con la que arranquemos nuestro servidor deberemos ir a la carpeta config/routes.js y en el código, donde pone view: 'homepage' por view: 'layout'.


2.) Configurar la Aplicacion

Hasta ahora hemos creado nuestra aplicación y eche un vistazo a lo que se genera por defecto, ahora es el momento de configurar la aplicación para que se ajuste a nuestras necesidades.

General Settings

Configuración general se almacenan en el archivo config/application.js. Las opciones configurables para la aplicación son:

Note que al utilizar el entorno de aplicación para la producción, hace que el paquete Sails y minify el CSS y JS, que puede hacer que sea más difícil de depurar.

Routes

Las rutas de aplicación se definen en el archivo config/routes.js. Como era de esperar, este archivo será con el que lo más a menudo trabajaremos para agregar nuevos controladores a la aplicación.

Las rutas se exportan como se muestra más adelante, en el fichero de configuración:


    module.exports.routes = {
      // route to index page of the home controller
      '/': {
        controller: 'home'
      },
     
      // route to the auth controller, login action
      '/login': {
        controller: 'auth',
        action: 'login'
      },
     
      // route to blog controller, add action to add a post to a blog
      // note that we use also the HTTP method/verb before the path
      'post /blog/add': {
        controller: 'blog',
        action: 'add_post'
      },
     
      // route to get the first blog post. The find action will return
      // the database row containing the desired information
      '/blog/:item': {
        controller: blog,
        action: find
      }
    }
    

Views

En cuanto a las vistas, las opciones configurables son el motor de la plantilla que se utilizará y si un diseño debe o no ser utilizado, para las vistas.

Models

Los modelos son una representación de los datos de aplicación almacenados en una base de datos. Los modelos se definen mediante atributos y asociaciones. Por ejemplo, la definición de un modelo de persona podría tener este aspecto:

    // Person.js
    var Person = {
      name: 'STRING',
      age: 'INTEGER',
      birthDate: 'DATE',
      phoneNumber: 'STRING',
      emailAddress: 'STRING'
    };
    exports = Person;
    

La comunicación con la base de datos subyacente se realiza a través de adaptadores. Los adaptadores se definen en api/adapters y se configuran en el archivo adapters.js. En el momento de escribir este artículo, Sails viene con tres adaptadores: memory, disk y mysql, pero puede escribir su propio adaptador (consulte la documentación para más detalles).

Una vez que se ha definido un modelo, puede operar en él mediante la creación de registros, la búsqueda de los registros, la actualización y la destrucción de los registros.

Controllers

Los controladores se colocan en api/controllers. Un controlador se ha creado usando el siguiente comando:

sails generate controller comment

Este comando generará un objeto CommentController. Las acciones se definen dentro de este objeto. Las acciones también se pueden generar cuando se emite el comando generar controlador:

sails generate controller comment create destroy tag like

Esto creará un controlador Comment con acciones para crear, destruir, etiqueta y les gusta.

Las acciones reciben como parámetros la solicitud y los objetos de respuesta, que pueden ser utilizados para obtener parámetros de la URL (el objeto de solicitud) o la salida en la vista (utilizando el objeto respuesta).

Para comunicarse con el modelo, se utiliza la devolución de llamada de la acción apropiada. Por ejemplo, en el caso de la consulta de una base de datos con hallazgo, el siguiente patrón se utiliza para manipular el modelo:

    Blog.find(id).done(err, blog) {
      // blog is the database record with the specified id
      console.log(blog.content);
    }
    

Views

Las Vistas se utilizan para manejar la interfaz de usuario de la aplicación. Por defecto, las vistas son manejados usando EJS, pero se pueden utilizar cualquier otra plantilla de otra biblioteca. Cómo configurar los puntos de vista se discutió previamente en el capítulo Configuración.

Las vistas se definen en el directorio /views y las plantillas se definen en la carpeta /assests/templates.

Existen principalmente cuatro tipos de vistas:

Server-Side Views

Su trabajo consiste en mostrar los datos cuando una vista es solicitado por el cliente. Por lo general, la revisión método corresponde a un cliente con la vista apropiada. Pero si no existe ningún controlador o acción por una solicitud, Sails servirá a la vista de la siguiente manera: /views/:controller/:action.ejs.

The Layout View

El diseño se puede encontrar en /views/layout.ejs.

Se utiliza para cargar los activos de aplicaciones, tales como hojas de estilo y bibliotecas JavaScript.

Echa un vistazo al archivo especificado:

    !DOCTYPE html>
    html>
      head>
        title><%- title %>
  
        !-- Viewport mobile tag for sensible mobile support -->
        meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
     
        !-- JavaScript and stylesheets from your public folder are included here -->
        <%- assets.css() %>
        <%- assets.js() %>
      /head>
     
      body>
        <%- body %>
     
        !-- Templates from your view path are included here -->
        <%- assets.templateLibrary() %>
      /body>
    /html>
    

La líneas assets.css() y assets.js() cargan el CSS y JS de los activos de su aplicación y la assets.templateLibrary carga las plantillas del cliente.

Client-Side Templates

Estos se define en /assets/templates y se cargan como vimos anteriormente.

Routes

Ya discutimos cómo configurar rutas en el capítulo Configuración.

Hay varias convenciones que Sails sigue cuando las rutas se manejan: