Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Desarrollo Full Stack UAM.net

2,900 views

Published on

Slides de charla de desarrollo Full Stack impartida en la UAM el 17 de marzo de 2017

Published in: Software
  • Be the first to comment

Desarrollo Full Stack UAM.net

  1. 1. Desarrollo Full Stack Una visión personal y sesgada Roberto Luis Bisbé DotnetClub UAM 17 de Marzo de 2017
  2. 2. Acerca de • Ingeniero de Software en Amazon Business • Antiguo alumno de esta noble casa • II Presidente de UAM.net • Twitter: @rlbisbe • Blog: rlbisbe.net 2
  3. 3. Agenda • Motivación • Viaje personal • Bloques de construcción • Arquitecturas a la italiana 3
  4. 4. Motivación "Conocer detalles sobre el funcionamiento de las diferentes capas de un sistema nos permite tomar mejores decisiones que afectan al mismo" 4
  5. 5. Motivación "Conocer detalles sobre el funcionamiento de las diferentes capas de un sistema nos permite tomar mejores decisiones que afectan al mismo" Yo, al preparar esta charla 5
  6. 6. Motivación • "Saber optimizar una consulta nos permite mostrar solamente la información necesaria en la UI" • "Conocer cual es la representación de los datos en la UI nos permite modelar mejor nuestro dominio" • "Conocer diferentes tipos de almacenamiento de datos nos permite diseñar mejor nuesta API" 6
  7. 7. Pero esto no es nuevo • En la carrera estudiamos • Electrónica • Código binario • Álgebra de boole • Ensamblador • Sistemas operativos • Redes • Son "capas" de un stack 7
  8. 8. Enter the Stack "In computing, a solution stack or software stack is a set of [...] components needed to create a complete platform such that no additional software is needed to support applications. Applications are said to "run on" or "run on top of" the resulting platform." Un buen samaritano en Wikipedia 8
  9. 9. Full Stack Developer • "Alguien que puede meter la pata en todas las capas del código" • "Alguien familiarizado con cada capa, sin dominar ninguna y con un interés genuino en la tecnología.” 9
  10. 10. La industria los necesita • +4.000.000 de resultados en Google • +103.000 resultados de libros en Amazon • +34.000 resultados en LinkedIn • +100 ofertas de trabajo en StackOverflow Carreers 10
  11. 11. Mi viaje al Full Stack 11
  12. 12. 2008 – 2012 Stacks académicos A long time ago in a university so far 12
  13. 13. Stack 1 Acción Capa Entrada (Texto) Interfaz Código que hace cosas Lógica de negocio Salida (Texto) Interfaz 13
  14. 14. Stack 2 Acción Capa Entrada (HTTP) Interfaz Lógica de petición Controlador Ejecución de CGI en consola Lógica de negocio Recuperación de resultados Controlador Salida (HTTP) Interfaz 14
  15. 15. Stack 3 Acción Capa Entrada (HTTP) Interfaz Análisis de entrada Controlador Lógica del juego Lógica de negocio Comando o consulta en base de datos Datos Conversión de base de datos en lógica de aplicación Lógica de negocio Formato Controlador Salida (HTTP) Interfaz 15
  16. 16. 2012 - ? Stacks profesionales Snap back to reality, oh, there goes gravity! 16
  17. 17. Stack 1 Acción Capa • Línea de comandos • Aplicación escritorio • Dashboard (HTTP) Interfaz Análisis de entrada Controlador Comunicación con servidor Interfaz Lógica de aplicación Lógica de negocio Comando o consulta en base de datos Datos Conversión de base de datos en lógica de aplicación Lógica de negocio Respuesta de servidor Interfaz Análisis de salida Controlador • Línea de comandos • Aplicación escritorio • Dashboard Interfaz 17
  18. 18. Stack 2 Acción Capa Entrada: acciones dentro de un IDE Interfaz Análisis de entrada y limpieza Controlador Comunicación con servidor Interfaz Sincronización de estado Lógica de negocio Comunicación con clientes Interfaz Análisis de salida Controlador Salida: acciones sobre el IDE Interfaz 18
  19. 19. Lecciones aprendidas • Todo se puede expresar en capas • División semántica • Responsabilidad específica 19
  20. 20. Bloques de construcción 20
  21. 21. Desktop Stack • Ejecutable, aplicación de consola, daemon • APIs de la capa de gráficos • Compiz, Aero, Quartz • APIs del Sistema Operativo • Acceso a disco, registro, permisos • APIs de Hardware • (USB, Sensores integrados...) 21
  22. 22. Mobile Stack • Aplicación • Presentación • Lógica de negocio • Acceso a servicios • APIs del sistema operativo • Almacenamiento y caché • Comunicación con otras aplicaciones • Acceso a la red • APIs de hardware • Sensores 22
  23. 23. Web Stack • APIs del Navegador • Framework de aplicaciones web • Configuración y APIs del servidor web • Red, firewall, routing... • APIs del sistema operativo (real o virtualizado) 23
  24. 24. Web Stack, a alto nivel • Lógica de aplicación • que la app haga algo • Almacenamiento persistente • almacenar cosas • Búsqueda • recuperar lo que hemos almacenado • Caché • tener la información cuanto antes posible 24
  25. 25. Web Stack (Stack Overflow) • Lógica de aplicación • .NET Framework: C#, ASP.net MVC • Almacenamiento persistente • Relacional: SQL Server • Búsqueda • Elastic Search • Caché • Redis 25
  26. 26. Web Stack (LinkedIn) • Lógica de aplicación • Java • Almacenamiento persistente • No relacional, basado en documentos: Espresso • Búsqueda • Lucene • Caché • Producción propia: Voldemort 26
  27. 27. Stacks • Desktop • Mobile • Web • Hardware (IoT) 27
  28. 28. Arquitecturas "lasaña" Capa sobre capa 28
  29. 29. Arquitecturas "lasaña" • Presentación • Aplicación • Almacenamiento • Caché • Búsqueda 29
  30. 30. Capa de presentación • Web • HTML/CSS/JS • Escritorio • Winforms, Swing, Cocoa, GTK • Móvil • UIKit, Android XML, XAML • Línea de comandos • STDIN, Argumentos, logs 30
  31. 31. Capa de aplicación • .NET • C#, VB.net, F# • ASP.net, NancyFX • JVM • Java, Groovy, Scala, Kotlin • Spring, Play, Grails • Otros • Ruby, Python, JS, PHP • Rails, Django, Meteor, Symfony 31
  32. 32. Capa de almacenamiento (I) • Binarios • Imágenes, audio, vídeo, texturas • Logs • Especialmente crítico en sistemas de producción o asíncronos • Análisis con herramientas como Splunk • Ficheros de configuración • Ficheros INI, JSON, yaml 32
  33. 33. Capa de almacenamiento (II) • Relacional • SQL Server, MySQL, PosgreSQL • Estructura establecida: Normalización • Relaciones entre tablas • Claves externas • Consultas, uniones entre tablas, Índices, procedimientos almacenados • Basado en documentos • DynamoDB, DocumentDB, MongoDB • Estructura no fija: Desnormalización • No hay relaciones • Operaciones Scan y Query 33
  34. 34. Capa de almacenamiento (III) • Clave-valor • Redis • Usado como caché • Almacenamiento en grafos • Neo4J • Motores de recomendación y derección de fraudes 34
  35. 35. Capa de almacenamiento (IV): Caché • Frescura • Validación • Invalidación 35
  36. 36. Tipos de caché • Cache HTTP • Varnish, Nginx, Apache • Caché en memoria de proceso • Parte de Java y de .Net • Caché de memoria compartida • Redis • Caché de base de datos • Resultados de consultas 36
  37. 37. Capa de almacenamiento (V): Búsqueda • Integrada en DBMS: • select name like '%s' • Índices • Búsqueda de valores específicos en una tabla de acceso rápido • A nivel de aplicación: • Algoritmos de búsqueda "académicos" • Motores de búsqueda • Lucene • Elasticsearch 37
  38. 38. Arquitecturas "lasaña" • Presentación • Aplicación • Almacenamiento • Caché • Búsqueda 38
  39. 39. Arquitecturas "ravioli" Muchos elementos, una salsa 39
  40. 40. Arquitecturas "ravioli" • Microservicios • Comunicaciones • Directa • Mensajes 40
  41. 41. Microservicios • Componentes especializados e independientes. • Idealmente cada uno con su propio almacenamiento. • Cada componente se puede desplegar independientemente. • Ejemplos: Amazon, Spotify 41
  42. 42. Comunicaciones (I): Directa • GraphQL • REST • HTTP • ODBC • Sockets 42
  43. 43. Comunicaciones (II): Paso de mensajes • Usada por el sistema operativo para comunicarse con aplicaciones. • Colas • Topics • Reintentos • Dead letter queues o Poison queues • Sistemas de Colas de mensajes • ZeroMQ, RabbitMQ • AWS SQS, Azure Service Bus, Google Cloud PubSub 43
  44. 44. Arquitecturas "ravioli" • Microservicios • Comunicaciones • Directa • Mensajes 44
  45. 45. Arquitecturas "risotto" El total es mayor que la suma de los granos de arroz 45
  46. 46. Risotto: Serverless computing • Funciones específicas, especializadas • Enviar un email • Redimensionar una foto • Agregar metadatos a un fichero • Desplegadas independientemente • Efímeras • Proveedores • Azure Functions, AWS Lambda, Google Cloud Functions 46
  47. 47. Arquitecturas "pizza" 47
  48. 48. Arquitecturas "panetone" 48
  49. 49. Resumen • Motivación • Ejemplos • Stacks "web", "mobile”, "desktop”… • Arquitecturas "lasaña", "ravioli", "risotto”… • Almacenamiento • Comunicaciones • Frameworks 49
  50. 50. Motivación "Conocer detalles sobre el funcionamiento de las diferentes capas de un sistema nos permite tomar mejores decisiones que afectan al mismo" Yo, al principio de esta charla 50
  51. 51. ¿Preguntas? 51

×