Semana 2 - Desarrollo de Aplicaciones Web

¿Qué es una aplicación web?

Como los demás tipos de aplicaciones informáticas, una aplicación web cumple con un ciclo de vida. Este ciclo de vida se compone de:

  • Análisis
  • Wireframes
  • Diseño
  • Desarrollo
  • Despliegue
  • Mantenimiento



Modelo Tradicional

  • Capa de hardware
  • Sistema Operativo
  • Lenguajes de Programación
  • Aplicación


Modelos Web
Se enfoca en el navegador que ejecutará la aplicación y no en el hardware ni el sistema operativo.


Application Stack
Son los componentes que abarca una aplicación web. La unión de todos estos componentes da como producto una aplicación web funcional. Estos componentes son:

  • UX/UI
    • Wireframes
    • Photoshop
    • Sketch
    • Whiteboards and paper designs
  • Frontend
    • HTML
    • Javascript
    • CSS
  • Backend
    • Java
    • Node
    • Php
    • Ruby on rails
    • Python
    • .NET
  • Ops + Data
    • SQL




Roles en una Application Stack
  • UX/UI
    • UX designer
    • UI designer
    • Product designer
  • Frontend
    • Frontend engineer
    • Frontend developer
    • Junior developer
  • Backend
    • Backend engineer
    • Backend developer
    • Web developer
  • Ops + Data
    • Administradores de Bases de Datos
    • Administradores de Servers




Nuevas tecnologías de desarrollo

Javascript libraries:

  • backbone.js
  • jquery


Frontend frameworks

  • bootstrap
  • foundation
  • uikit
  • Semantic UI


Backend frameworks

  • ruby
  • angularJS
  • Meteor
  • Ember.js
  • Express
  • Django
  • ASP.net
  • Laravel
Para más información, visitar la página original: https://www.keycdn.com/blog/web-development-tools

Arquitectura cliente-servidor

Lado del cliente ---------------------- Lado del servidor
Frontend ------------------------------------ Backend





Criterios para escoger un stack de tecnología WEB...

  • Tipo de aplicación:
    • Simple
    • Mediana
    • Compleja
  • TTM: Time to market
    • Soluciones out-of-the-box
    • Integración de  soluciones de terceros
    • Disponibilidad de desarrolladores 
    • Documentación y comunidad de desarrollo 
    • Facilidad de testing
  • Escalabilidad
    • Horizontal
      • nuevos requerimientos
    • Vertical
      • nuevos componentes
  • Costo de desarrollo
    • Salarios de desarrolladores
    • Costo de mantenimiento de la aplicación
  • Seguridad
    • La mayoría de las tecnologías de desarrollo web tienen pautas de seguridad que indican los pasos para prevenir amenazas y minimizar las vulnerabilidades.

Herramientas para el desarrollo de frontend

HTML (HyperText Markup Language):
Lenguaje de marcado por etiquetas capaz de ser renderizado por un navegador.




CSS (Cascading Style Sheet):
Lenguaje creado para la edición y creación de estilos y diseños en una página web.


JavaScript:
Lenguaje estándar para la manipulación de elementos en el frontend.

Comentarios