Construyendo una simple interface desde GAS – Pt 2

Estándar

En esta segunda entrega, crearemos una sencilla interfaz de usuario en GAS utilizando el HTML Service, para ello, crearemos un proyecto en blanco, después de ello haremos lo siguiente:

Ir a Archivo=>Nuevo=>Archivo HTML

Se nos solicitara un nombre de archivo, al cual llamaremos index, damos clic en aceptar y escribimos el siguiente código:

<div id=”formulario”&gt
<form&gt
<input type=”email” name=”email” id=”email” placeholder=”Introduce tu e-mail”&gt
<input type=”submit” value=”Registrarse”&gt
</form&gt
</div&gt

En este ejemplo queremos que el usuario introduzca su email, lo cual normalmente requiere algún tipo de validación, no queremos que el usuario introduzca algo que no sea un email. Esta simple validación por lo general se lleva a cabo del lado del cliente usando JavaScript, lo cual relativamente es complicado, pero estamos de suerte ya que nos podemos ahorrar ese dolor de cabeza empleando HTML5. Si, así es! HTML5 es soportado al utilizar el HTML Service en GAS. Esto significa que la validación se lleva acabo empleando la propiedad type=”email” en el elemento de entrada del formulario.

Otro aspecto a remarcar para quienes están empapados en la creación de páginas web, es que en GAS no se debe emplear las etiquetas <head> ni <body>, ya que si se usan podrían afectar el desempeño del script.

Ahora agregaremos un elemento para agradecer al usuario el haberse registrado, para ello emplearemos la siguiente etiqueta justo antes del cierre de la etiqueta div:

<span id=”gracias”>Gracias!</span>

Ahora… ¿qué debemos hacer para que nuestra Web App funcione? En el archivo código.gs escribimos el siguiente código:


function doGet() {

var html = HtmlService.createHtmlOutputFromFile('index').setSandboxMode(HtmlService.SandboxMode.NATIVE).setTitle('Mi Web App');

return html;

}

Como había mencionado anteriormente siempre se debe emplear una función llamada doGet cuando estemos creando una Web App, dentro de esta función están dos líneas de código, en la primera línea creamos una variable llamada html a la cual le asignamos un objeto HTML Service, el crea una salida HTML tomando como template nuestro archivo index, se ajusta el modo de la caja a NATIVE, se le asigna un título y por último se regresa ese objeto al navegador.

Por el momento esto sería todo, más adelante mostrare como interactuar con los eventos del lado del cliente y del servidor usando como base esta misma aplicación.

Anuncios

Construyendo una simple interface desde GAS – Pt 1

Estándar

Una UI (user interface – interface de usuario), es lo que uno ve al prender una computadora, puede ser una interfaz que hace uso de ventanas o puede ser el cursor parpadeante desde una consola de comando. Por lo general cuando hablamos de la creación interfaces de usuario nos referimos a la parte con la cual el usuario estará en interacción con nuestra aplicación (texto a leer, imágenes a visualizar, cajas de texto, botones a pulsar, etc…). Hoy en día las interfaces Web se crean haciendo uso de HTML.
Pero en GAS existen al menos tres formas de crear una interfaz:

  • Incrustada en un “Google Doc” o una ” Google Sheet”
  • Incrustada en un “Google Site” como un gadget
  • Como una página Web (la cual llamaremos Web App)

Por el momento le veo mayor aplicación a las Web Apps. Para poder construir la interfaz en este tipo de scripts, podemos valernos de dos alternativas que Google pone a nuestro alcance:

  • HTML Service
  • UI Service

Continuar leyendo

Google Apps Script – Video Turoriales

Estándar

Bueno… ya tiene varias semanas que no escribo sobre esta práctica e ingeniosa tecnología que nos permite correr scripts en los servidores de google y que nos dan acceso directo a los servicios que este ofrece, entre los cuales están: Sheets, Docs, Forms, Sites, Drive, Gmail, Calendar, Contacs, Groups, Maps, Translate.

Les comparto los siguientes tres links a videos en español que he encontrado por mi cuenta, por supuesto que existen mas videos, pero estos están en ingles… mas adelante espero escribir sobre los proyectos que he desarrollado por mi cuenta.

Programación en Ruby en 5 minutos – Pt 1

Estándar

Hoy en día muchas de las personas se encuentran inmersas en varios asuntos y actividades y quizás apenas tienen tiempo para lo más esencial, es por ello que me decidí a desarrollar pequeños tutoriales o recetas de lo que se puede hacer con un lenguaje tan fabuloso como lo es Ruby. No esperen cosas avanzadas y código perfecto, pero si cosas prácticas, sencillas y fáciles de asimilar.

Espero que estos tutoriales sean de interés y sea el primero de muchos mas…

Introducción a Google Apps Script – Programando macros en la nube

Estándar

Excel es una herramienta increíble y flexible, de eso no cabe la menor duda. Creada originalmente para poder analizar datos, sin embargo hoy en día se le dan muchos más usos que solo ese. Pero por más flexible y poderoso que sea no quiere decir que la respuesta a todo sea Excel. A lo largo de estos años he aprendido que un programador debe valerse de varias herramientas a su alcance y en mi caso Excel es una herramienta, quizás la que más utilizo. Pero ya desde hace algunos años las aplicaciones se están desarrollando para ambiente web, donde a veces Excel se ve limitado en algunas tareas, pero.. ¿habrá alguna herramienta que pudiera ser similar a programar macros en Excel y que pudiera servir para programar aplicaciones Web? Por supuesto! La respuesta es Google Apps Script.

Google Apps Script (GAS) nos permite desarrolla scripts que corren en los servidores de Google utilizando el lenguaje de programación JavaScript y con el cual podemos hacer usos de todos los servicios y Apis de Google de manera relativamente fácil. Por ejemplo poder crear mapas, interactuar con documentos de Google Drive entre otras cosas más, y lo que es mas importante poder combinar el poder de esta tecnología con VBA/Excel.

Por el momento comparto con ustedes esta serie de tutoriales que encontré completamente en español y que muestran ejemplos prácticos y fáciles de implementar. GAS es gratuito, solo necesitan contar con una cuenta en Google.