Cómo crear contenido en Trello usando su API y Postman

Vamos a aprender a crear, modificar y eliminar contenido en Trello, pero en lugar de hacerlo directamente desde su web, lo haremos usando sus APIs con la ayuda de Postman. ¿Y por qué? ¿Porque me gusta complicarme la vida? Puede ser, pero lo hago fundamentalmente para practicar y aprender a manejar APIs y Postman. ¡Así que vamos a ello! 💪

Prerequisitos

Qué es Trello y para qué sirve

Por si no la conoces, Trello es una herramienta súper sencilla para gestionar tareas, que funciona básicamente con tableros (en inglés, boards) donde se crean listas de tareas (en inglés, lists), que a su vez tienen tareas, aunque los de Trello las llaman cards. Por ejemplo, podemos crear un board para hacer el seguimiento de la construcción de un cohete, y su interface sería más a menos así:

[BOARD] construcción del Apolo 13 

[LIST] 📋 tareas por hacer

👷‍♀️ tareas en proceso

😎 tareas terminadas

[CARD] tarea X

tarea Y

tarea Z

tarea A

He utilizado las listas para indicar el estado de la tarea, que es lo que me parece más lógico, pero tú puedes utilizar el criterio que mejor te parezca. 

Cómo manejar Trello desde su API usando Postman

1. Creamos una cuenta gratuita en  https://trello.com/ (o entramos con nuestra cuenta de Google). 

2. Recreamos el board de arriba, en Trello.

Es momento de establecer contacto con las APIs de Trello 👽. Esta es la página de documentación de sus APIs. Tenla abierta, porque la vamos a necesitar.

Creación de un board

Si exploramos el índice de la izquierda, podemos ver que en Boards tenemos la posibilidad de crear un board. Eso es lo que vamos a hacer, usando Postman. 

Para crear un board debemos hacer una petición POST. Aquí un pequeño recordatorio de los cuatro métodos más utilizados para hacer peticiones HTTP (en inglés, HTTP requests), también llamadas CRUD operations:

GET 👉 para leer información (la R de CRUD, de "read")

POST 👉 para crear información (la C de CRUD, de "create")

PUT 👉 para editar información (la U de CRUD, de "update")

DELETE 👉 para borrar información (la D de CRUD, de "delete")

Como vemos en la documentación, sólo hay un campo obligatorio, el name. También vamos a necesitar una API key y un tokenque podemos obtener siguiendo estos pasos.

api-y-token

Aquí tenemos un ejemplo para crear un board.

1. copiamos la URL y nos vamos a Postman, donde creamos un workspace específicamente para este ejercicio. 

2. creamos una nueva colección haciendo clic en "create collection", a la que he bautizado como "trello APIs".

3. le damos a "add new request" y le damos el nombre que queramos, en mi caso, "create a trello board".

4. escogemos nuestro método (POST) y pegamos la URL. Verás que automáticamente te reconoce los parámetros de la URL, es decir, esos valores que son dinámicos. Añadimos los valores que nos pide (tú tendrás una API key y token distintos a los míos), bautizamos nuestro board (rellenando el campo de "name") y le damos a "send".

trello-postman

Si todo ha ido bien, ahora en Postman verás un resumen de tu request exitosa, con su status 200. Ve a tu Trello y recárgalo, verás que tu board está creado. ¡Genial! 😁


Creación de una lista

Vamos a crear un lista dentro de nuestro board. Esta parte de la documentación es la que nos servirá de guía.

Esta vez vamos a necesitar, a parte de los parámetros anteriores, el id de nuestro board, que podemos encontrarlo en el body que nos ha generado Postman en la anterior request.

1. copiamos la URL del ejemplo y añadimos una nueva POST request en Postman, que yo llamaré "create a list".

para añadir una nueva request, haz clic en las opciones de tu collection (los 3 puntitos) y ahí está la opción de "add request" 

2. de nuevo, Postman reconoce los query parameters, así que rellenamos los campos. Se me ocurre que, a parte de las típicas listas de "tareas en proceso, sin empezar y terminadas", voy a añadir una nueva llamada "tareas bloqueadas". Le damos a "send" y ¡voilà! nuestra lista está creada. Ve a tu Trello para comprobarlo.

Actualizando elementos en Trello

Como ves, es súper sencillo hacer POST requests para crear elementos. Vamos a crear un par de tarjetas (las tareas que van dentro de una lista) siguiendo la documentación para ello. De esta manera, verás que se crean tarjetas vacías. 

1. ya que no tiene mucho sentido dejar tarjetas vacías, vamos a actualizarlas siguiendo la documentación para ello.

2. aquí tenemos un requisito nuevo, los "path parameters", que en nuestro caso es el id de la tarjeta. Para generar esos path parameters en Postman, cogemos la URL del ejemplo (https://api.trello.com/1/cards/{id}?key=APIKey&token=APIToken) y la añadimos a Postman, sustituyendo {id} por :id. 

path-variables

Como Postman es tan listo, nos genera automáticamente los campos para rellenar nuestras variables.

ACLARACIÓN SOBRE LA SINTAXIS DE UNA URL

Una URL tiene varias partes, pero para el caso que nos ocupa, basta con conocer y distinguir dos de sus partes:

Los query parameters (también llamados query params). Es la información que damos/pedimos cuando hacemos una petición. Como si a Google maps le pidiéramos "muéstrame cafeterías".

https://api.trello.com/1/cards/:id?key=APIKey&token=APIToken

Los path params. Es el lugar al que hacemos la request, como una ubicación.

https://api.trello.com/1/cards/:id?key=APIKey&token=APIToken

3. añadimos el id de nuestra tarjeta. Si lo has perdido, (como yo 😅), haz una GET request para que Postman te enseñe las tarjetas que hay en tu lista de "bloqueadas".

Vamos a actualizar, por ejemplo, el nombre de la tarjeta, que ahora está en blanco. Para eso, al final de la URL de Postman añadimos nuestro propio query param: &name=concretar fecha despegue

Enviamos nuestra request ¡y listo! Verás que en tu Trello, la tarjeta ya tiene título.

🤯

¿Harto de irte de una request a otra para copiar valores que se repiten, como tu API key? Hay una manera más eficiente de trabajar: usando variables. Así podrás reutilizar los mismos valores una y otra vez sin tener que copiarlos y pegarlos manualmente, aplicando así el principio DRY.

Puedes hacerlo desde el icono del ojito en Postman 👁, arriba a la derecha, y ahí tendrás la posibilidad de añadir global variables. Puedes usarlas en tu request con esta sintaxis ➡ {{tuVariable}}

En mi caso, voy a crear tres global variables para los valores de la API key, el token y el principio de la URL de Trello, porque siempre es la misma.

Borrando elementos

Por último, vamos a borrar todo nuestro board. 

1. creamos una DELETE request en Postman, que podemos llamar "delete a board".

2. seguimos las instrucciones para eliminar un board, usando su URL de ejemplo, como siempre (https://api.trello.com/1/boards/{id}?key=APIKey&token=APIToken).

3. como ya hemos aprendido, pegamos la URL en Postman y sustituimos el id por un path parameter, cuyo valor podemos encontrar en las anteriores requests.

4. hacemos la request, y ¡listo! nuestro tablero ha sido eliminado de la faz de la Tierra ☠.

Y con esto hemos hecho un repaso completo al ciclo de creación y destrucción de elementos en Trello a través de su API.

Cómo procesar objetos en formato JSON para crear variables

Vamos a ir un paso más allá y aplicar el principio DRY lo más posible. Y es que hasta ahora, lo único que hemos hecho para no repetir nuestro código es crear tres global variables. Pero hemos creado variables con nuestra propia información, digamos, no con datos que Trello crea cuando generamos algún elemento, por ejemplo, el id de un board.

Eso es precisamente lo que vamos a aprender en esta sección, a procesar los datos que se generan en el body de nuestra request (es decir, cuando hacemos una petición y nos llega una respuesta)a extraerlos en variables para poder re-utilizarlas de manera muy similar a las global variables que hemos creado antes.

procesar 👉 parse

respuesta 👉 response

ambiente/entorno de trabajo 👉 environment

Aquí tienes un diccionario de términos IT inglés-español

La response que nos llega desde Trello está en varios formatos, pero el más famoso y legible es el JSON.

1. limpiamos nuestro Trello de boards, yo lo he hecho desde la app.

Si aún tienes abierta cualquier de las requests, fíjate en el body. Ahí verás un objeto con toda la información que Trello ha creado al hacer tu request. Verás que está en formato JSON. Puedes cambiarlo a otro formato como XML, para que veas la diferencia. Efectivamente, en JSON es mucho más legible.

Verás por ejemplo que si lanzas tu "create a board" request, tienes un body como este:

body-json

Vamos a hacer parsing de esos datos (del id) para posteriormente crear una environment variable (parecida a la global variable, pero para un entorno de trabajo específico).

Hasta ahora hemos trabajado sin ningún entorno de trabajo local, sino en plan suelto. Pero normalmente, en la vida laboral real, se trabaja en algún entorno concreto (dev, test, uat, etc), así que vamos a crear uno. Puedes hacerlo desde el menú de la izquierda, donde pone "Environments", usando el signo ➕. Yo lo he llamado "trello test environment". Cuando lo tengas, cámbiate a ese nuevo environment.

2. desde nuestra "create a board" request, nos vamos a la pestaña test, donde vamos a escribir un código para hacer el parsing.

3. en el footer verás que hay una console. Ábrela, dale a clear y déjala abierta.

4. en la pestaña test, mostramos el id mediante un console.log y hacemos send de la request. 

let response = pm.response.json();
console.log(response.id)

Verás que en la consola se muestra el id. ¡Estupendo!

Postman nos lo pone fácil para procesar los datos en JSON, dándonos funciones ya escritas (en inglés, snippets). Así que debajo de la que ya hemos escrito, buscamos en la lista de la derecha "Set an environment variable", que nos debería dar esto:

pm.environment.set("variable_key", "variable_value");

5. le damos nombre a nuestra variable y le asignamos un valor:

pm.environment.set("boardId", response.id);

6. enviamos nuestra request y ¡ya está! Si compruebas tu environment en el icono del ojito 👁 arriba a la derecha, verás que has creado tu primera environment variable 👏Ahora ya puedes usar tu variable de forma dinámica en lugar de copiar su valor manualmente. Por ejemplo, en la "create a list" request:

boardId

Sabiendo esto, ya puedes crear todas las variables que se te ocurran y así trabajar de manera más rápida y eficiente.

Cómo escribir scripts que revisen automáticamente una request

Imaginemos que no queremos crear cards sin título, sino que todas nuestras POST requests para crear una card deben de tener un título para así evitar crear tarjetas en blanco.

Podemos escribir un test donde le especifiquemos ese requisito. Así, cada vez que lancemos la request, en la pestaña "Test Results (x/x)" veremos si nuestro test ha pasado o si por el contrario, se nos ha olvidado añadir el nombre de la tarjeta, y por tanto, nuestro test fallaría.

Postman usa un library para sus tests llamada Chai. Echa un ojo a su documentación, de donde se puede extraer cómo hacer el tipo de test que necesitamos.

1. en la "create a card" request, vamos a la pestaña "Tests", hacemos parsing de la respuesta de la futura request y creamos nuestro test de comprobación (en inglés, assertion):

let response = pm.response.json();

pm.test('card name must not be empty', function() {
    pm.expect(response.name).to.not.eql('')
});

¡Y listo! Si ahora enviamos la request sin nombre, verás que el test no pasa, sino que resulta en failed. Para que el test pase, debemos añadir otro query param con el nombre que queramos para nuestra card, por ejemplo:

{{baseURL}}/1/cards?idList={{listId}}&key={{trelloAPIkey}}&token={{trelloToken}}&name=optimizar consumo de combustible

¡Y voilà! El test ya sale en verde 😁✅.

THE END!

¡Y hasta aquí el post sobre las APIs de Trello y Postman! Espero que hayas aprendido algo nuevo 😊.  Si te queda alguna duda, ¡nos vemos en los comentarios!

Sobre la autora de este post

Soy Rocío, una abogada reconvertida en programadora. Soy una apasionada de aprender cosas nuevas y ferviente defensora de que la única manera de ser feliz es alcanzando un equilibrio entre lo que te encanta hacer y lo que te saque de pobre. Mi historia completa, aquí. 

Otros artículos que pueden interesarte

Cómo aprendí a programar cuando estaba «programada» para ser de letras
[tcb-script src="https://player.vimeo.com/api/player.js"][/tcb-script]A nadie le gusta su trabajo. Eso es lo que me decía a mí misma cuando conseguí mi primer[...]
Guía de iniciación al data binding en Angular
¿Qué es el databinding?El databinding es la forma que tiene Angular para permitirnos mostrar contenido dinámico en lugar de estático (en inglés, hardcoded). Podríamos[...]
Claves para entender Angular – Qué es y cómo se utiliza
Angular es un framework creado por Google que nos permite construir Single Page Applications (SPA, por sus siglas en inglés).Frameworks¿Pero qué es[...]
Si crees que este post puede serle útil a alguien, por favor, ¡compártelo!:

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Esta web utiliza cookies para asegurar que se da la mejor experiencia al usuario. Si continúas utilizando este sitio se asume que estás de acuerdo. más información

Los ajustes de cookies en esta web están configurados para «permitir las cookies» y ofrecerte la mejor experiencia de navegación posible. Si sigues usando esta web sin cambiar tus ajustes de cookies o haces clic en «Aceptar», estarás dando tu consentimiento a esto.

Cerrar