¿Qué es un API? y cómo consumirla

Jerome Olvera
Javascript Mérida
Published in
2 min readMar 23, 2017

Si estás leyendo este post, es probable que ya te hayas topado con la incógnita de lo que significa un API, es un término muy común en programación.

un API por sus siglas, significa `Application Program Interface`

Basado en lo que significan sus siglas vamos a conseguir la definición de la palabra, fijándonos en el término `Interface`, sin confundirlo con una interfase visual, es `Un punto donde dos sistemas, sujetos, organizaciones, etc., se encuentran e interactúan.`, lo que en pocas palabras podemos decir que un API es un punto, en este caso en un sistema, que un programador ya elaboró, permitiendo a las personas a las que les dio acceso, utilizar.

Para demostrar su aplicación tomariamos un ejemplo básico, el obtener datos del API de Facebook.

Cuando queremos conocer la información publicada de un usuario en facebook, es necesario hacer una petición HTTP al API de Facebook para poder utilizarla, ya que en nuestro poder no existe una posibilidad de mejor nivel como acceder a la base de datos, seleccionar los campos que necesitamos y utilizarlos.

Todas esas funciones ya fueron escritas, curadas y puestas a nuestra disposición por Facebook

Para este ejemplo utilizaremos el Fetch API (Ahí está de nuevo el término API) y la sintaxis de ES6 de Javascript, ya que es la manera más estándar y moderna de realizar, sin el uso de librerías de terceros.

Es posible que ya hayas realizado una petición HTTP a un API sin saberlo con el método $.ajax de jQuery

/*
* Declare una variable constante para almacenar el token al
* igual que la url y que el query de la petición
* no sea tan largo
*/
const accessToken = 'tu access token' // lo puedes conseguir aquí
const url = 'https://graph.facebook.com/'

/*
* te podrás dar cuenta de la sintaxis rara para concatenar `${}`
* todo eso es parte de ES6
*/
fetch(`${url}me?access_token=${accessToken}&fields=id,name`)
.then(response => response.json()) // Formato a la respuesta
.then(response => console.log(response)) // Respuesta
.catch(err => console.log(err)) // En caso de error
// Response en el console.log(response)Object {
id: "10xxxxxxxxxxxx20",
name: "Jerome Olvera"
}

Como habrás notado, realizar una petición HTTP a un API y manejar su respuesta no es tan complejo, considerando la ayuda de la nueva sintaxis de Javascript que nos ayuda reduciendo mucho código. Esto no solo lo puedes aplicar con facebook, puede hacer pruebas con otras API en línea como JSON PlaceHolder para hacer ejemplos más complejos.

--

--

Jerome Olvera
Javascript Mérida

Staff Software Engineer en GBM Grupo Bursátil Mexicano