viernes, 6 de febrero de 2015

Spreadsheet-2-Polymer un newsletter particular

Esta semana inició con un desafío muy interesante de desarrollo. La idea era crear un newsletter simple pero que obtenga los datos desde una spreadsheet. La características fundamental de presentación debería utilizar #Polymer para dar soporte responsivo y por supuesto demostrar su flexibilidad.
La respuesta es spreadsheet2polymer.
Fig.1 diseño general
En esta solución he utilizado sampler-scaffold para representar el periodo de trimestres en el newsletter y cada trimestre con una estructura de programas/proyectos.

Cada  programa/proyectos tiene elementos simples como muestra la Fig.2.
Fig.2 diseño general de los programas/proyectos
Lo interesante es que toda esta información se obtiene desde una spreadsheet. Como muestra la Fig.3. [spreadsheet]. O sea puedo el objetivo es armar mi reporte en segundos y que este tenga una presentación responsiva legible y flexible.
Fig.3 Estructura de datos del newsletter
La implementación tiene la funcionalidad responsiva, como muestra la Fig.4.
Fig.4 Visualización responsiva
Hice la implementación desde un polymer-element, les dejo la implementación preliminar aquí:

Finalmente les dejo toda la implementación del proyecto en este repositorio.
A disfrutar del maravilloso mundo tecnológico!

Licencia Creative Commons
Spreadsheet-2-Polymer un newsletter particular por http://nbortolotti.blogspot.com se distribuye bajo una Licencia Creative Commons Atribución-CompartirIgual 4.0 Internacional.

lunes, 19 de enero de 2015

Quiero Polymer en Blogger!

Este fin de semana me propuse un simple desafío de integración. La idea era incorporar #Polymer en las plantillas de #Blogger. De esta forma actualizar el diseño general de esta potente herramienta de comunicación y de paso tener un poco de diversión para #desarrolladores.

La estructura de las plantillas #Blogger tienen un estructura xml, y por este motivo hay que cumplir algunas reglas. De todas formas nada que en minutos no se pueda resolver.

Estás listo para incorporar #Polymer a #Blogger?

Zonas importante de la implementación:
En este ejemplo, el objetivo era no solo incorporar marcado tradicional sino interacción con #js.

1. Incorporar webcomponents.js
    <script src='//www.polymer-project.org/components/webcomponentsjs/webcomponents.js'/>

2. Incorporar en este caso el elemento de core-pages [utilizamos como ejemplo este elemento]
    <link href='//www.polymer-project.org/components/core-pages/core-pages.html' rel='import'/>

3. Estilos css para esta funcionalidad
    <b:skin>
      <![CDATA[
<style>
html, body {

4. El elemento en concreto dentro del Body
    <core-pages class="fancy" selected="0">

5. La funcionalidad Js para el desarrollo del ejemplo.  
    <script >
      //<![CDATA[
      document.querySelector('core-pages.fancy').onclick = function(e) {

Aquí les dejo la implementación completa y en este repositorio GitHub podrán seguir la evolución a una plantilla totalmente funcional. [ejemplo actual]


Licencia Creative Commons
Quiero Polymer en Blogger! por http://nbortolotti.blogspot.com se distribuye bajo una Licencia Creative Commons Atribución-CompartirIgual 4.0 Internacional.

miércoles, 14 de enero de 2015

Una muestra de #Containers desde Google Cloud

La plataforma de nube evoluciona día y a día y propone cada vez más opciones. En el día de hoy presentamos #Containers #Agrupaciones dentro del esquema de #GoogleCloudPlatform.

Les comparto la presentación utilizada donde se analizó, la evolución tecnológica propuesta por #Google desde el 2002 hasta la actualidad, luego una vista general para dos modelo arquitecturales #AppEngine y #ComputeEngine. Finalmente la demostración propuesta fue:
  • Crear un #container, validar su ejecución utilizando #gcloud tool.
  • Poner en funcionamiento el monitor de cloud. #GoogleCloudMonitor
  • Consultas elementales utilizando #BigQuery.
Les comparto los comando utilizados en la demostración de containers:
  • gcloud preview container --zone us-central1-a pods --cluster [nombre del cluster] list
  • gcloud preview container --zone us-central1-a pods --cluster [nombre del cluster] create --name wordpress --image tutum/wordpress --port 80

Les dejo el live compartido con toda la comunidad #Cloud de Hispanoamérica


Segmento de presentación utilizado en el Live streaming:


Licencia Creative Commons
Una muestra de #Containers desde Google Cloud por Nicolas Bortolotti se distribuye bajo una Licencia Creative Commons Atribución-CompartirIgual 4.0 Internacional.