junio 4, 2014 AngularJSMEAN

Desarrollo de Aplicaciones Web Modernas – MEAN y AngularJS

Cuando tenemos que desarrollar una aplicación web tenemos que analizar muy bien la tecnología que vamos a utilizar y conocer si dicha tecnología nos va a permitir el desarrollo del proyecto de forma satisfactoria. Para desarrollar el proyecto exitosamente conviene que dicha tecnología nos proporcione ciertas características, tales como productividad, funcionalidad y escalabilidad, entre otras.

Hoy en día JavaScript es un lenguaje que nos proporciona un amplio abanico de posibilidades, y existen muchas herramientas dentro del entorno de JavaScript que nos permiten tener acceso a las características que previamente he mencionado y que nos ayudarán a que el desarrollo de nuestros proyectos sean exitosos.

En este artículo quiero analizar cuál creo yo que es un stack muy interesante en el desarrollo de aplicaciones web y en el que AngularJS es el protagonista de cualquiera de las variantes del stack que analizaremos.

 

Front End

Aplicaciones web de escritorio

Como ya he comentado previamente, en el front-end uno de los framework que considero hoy en día más interesantes para el desarrollo de nuestras aplicaciones web es AngularJS. Aunque AngularJS nos permite desarrollar distintos tipos de aplicaciones, yo creo que es especialmente interesante para el desarrollo de aplicaciones que necesitan implementar acciones CRUD, en las que el acceso a bases de datos es imprescindible.

Las aplicaciones empresariales normalmente necesitan acceder a los datos almacenados en nuestras bases de datos, por lo que creo que AngularJS es un framework muy a tener en cuenta a la hora de desarrollar aplicaciones empresariales.

Aplicaciones móviles

En la parte del front-end existe otro framework muy interesante que debemos tener en cuenta, Ionic, que nos permite desarrollar aplicaciones móviles híbridas. Personalmente considero que una de las características más importantes de Ionic es que este framework se basa en AngularJS, por lo que gran parte del código de escribamos para nuestra aplicación de escritorio vamos a poder utilizarlo para nuestra aplicación móvil, con lo que conseguimos un importante ahorro en coste de desarrollo.

Además, Ionic se basa en PhoneGap, con lo que vamos a poder distribuir fácilmente nuestra aplicación móvil para los distintos sistemas operativos móviles existentes actualmente en el mercado.

 

Back End

En la parte del back-end tenemos varias opciones muy interesantes, las cuales podemos agruparlas principalmente en dos grupos: el back-end alojado en la nube y el back-end alojado en nuestros propios servidores.

Back-end en la nube

Hay varias plataformas que nos permiten definir de forma muy sencilla nuestros modelos de datos en sus servidores y acceder a ellos, o bien a través de un SDK específico, o  bien a través de un API REST.

Las dos plataformas que yo destacaría en este sentido son Parse y Firebase, las cuales pueden probarse de forma gratuita indefinidamente, aunque con recursos limitados. Ambas plataformas incluyen SDKs para iOS, Android y JavaScript, entre otros.

Firebase, además incluye un SDK específico para AngularJS y, de forma nativa, nos ofrece la capacidad de desarrollar aplicaciones en tiempo real. De esta forma podemos definir eventos para que cuando se agreguen, modifiquen o eliminen datos de nuestras colecciones, automáticamente Firebase informe en tiempo real de estos eventos a todos nuestros clientes.

Si finalmente decidimos tener nuestro back-end en la nube, al desarrollar nuestros proyectos vamos a centrarnos principalmente en desarrollar el font-end, ya que en el back-end únicamente vamos a tener que definir nuestro modelo de datos y no vamos a tener que programar prácticamente nada.

 

On-premises Back-end

La otra opción que tenemos disponible es que nuestro back-end se ejecute en nuestros propios servidores. Dentro de esta opción tenemos varias alternativas, existiendo framewoks open source que nos ayudarán a desarrollar nuestro propio back-end.

Hay varios frameworks o soluciones que me gustaría destacar, aunque al final es el equipo de desarrollo el que en función de sus preferencias se decante por uno u otro: SailsJS, Synth, LoopBack, Restify, Deployd y MeanJS. Otra opción es desarrollar nuestro back-end de forma propietaria, con NodeJS + Express, por ejemplo, o mediante cualquier otra plataforma o lenguaje de programación.

La mayoría de estos frameworks te permiten definir un API de forma muy sencilla y en muy poco tiempo con lo que, una vez definido nuestro API, nuestra principal tarea será centrarnos en el desarrollo de nuestro front-end.

 

Conclusión

El desarrollo de aplicaciones web y aplicaciones móviles puede resultar complicado, sin embargo, si escogemos las herramientas adecuadas podemos conseguir reducir la complejidad, así como aumentar nuestra productividad.

En este artículo he pretendido analizar un stack, con ciertas variantes, que considero muy interesante y que nos proporciona una gran ayuda en el desarrollo de nuestros proyectos web y móviles.

Hoy en día considero que una de las herramientas más interesantes para desarrollar la parte del front-end es AngularJS, e Ionic para la parte móvil. Para el desarrollo del back-end me decantaría por Firebase si no es necesario tener nuestros datos en servidores propios; y por SailsJS, LoopBack o MeanJS si los datos los tenemos que almacenar en nuestros propios servidores.

En siguientes artículos explicaré cómo desarrollar aplicaciones web y móviles con las herramientas analizadas en este artículo.

 

  1. […] el anterior post analizamos un stack que hoy en día considero muy interesante para el desarrollo de aplicaciones […]

  2. Stevenson Niño dice:

    Me gustaría continuar con tus conocimientos. Gracias.

  3. jl_monteagudo dice:

    Hola,

    Esta semana intentaré sacar un poquito de tiempo para continuar publicando más posts.

    Saludos!!

  4. Miguelon dice:

    Gracias por compartir sus conocimientos en forma excelente.

    En el módulo “DESAROLLO DE UN API REST CON SAILS.JS”, cuándo y/o con qué comándos se crean las tablas en la DB.
    Utilizo Postgres todo sale correcto, pero, no se crean las tablas en la DB PG.

    Gracias.

  5. Miguelon dice:

    Gracias José Luis.

    Por favor, me puedes ayudar, con un script sería lo ideal, sobre como debo hacer para crear las tablas en la DB. Yo utilizo PostgreSal.

    Gracias por compartir tus conocimientos y la forma excelente de trasmitir.

    Saludos.

    Miguel
    Quito.- Ecuador
    “La Mitad del Mundo”

  6. Miguelon dice:

    Con disculpas, agrego al comentario anteior:

    Estoy en ambiente SAILS, siguiendo tu blog.

    Saludos.

    Miguel
    Quito.- Ecuador
    “La Mitad del Mundo”

  7. jl_monteagudo dice:

    Hola Miguel,

    Te comento como lo hago para MySQL. Para PostgreSQL el procedimiento es similar, pero instalando el adaptador de PostgreSQL en lugar del adaptador de MySQL.

    En este post puedes ver cómo crear una aplicación Sails desde cero: http://www.jlmonteagudo.com/2014/06/desarollo-de-un-api-rest-con-sails-js/

    Ejecutamos las siguientes instrucciones:

    npm install sails -g
    sails generate new MyApi –no-front-end
    cd MyApi
    npm install
    sails generate api message

    Hasta aquí tenemos la aplicación configurada por defecto y con el API message. A continuación configuramos MySQL:

    – Creamos una base de datos en MySQL y un usuario con permisos para manipular esa base de datos.
    – Instalamos el adaptador para MySQL: npm install sails-mysql (más info: https://github.com/balderdashy/sails-mysql)
    – Configuramos en Sails la conexión a nuestra base de datos, modificando el fichero config/connections.js:

    someMysqlServer: {
    adapter: ‘sails-mysql’,
    host: ‘localhost’,
    user: ‘Tu Usuario’,
    password: ‘Tu Password’,
    database: ‘messages’
    },

    – Modificamos el fichero config/models.js para que por defecto utilice la conexión que hemos creado:

    module.exports.models = {
    connection: ‘someMysqlServer’,
    migrate: ‘alter’
    };

    Sails utiliza el ORM Waterline y la propiedad migrate es la que define cómo quieres que Waterline actualice la estructura de tu base de datos. Si asignas ‘save’ a migrate entonces Waterline nunca actualizará la estructura de tu base de datos. Si asignas ‘alter’ entonces Waterlina actualiza la estructura y mantiene los datos existentes. Si asignas ‘drop’ cada vez que inicies la aplicación Waterline recrea tu base de datos y borra todos los registros. Más información sobre migrate: http://sailsjs.org/#/documentation/concepts/ORM/model-settings.html

    Espero haberte ayudado.

    Saludos,

    JL Monteagudo

  8. Muy buenas Tardes JL Monteagudo estoy muy interesado en tus tutoriales de la aplicacion node-sales-order-processing son muy explicativos, y quisiera saber si pudieras continuar con los videos hasta terminar con la aplicacion..

    Gracias…

  9. Miguel Angel dice:

    Hola Jose Luis.

    Un pregunta que quizás podría dar para un post.

    He visto que desarrolladores experimentados usan wordpress para sus start ups o para sus blogs.
    ¿ En qué circunstancias aconsejarías un mean stack y en cuáles wordpress ?
    ¿ Cuáles son las limitaciones con las que uno se puede encontrar desarrollando con wordpress ?

    Muchas gracias.

  10. jl_monteagudo dice:

    Hola Miguel Angel,

    Si vas a hacer una aplicación en la que tienes que publicar contenido, sin duda yo utilizaría WordPress con alguno de sus múltiples plugins. Hay una cantidad enorme de plugins para WordPress que te permiten construir sitios web de muy diversa índole (portales de empleo, tablón de anuncios, tiendas online, foros, etc. ). Además, WordPress está muy optimizado para el SEO, por lo que si la aplicación que desarrolles requiere ser indexada por buscadores, éste es un punto importante a tener en cuenta.

    Sin embargo, si tienes que realizar una aplicación a medida, es posible que WordPress no se te adapte, con lo que vas a tener que programar tu aplicación con el sistema o stack que creas más conveniente (no necesariamente MEAN). Por poner un ejemplo, piensa en cualquier módulo de un ERP; el módulo de ventas, el de compras, contabilidad, gestión de inventario, estadísticas de cualquiera de los módulos anteriores, etc. Si tienes que desarrollar este tipo de aplicaciones, WordPress no va a ser un buen candidato. Vas a tener que escoger un stack con el cual desarrollar tu aplicación.

    Otro ejemplo concreto de aplicación para la que conviene utilizar un stack en lugar de WordPress, sería https://slack.com/ Se trata de una aplicación web colaborativa, en la que creas grupos de personas dentro de una empresa y estos grupos interactúan en tiempo real. Es una aplicación con unos requisitos muy específicos y que están muy alejados del modelo utilizado por WordPress, con lo que se va a tener que hacer un desarrollo a medida.

    Antes de comenzar a desarrollar un proyecto nuevo, hay que buscar si ya existe algo similar en el mercado (no tiene por qué ser un plugin para WordPress, puede ser cualquier otro tipo de software) para valorar si se adapta a las necesidades del cliente y decidir si es conveniente utilizar el software existente o realizar una aplicación a medida.

    Esta es mi opinión personal y en lo que yo me basaría al desarrollar un nuevo sitio web o una nueva aplicación web.

  11. Mauricio dice:

    Hola.
    Tengo diseñado el módulo de ventas de un ERP con mysql workbench.

    1.- Sabes si MEAN STACK, puede trabajar con mysql.
    2.- Conoces alguna herramienta como mysqlworkbench para mongodb.

    Saludos cordiales.

  12. jl_monteagudo dice:

    Buenas,

    Con NodeJS sí puedes cualquier base de datos. Dejaría de ser un stack MEAN porque, como sabes, MEAN asume que utilizas Mongodb como base datos, aunque lo de las siglas es lo de menos.

    Por ponerte un ejemplo, con NodeJS podrías utilizar este ORM https://github.com/sequelize/sequelize y a utilizar otras base de datos distintas a Mongodb.

    Respecto a un homólogo a mysqlworkbench, aunque con muchas menos opciones, tienes varias alternativas:

    https://robomongo.org/
    http://mongobooster.com/
    http://rockmongo.com/

    Saludos,

    JL Monteagudo

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Back to top