fcbk
Conéctate con TwitterConéctate con Facebook
0

Anatomía de una App en SailsJS

0Puntos

hace 2 años

Ahora que ya sabes cómo crear una aplicación con SailsJS, es momento de explorar su estructura y componentes. Para trabajar de forma efectiva con este framework es importante familiarizarnos con todo esto. Y este artículo te ayudará a lograrlo. SailsJS se basa en el principio de Convención sobre Configuración. Y logra cumplirlo pre-instalando un conjunto de aplicaciones recomendadas con una estructura de archivos similar a la que vemos en Django. Además, añade las configuraciones básicas. De esta manera, logramos tener todo lo necesario para iniciar a trabajar mucho mas rápido y siguiendo estándares probados. Un punto importante de SailsJS es su arquitectura MVC para backend:
  • Modelo: los usamos para conectarnos a la base de datos de nuestra preferencia usando el ORMWaterline. Estos adaptadores nos permiten usar bases de datos relacionales o no relacionales (el mas usado es MongoDB). Si tenemos varios modelos, es posible mezclar varios tipos de bases de datos en un mismo proyecto.
  • Vista: usando templates de Embedded Javascript (.ejs). Este es similar a lo usado en Django, Rails o PHP y nos permite importar templates de varios archivos.
  • Controladores: funcionan usando Express, que nos permite simplificar el enrutamiento de los archivos estáticos y las APIs.
Al iniciar nuestra aplicación de SailsJS se creará una carpeta inicial con los archivos necesarios. Entre ellos:
  • package.json: aquí se guarda la configuración de npm. Te recomiendo editarlo para incluir el autor, la licencia y la dirección a tu repositorio en Github.
  • README.md: lo ideal es editar este archivo e inlcuir la descripción e instrucciones para las personas de tu equipo que trabajen con tu aplicación.
  • app.js: le dice a NodeJS cómo iniciar tu archivo. Generalmente no es necesario editarlo.
  • Gruntfile.js: SailsJS usa Grunt para mantener actualizado su árbol de dependencias. Generalmente no es necesario editarlo.
Adicionalmente, se crean varias carpetas. Estas secciones nos permiten enfocarnos en puntos específicos de nuestro desarrollo y mantener todo de forma ordenada. De esta manera, será mucho más fácil integrar nuevos miembros mas adelante.

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. Esta, a su vez, contiene lo siguiente:
  1. Controllers: archivos de Javascript que contienen la lógica para interactuar con los modelos y renderizar la visualización de forma adecuada.
  2. Models: estructuras que almacenan los datos de tu aplicación.
  3. Policies: middleware de Express que se encarga de controlar la seguridad de los Controladores.
  4. Responses: aquí almacenamos la lógica que generan las respuestas del servidor.
  5. Services: archivos JavaScript similares a los controladores. No generan, necesariamente, una respuesta inmediata al cliente o simplemente, no tienen comunicación directa con él. Son muy útiles para crear tareas o servicios asíncronos. Por ejemplo, procesos lentos cuya respuesta es enviada al cliente vía websocket o email.

assets

Aquí almacenaremos los archivos estáticos de nuestro proyecto. El favicon y el robots.txt los encontramos en la raíz del directorio. El resto los agrupamos así:
  1. images: almacena nuestros assets visuales. Por ejemplo, transparencias .svg, .webp o .png. Así como imágenes .jpg, y otras más.
  2. js: aquí colocamos los archivos Javascript para el cliente. Las librerías, por ejemplo.
  3. styles: aquí puedes colocar tus archivos CSS. Para mejores resultados, te recomiendo usar un precompilador como stylus. De este modo, puedes hacer tu código modular y crear automáticamente un CSS para producción con compresión y vendor prefixes.
  4. templates: para almacenar los HTML y JST de nuestra aplicación.

config

En esta sección viven todos los archivos Javascript y folders que nos permiten personalizar nuestra aplicación de SailsJS. Observamos dos carpetas:
  1. env: guarda las llaves, claves y contraseñas que necesitamos para conectarnos a las bases de datos y APIs remotas. Las clasifica en:
    • development.js para el modo de desarrollo
    • production.js para el modo de producción
  2. locales: aquí encontraremos los archivos JSON que se usan como diccionario para internacionalizar nuestra aplicación. De esta manera, podemos agregar nuevos idiomas con menos esfuerzo y sin perder tiempo.
Y los siguientes archivos:
  1. local.js: define el puerto y el modo de desarrollo de nuestra aplicación (desarrollo o producción).
  2. cors.js: aquí manejamos la forma en que nuestro servidor manejara las solicitudes CORS. Esto nos ofrece una forma moderna y segura de comunicarnos con datos externos. Es mas segura que JSONP porque nos permite especificar procedimientos para solicitudes GET, PUT, POST o DELETE.
  3. csrf.js: controla la seguridad con tokens CSRF. Estos nos permiten confirmar que las solicitudes que no son de tipo GET provengan exclusivamente desde nuestro servidor; evitando que otros sitios consuman nuestros servicios.
  4. blueprints.js: nos premite definir fácilmente APIs para interactuar con nuestros modelos.
  5. globals.js: aquí definimos las variables globales de nuestra aplicación.
  6. http.js: especifica detalles de nuestro servidor HTTP. Especialmente el middleware y la administración de la caché.
  7. i18n.js: la lista de idiomas que soporta nuestra aplicación.
  8. bootstrap.js: se ejecuta justo antes de "levantar" nuestra aplicación con el comando lift. Este nos sirve para definir tareas que necesitamos se ejecuten antes de levantar el servidor.
  9. connections.js: aquí especificamos los ajustes que necesitan nuestros adaptadores. Básicamente son intermediarios entre nuestra aplicación y las bases de datos. Esto nos facilita administrar las conexiones a distintas bases de datos.
  10. log.js: nos permite confugurar el nivel de logging de nuestra aplicación. En otras palabras, el nivel de detalle que deseamos registrar sobre los eventos en nuestra aplicación.
  11. models.js : con este archivo podemos manejar las conexiones por default que serán incluidas en todos nuestros modelos.
  12. policies.js: nos permite definir políticas de seguridad para nuestros controladores.
  13. routes.js: en este archivo configuramos la relación entre las rutas de nuestra aplicación y los recursos. Esto se hace, generalmente, después de que se cumplan las políticas de seguridad para los recursos solicitados.
  14. sessions.js: nos permite guardar los datos de sesión de cada usuario y aplicarlos en Express y en Socket.IO.
  15. sockets.js: lo usamos para personalizar la forma en que nuestro backend se comunica con el usuario por medio de Socket.IO.
  16. views.js: aquí podemos personalizar el motor que deseamos usar para definir los templates HTML que serán usados para la visualización de nuestra aplicación. Por ejemplo ejs, jade, underscore y muchos más.

tasks

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

views

En esta carpeta almacenamos nuestras vistas personalizadas; generalmente en formato .ejs. Y aunque todo esto puede parecer complejo, en la práctica te será mucho más fácil identificar estos elementos uno a uno. Si quieres saber más de cómo crear aplicaciones utilizando este framework, Mike McNeil, creador de SailsJS, dio un curso gratuito de NodeJS y SailsJS en Platzi (en inglés) en el que podrás aprender a crear apps desde cero usando estas tecnologías.
Cesar
Cesar
@reicek

0Puntos

hace 2 años