Redes Sociales con GeneXus y WorkWithPlusIng. Guillermo Gonzálezggonzalez@dvelop.com.uy#GX2426
AgendaIdea: cómo implementar el Smart Grid fácil y económicamente?Problema: juntar masa crítica y coordinar accionesDesafíos: integración tecnológicaSolución: GeneXus + WorkWithPlus + Redes Sociales
MotivaciónA todos nos importa el medio ambiente en mayor o menor medidaTratamos de usar lamparitas de bajo consumo, tratamos de reciclar entre otras accionesEl problema es que son pequeñas acciones descoordinadas y el efecto global es menor
Smart gridIDEA
Smart Grid Solo ahorrar energía no es suficiente, lo ideal es ahorrar en el momento que se necesitaEvitar picos de consumo de energía que es cuando hay que prender las centrales termoeléctricas
Es una buena idea! Pero… por qué no vemos Smart Grids implementados?
Smart Grid: dificultades1Medidores inteligentes2Tarifas dinámicas3Termostátos inteligentes4Comunicación bidireccional
Greentizen
COORDINACION MASIVADESAFÍO
A alguien ya se le ocurrió?
“Últimamente hemos visto que la gente en todo el mundo está logrando acciones de gran impacto coordinándose por redes sociales”
Flashmobs
Revoluciones políticas
Revoluciones políticas
Redes sociales en genexusIMPLEMENTACION
ImplementaciónGeneXus X Evolution 1 para el sitio webGeneXus X Evolution 2 para las aplicaciones mobilePlataforma: la más parecida a LAMP (Linux, Apache, MySQL, PHP)LinuxApache/TomcatMySQLJavaHerramienta para desarrollo de interfaz gráficaWorkWithPlus Pattern
WorkWithPlusEs posible hacer aplicaciones “vistosas” con GeneXus?Sí, pero de manera manual es muy costosoUsamos WorkWithPlus para la maquetación webInterfeces gráficas de manera declarativaFácil creacion de elementos repetitivos en las pantallasFácil creación de pantallas similares usando TEMPLATESDesarrollo de pantallas de alta/baja/modificación para el backendIntegración natural con themes (CSS)SeguridadPrevisualización de webform
WorkWithPlus: árbol
WorkWithPlus: webform
WorkWithPlus: webform
WorkWithPlus: final
Integración de aplicacionesTwitterUsamos Twitter4j como API de TwitterSe integra a GeneXus por medio de un external objectFacebookRequiere agregar metadata a las páginas que se desean compartirBotón de “Like”GeolocalizaciónUbicación aproximada por consulta de dirección IPGoogle Maps APIServicios web (ej Maxmind)Google AnalyticsSe embebe código javascript en las master pages
GeneXus MarketplaceProvee componentes que extienden a GeneXusUser controls: creación de interfaces web ricasUser controls utilizadosUploadify: simplifica la subida de fotos de perfilExtraSlider: provee una forma simple de hacer marquesinas javascriptJSEventHandler: abstraer la captura de eventos javascriptSe publicarán los siguientes controles como aporte de DVelop a la comunidadCreación de thumbnails a partir de fotos grandesGeolocalización mediante IPExternal Object para integración con TwitterComponente para acortar URLs
Aplicaciones móvilesDesafíos a resolver en aplicaciones nativasLook & feel: cada plataforma requiere Un theme diferenteLa mayoría de las veces hay que crear versiones de los objetos adaptadas a cada plataformaPrototipaciónDistribución: marketsActualización: si cambio de versión de GeneXus o hago cambios en las transacciones de la KB y debo redistribuir la aplicaciónAplicaciones web mobileSe usa el pattern WorkWithPlus para generar una versión web similar a la aplicación nativa
Aplicaciones móviles
Recursos útilesStatus de Twitterhttps://dev.twitter.com/statusFacebook debug sitehttp://developers.facebook.com/tools/debug
Para finalizarÚnete a www.greentizen.comConferencias relacionadasGreentizen – Pablo Brenner, Sala 2B, 12/9/2011, hora: 12:15Gamification – Gonzalo Frasca, Sala 2B, 12/9/2011, hora: 15:45WorkWithPlus: Aumente su productividad en aplicaciones Web y Web Mobile en GeneXus X Ev 1 y Ev 2 – Joaquín Alvarez, Sala 4R, 12/9/2011, hora: 10:30Contacto: Ing. Guillermo González, PMP. ggonzalez@dvelop.com.uy
www.greentizen.com
www.greentizen.com

102 redes sociales-con_gene_xus_y_workwithplus_pattern

  • 1.
    Redes Sociales conGeneXus y WorkWithPlusIng. Guillermo Gonzálezggonzalez@dvelop.com.uy#GX2426
  • 2.
    AgendaIdea: cómo implementarel Smart Grid fácil y económicamente?Problema: juntar masa crítica y coordinar accionesDesafíos: integración tecnológicaSolución: GeneXus + WorkWithPlus + Redes Sociales
  • 3.
    MotivaciónA todos nosimporta el medio ambiente en mayor o menor medidaTratamos de usar lamparitas de bajo consumo, tratamos de reciclar entre otras accionesEl problema es que son pequeñas acciones descoordinadas y el efecto global es menor
  • 4.
  • 6.
    Smart Grid Soloahorrar energía no es suficiente, lo ideal es ahorrar en el momento que se necesitaEvitar picos de consumo de energía que es cuando hay que prender las centrales termoeléctricas
  • 7.
    Es una buenaidea! Pero… por qué no vemos Smart Grids implementados?
  • 8.
    Smart Grid: dificultades1Medidoresinteligentes2Tarifas dinámicas3Termostátos inteligentes4Comunicación bidireccional
  • 9.
  • 10.
  • 11.
    A alguien yase le ocurrió?
  • 12.
    “Últimamente hemos vistoque la gente en todo el mundo está logrando acciones de gran impacto coordinándose por redes sociales”
  • 13.
  • 14.
  • 15.
  • 16.
    Redes sociales engenexusIMPLEMENTACION
  • 17.
    ImplementaciónGeneXus X Evolution1 para el sitio webGeneXus X Evolution 2 para las aplicaciones mobilePlataforma: la más parecida a LAMP (Linux, Apache, MySQL, PHP)LinuxApache/TomcatMySQLJavaHerramienta para desarrollo de interfaz gráficaWorkWithPlus Pattern
  • 18.
    WorkWithPlusEs posible haceraplicaciones “vistosas” con GeneXus?Sí, pero de manera manual es muy costosoUsamos WorkWithPlus para la maquetación webInterfeces gráficas de manera declarativaFácil creacion de elementos repetitivos en las pantallasFácil creación de pantallas similares usando TEMPLATESDesarrollo de pantallas de alta/baja/modificación para el backendIntegración natural con themes (CSS)SeguridadPrevisualización de webform
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
    Integración de aplicacionesTwitterUsamosTwitter4j como API de TwitterSe integra a GeneXus por medio de un external objectFacebookRequiere agregar metadata a las páginas que se desean compartirBotón de “Like”GeolocalizaciónUbicación aproximada por consulta de dirección IPGoogle Maps APIServicios web (ej Maxmind)Google AnalyticsSe embebe código javascript en las master pages
  • 24.
    GeneXus MarketplaceProvee componentesque extienden a GeneXusUser controls: creación de interfaces web ricasUser controls utilizadosUploadify: simplifica la subida de fotos de perfilExtraSlider: provee una forma simple de hacer marquesinas javascriptJSEventHandler: abstraer la captura de eventos javascriptSe publicarán los siguientes controles como aporte de DVelop a la comunidadCreación de thumbnails a partir de fotos grandesGeolocalización mediante IPExternal Object para integración con TwitterComponente para acortar URLs
  • 25.
    Aplicaciones móvilesDesafíos aresolver en aplicaciones nativasLook & feel: cada plataforma requiere Un theme diferenteLa mayoría de las veces hay que crear versiones de los objetos adaptadas a cada plataformaPrototipaciónDistribución: marketsActualización: si cambio de versión de GeneXus o hago cambios en las transacciones de la KB y debo redistribuir la aplicaciónAplicaciones web mobileSe usa el pattern WorkWithPlus para generar una versión web similar a la aplicación nativa
  • 26.
  • 27.
    Recursos útilesStatus deTwitterhttps://dev.twitter.com/statusFacebook debug sitehttp://developers.facebook.com/tools/debug
  • 28.
    Para finalizarÚnete awww.greentizen.comConferencias relacionadasGreentizen – Pablo Brenner, Sala 2B, 12/9/2011, hora: 12:15Gamification – Gonzalo Frasca, Sala 2B, 12/9/2011, hora: 15:45WorkWithPlus: Aumente su productividad en aplicaciones Web y Web Mobile en GeneXus X Ev 1 y Ev 2 – Joaquín Alvarez, Sala 4R, 12/9/2011, hora: 10:30Contacto: Ing. Guillermo González, PMP. ggonzalez@dvelop.com.uy
  • 29.
  • 30.

Notas del editor

  • #3 ONDA VERDEHabrán visto en los útlimos tiempos que hay uma “onda verde” en todo el mundo: esta la onda green computing (de Wikipedia: Green Computing también conocido como Green IT o traducido al español como Tecnologías Verdes se refiere al uso eficiente de los recursos computacionales minimizando el impacto ambiental, maximizando su viabilidad económica y asegurando deberes sociales. No sólo identifica a las principales tecnologías consumidoras de energía y productores de desperdicios ambientales sino que ofrece el desarrollo de productos informáticos ecológicos y promueve el reciclaje computacional. Algunas de las tecnologías clasificadas como verdes debido a que contribuyen a la reducción en el consumo de energía o emisión de dióxido de carbono son computación en nube, computación grid, virtualización en centros de datos y teletrabajo.)También hay iniciativas más o menos avanzadas en las ciudades grandes de reciclaje de residuos, energías alternativas, etc
  • #4 A TODOS NOS IMPORTA EL MEDIO AMBIENTELa verdad es que a todos nos importa el medio ambiente (en mayor o menor medida). Desde temprana edad a los ninos se les imparte educación para el cuidado del medioambiente, se les ensena a reciclar, a apagar las luces que no se usan etc.Esas mismas acciones son las que estamos acostumbrados a hacer en nuestro hogar, son útiles y buenas pero no hemos logrado como colectivo realizar acciones coordinadas que produzcan un impacto significativo en el medio ambiente (una excepción son las mediadas adoptadas por los gobiernos de algunos países de permitir circular determinada cantidad de autos por día en las grandes ciudades etc).
  • #7 APLANAR DEMANDAComo decíamos, la clave del Smart Grid es la aplicación de medidas coordinadas para “aplanar” la demanda de consumo eléctrico evitando los picos (se considera un pico típicamente un incremento temporal de 2X en el consumo). Para implementar Smart Grid se requiere que los consumidores (por ejemplo los hogares) esten afines a que los proveedores apaguen automáticamente algunos electrodomésticos ante la inminencia de un pico de energía. Esto aplicado a Uruguay por ejemplo sería en los días más calurosos de verano y ante una inminente utilización de la central termoeléctrica enviar una senal a todos los aparatos de aire acondicionado conectados a la red Smart Grid para que suban su temperatura en un par de grados. Así la red de autoregula sola y se evita la quema de hidrocarburos para generación de energía.
  • #12 INICIATIVAS SIMILARESHay inciativas similares pero el enfoque en todos los casos es a acciones individuales y descoordinadas
  • #18 ARQUITECTURA LAMPCuandonos plantearon la idea, y que además querían implementarla en GeneXus por su capacidad para generar en todas las plataformas (web y mobile) tuvimos que tomar diferentes decisiones técnicas.La primera fue la plataforma en la cual generar. Para eso seguimos la tendencia de las redes sociales más exitosas actualmente. En mayor medida ellas estan implementadas en plataformas opensource siendo LAMP el stack tecnológico predominante. Esto permite customizar las herramientas ante la eventualidad de tener que escalar rápidamente, por ejemplo ajustando el sistema operativo o el motor de base de datos.En GeneXus tenemos LAM y en cuanto al lenguaje de generación optamos por Java frente a Ruby debido a su robustez, su madurez y la alta experiencia en la comunidad.Otra ventaja de este stack tecnológico es la amplia diversidad de opciones de hosting, incluyendo la nube (ej Amazon).
  • #19 INTERFACES GRAFICAS A MANOA nivel de desarrollo el primero desafío que encaramos fue tener que usar GeneXus para un dominio de aplicación que no es su fuerte, es decir, estamos acostumbrados a disenar aplicaciones de gestión muy buenas con GeneXus, pero una red social?Esto implica nuevos desafíos sobro todo a nivel de estética y usabilidad. Vimos que realizar a mano en GeneXus interfaces gráficas web muy elaboradas es un proceso costoso.Por eso nos apoyamos en la herramienta WorkWithPlus de Dvelop. Esta es un pattern que trabaja encima de Genexus y permite desarrollar interfaces gráficas de forma declarativa insertando y anidando controles de manera jerárquica. Lo usamos para crear el esqueleto de las pantallas más complejas y para generar plantillas madre para las pantallas que son similares. Además nos permitió desarrollar el backend de la aplicación de forma casi automática a partir de la transacción y nos proveyó un módulo de seguridad prefabricado los cual nos ahorró tiempo.
  • #20 ARBOL WWPAhora veremos de forma resumida como generamos interfaces gráficas ricas con WorkWithPlus en sus diferentes etapas.Primero disenamos un modelo conceptual de la pantalla y hacemos un boceto en papel de cómo voy a distribuir los controles dentro de las tablas, cómo voy a lograr los bordes redondeados y los tabs en las pantallas que los posean.Luego pasamos el diseno a la herramienta que anida controles de manera jerárquica.
  • #21 ESQUELETOConsolo guardar el objeto ya se genera el webform correpondiente a ese modelo jerárquico.Hasta acá tenemos un equeleto de lo que sería la pantalla, ahora falta aplicarle la estética.
  • #22 DISENO GRAFICOBien, ahora hay que ir a la parte estética.Para este proyecto trabajamos con una disenadora gráfica profesional que nos entregaba bocetos con la especificación de cada pantalla: tipografías, espaciado de los controles, especificación de los colores en hexa o RGB. Eso lo pasamos al theme de Genexus, cargando previamente todas las imágenes en la Knowledge Base.
  • #23 Por último vemos el resultado final
  • #24 INTEGRACION DE APLICACIONESEl mayor desafío de esta aplicación GeneXus es la integración con aplicaciones externas, todas ellas mediante servicios web o javascript.El mayor punto de integración es com Twitter. Existen APIs particulares para cada lenguaje de programación que se comunican directamente con los servicios de Twitter y abstraen tareas como codificar URL, manejar mensajería particular, etc. En este caso usamos Twitter4j que es la API de Twitter para java más madura. Como no podíamos integrarla directamente con GeneXus por su gran cantidad de servicios, hicimos objetos intermediarios en Java que proveen servicios de alto nivel como “publicar un tweet”, “seguir a un usuario” “login con Twitter”. Estos objetos java los importamos a GeneXus como external object y de ahí en más el manejo de Twitter es transparente para el programador.A nivel de integración con Facebook en principio solo es de interés compartir acciones en el muro. Es por eso que tuvimos que agregar metadata a las páginas de interés como ser el html tag <title>, el <meta name="description“ y la imagen que queremos que aparezca en el muro de facebook con el tag <link rel="image_src" hrefPor último otros servicios consumidos son: la geolocalización de Maxmind que nos da a partir de la IP del usuario su ciudad, region y país los que luego.