Portada » Informática » Fundamentos del Desarrollo Web Moderno: SaaS, Arquitectura MVC y Despliegue
El proceso de construcción de aplicaciones web se basa en:
El servidor web escucha peticiones y determina qué rutas son conocidas y se procesarán y cuáles no.
Consiste básicamente en decir al ordenador qué debe hacer para cada ruta/petición.
Rails ofrece un desarrollo guiado: indica los siguientes pasos a seguir o soluciones para la corrección de errores si los hubiera.
El flujo de desarrollo en Rails se centra en:
En el mundo del diseñador web, este debe construir una interfaz para la interacción del usuario con las plataformas de Internet a través de HTML5, CSS3 y JavaScript.
Debe conocer cómo funciona el Servidor Web, donde se reciben las peticiones y se pregunta a la capa lógica para luego dispensar de vuelta las peticiones. Debe también saber cómo funciona la Capa Lógica porque es donde se escribe el código para programar la aplicación, quien conecta la capa de presentación con la de persistencia (middleware) y que en ella se alojan los controladores, las plantillas y los modelos.
Contiene toda la información para saber cómo se va a almacenar y operar. Almacena, cambia y opera entidades y conecta con la capa de persistencia. El modelo es todo aquello encapsulado en un elemento que guarda la información y la posibilidad de manipulación de los objetos (tablas). El modelo contiene la forma para poder introducir datos a la base de datos. Sobre cada modelo que se define se pueden realizar las acciones CRUD (Create, Read, Update, Delete).
Define qué acciones se permiten realizar al usuario.
Se encarga de la interacción y visibilidad. Un modelo puede tener varias vistas, pero cada vista se corresponde con una acción/controlador. En Vistas es donde se diseña la interfaz de usuario de la aplicación. Aquí tendría el diseñador web su lugar de trabajo. La generación o composición de la vista en Rails utiliza el concepto de layout para tratar el contenido estático y el de views para generar el contenido dinámico, insertándolo en los layouts donde aparece el comando yield
.
Una vez configuradas las rutas, los controladores y las acciones asociadas, es necesario construir una respuesta utilizando el sistema de plantillas que ofrece Rails.
Rails ofrece un sistema de plantillas muy completo que hace muy simple este proceso. Cada acción del controlador conduce a un fichero de vista (view) asociado a cada entidad. Así, si estamos trabajando con cualquier entidad, existirá habitualmente una vista (view) para cada una de las acciones declaradas en el controlador. Rails permite que nos concentremos únicamente en la respuesta de cada acción si trabajamos en el contenido que ofrece cada vista.
En el Servidor Web (capa de presentación) se definen las rutas y en el servidor de aplicaciones (capa lógica) se definen las acciones para el acceso a las BBDD y la generación de plantillas de HTML y CSS u otro lenguaje de programación. En la capa de persistencia debe conocer Active Record para operar con los objetos y las BBDD.
El programador hace programas como Photoshop. El desarrollador resuelve problemas para cumplir objetivos. Este se ocupa del HTML y el Javascript para mejorar la interacción del usuario.
Aquí se introduce el código para que tu aplicación haga lo que tú quieres que haga. También realiza la función de poner en contacto a la capa de presentación o servidor web con la capa de persistencia o BBDD, por ello se llama Middleware.
Es responsabilidad del Middleware gestionar los modelos, los controladores y las vistas. Esta capa también es la que accede y extrae la información alojada en la capa de persistencia. Las migraciones permiten independizarte de la base de datos elegida. Rails se encarga de traducir tu modelo de datos a la estructura requerida por cada base de datos concreta.
En programación, la persistencia es la acción de preservar la información de un objeto de forma permanente (guardado), pero a su vez también se refiere a poder recuperar la información del mismo (leerlo) para que pueda ser nuevamente utilizado.
De forma sencilla, puede entenderse que los datos tienen una duración efímera; desde el momento en que estos cambian de valor se considera que no hay persistencia de los mismos.
Vamos a introducir las diferencias que existen entre el entorno de desarrollo y el entorno de explotación o de producción de la aplicación. Por un lado, veremos cuál es la infraestructura necesaria y las opciones para desplegar la aplicación y, por otro lado, cómo un entorno de desarrollo como Rails nos ayuda también en esta tarea.
GitHub es un control de versión para la fase de desarrollo de la aplicación. Las operaciones habituales del control de versión son identificar los cambios que se realizan en el proyecto para poder gestionarlos y ponerlos a disposición de los demás colaboradores, coordinando el continuo desarrollo del proyecto.
El repositorio remoto también se usa como control de versión para gestionar los diversos cambios que hagan los diferentes miembros del equipo de desarrollo. Esta herramienta es muy útil porque así los demás componentes del equipo se pueden beneficiar de los cambios que haya hecho otro miembro del equipo, sin que se dupliquen competencias. Te puedes beneficiar de un repositorio remoto, pero no de uno local.
Heroku es un Platform as a Service (PaaS) para la fase de producción y despliegue de la aplicación. El paso de desarrollo a producción en Rails no exige cambiar el código de la aplicación, simplemente cambiar la configuración de los componentes (gemas) que se utilizarán en ambas etapas. No hay que instalar nada. La infraestructura la pone Heroku, ajustando la estructura en función de la demanda.
En la producción la arquitectura es diferente. Necesitamos un proveedor de servicios: Heroku es una herramienta y una plataforma para desplegar aplicaciones.
Nota: En producción no se puede utilizar sqlite3
, se utiliza Postgres
.
AJAX, acrónimo de Asynchronous JavaScript And XML (JavaScript asíncrono y XML), es una técnica de desarrollo web para crear aplicaciones interactivas. Estas aplicaciones se ejecutan en el cliente, es decir, en el navegador de los usuarios, mientras se mantiene la comunicación asíncrona con el servidor en segundo plano.
No se destruye el árbol DOM del navegador por completo; lo que hace es que con cada petición en segundo plano se añaden nodos al DOM. De esta forma es posible realizar cambios sobre las páginas sin necesidad de recargarlas, mejorando la interactividad, velocidad y usabilidad en las aplicaciones.
AJAX es una tecnología asíncrona, en el sentido de que los datos adicionales se solicitan al servidor y se cargan en segundo plano sin interferir con la visualización ni el comportamiento de la página, aunque existe la posibilidad de configurar las peticiones como síncronas, de tal forma que la interactividad de la página se detiene hasta la espera de la respuesta por parte del servidor.
JavaScript es un lenguaje de programación (scripting language) en el que normalmente se efectúan las funciones de llamada de AJAX. Este lenguaje modifica el árbol DOM para evitar saltos, que la pantalla se ponga en blanco. Es decir, permite modificar el comportamiento por defecto de HTML.
El motor AJAX permite que la interacción del usuario con la aplicación suceda asincrónicamente (independientemente de la comunicación con el servidor). Así, el usuario nunca estará mirando una ventana en blanco del navegador y un icono de reloj de arena esperando a que el servidor haga algo.
Con cada petición al servidor se destruye y se vuelve a construir el árbol DOM, restando interactividad y experiencia de usuario a la aplicación.
jQuery es una biblioteca de JavaScript, que se carga como una hoja de estilos, una diferente para cada navegador. Es un traductor de JavaScript para cada navegador. Permite simplificar la manera de interactuar con los documentos HTML, manipular el árbol DOM, manejar eventos, desarrollar animaciones y agregar interacción con la técnica AJAX a páginas web.