El uso de interfaces de programación de aplicaciones (API) es una habilidad esencial que todos los programadores deben dominar.
Las interfaces de programación de aplicaciones (API) son uno de los atajos definitivos para crear aplicaciones inteligentes. Es un canal de comunicación entre dos aplicaciones. Ya sea de forma deliberada o no, ha utilizado API en algunos puntos mientras navega por Internet o utiliza programas en su vida diaria.
Aunque una API normalmente envía datos complejos como respuesta, ¿cómo puede comprender y utilizar esta información para atender a sus usuarios? Las API facilitan la vida tanto a los desarrolladores nuevos como a los experimentados. Entonces necesitas saber cómo usarlos con tu aplicación.
Aquí, con algunos casos de uso y ejemplos, echamos un vistazo a cómo puede utilizar una API para servir sus programas como desarrollador.
¿Cómo Funcionan Las API?
Los desarrolladores crean API como productos que pueden servir a otros desarrolladores. El objetivo es hacer que los procesos de desarrollo web complejos sean fáciles, más eficientes y más rápidos para los desarrolladores de consumidores o las empresas.
La mayoría de las empresas ahora dependen de API de terceros para resolver problemas y servir mejor a sus clientes. Sin embargo, el uso de API no es tan complicado como mucha gente piensa. Puede considerarlo como una solución de terceros que le brinda una respuesta específica en forma de datos cuando realiza una solicitud HTTP en particular.
Usar una API es como hacer un pedido en una pizzería. No puedes ir a la cocina para decirles lo que quieres. Necesitas que un camarero tome tu pedido y lo comunique a la cocina antes de regresar con tu pizza.
Puede ver una API como ese vínculo entre usted y la cocina. En este caso, usted es un cliente que patrocina el restaurante y proporciona un camarero (API). Luego, el camarero responde con su elección de pizza (datos). En una API real, su aplicación web es el cliente que solicita consumir el contenido del proveedor a través de su API al realizar solicitudes HTTP de punto final.
¿Qué Es Un Punto Final De API?
La conexión a una API requiere que conecte su programa a un punto final de API. Puede ver esto como una conexión bidireccional. El punto final conectado a su programa envía una solicitud, mientras que el que está conectado a la API lo retroalimenta con una respuesta específica.
El punto final es una URL que solicita y le da al cliente acceso directo a los recursos de una API.
Además de obtener datos con una API, también puede POST solicitudes de un proveedor a un cliente, usar el método PUT para obtener más información de un proveedor, así como usar el método DELETE para eliminar datos existentes de su programa. Cada uno de estos métodos suele estar disponible en la documentación de una API.
Criterios Para Conectarse A Una API
La integración de una API con su programa no es solo una decisión espontánea, está premeditada. Debe saber qué información desea y cuánta desea. Esto reduce la complejidad, especialmente si se trata de datos JSON que vienen como una matriz multidimensional. Esa práctica también le permite obtener la información específica que necesita para su programa.
Existen cientos de API con diferentes reglas para conectarse a ellas. Si bien algunas API son gratuitas y de código abierto, a otras solo se puede acceder mediante suscripción.
Aunque algunas son sencillas y sencillas y no requieren ningún requisito previo, otras API pueden requerir que cumpla con condiciones como generar una clave de API o registrarse para una cuenta de desarrollador antes de poder conectarse a sus puntos finales.
Sin embargo, uno de los aspectos más importantes de cualquier API es su documentación. La mejor práctica es leer y seguir la documentación de cualquier API con la que desee conectarse para obtener guías sobre cómo codificar y usar sus recursos. Eso es porque cada API tiene sus propios métodos e instrucciones de conexión.
Para conectarse con cualquier API, también necesita conocer los lenguajes de programación que admite.
Cómo Conectarse A Una API: Ejemplos Prácticos
No hay formas específicas de conectarse a una API, pero algunos ejemplos lo expondrán a los conceptos básicos de cómo puede consumir datos de API con su aplicación. Pero antes de continuar, hemos escrito un par de artículos sobre API y cómo puede aprovecharlas.
Por ejemplo, tenemos un artículo detallado sobre cómo puede conectarse con la API Weatherstack , que le brinda acceso a datos meteorológicos en tiempo real. También hemos escrito sobre cómo puede usar Mediastack API , que es una API paga que puede usar para agregar titulares de noticias a su sitio web.
Echemos un vistazo a algunos breves ejemplos de código de cómo puede conectarse a una API.
Cómo Utilizar La API De Selector De Color De Iro.Js
Iro.js es una API simple que le permite agregar un selector de color gratuito a su sitio web. Cuando selecciona un punto de color en la rueda de colores, la API devuelve el código hexadecimal o RGB de ese color. Para conectarse a la API iro.js, todo lo que tiene que hacer es pegar su red de entrega de contenidos (CDN) de punto final en la cabeza de la sección de la DOM.
La documentación completa de esta API está disponible en iro.js.org . Veamos cómo puede conectarse a esta API con el fragmento de código de ejemplo a continuación:
<!DOCTYPE html>
<html>
<head>
<title>Practice Slider</title>
<script src="https://cdn.jsdelivr.net/npm/@jaames/iro@5"></script>
</head>
<body>
<button id="color-button" onclick="sample()">Display color picker</button>
<div id="color-circle"> </div>
<div id="color-code"> </div>
</body>
<script>
let colors= document.getElementById('color-code');
const sample= ()=>{
var colorPicker = new iro.ColorPicker('#color-circle', {
// Set the size of the color picker
width: 320,
// Set the initial color to pure red
color:"#ff0000"
});
colorPicker.on(['color:change', 'color:init'], function(color) {
// log the current color as a HEX string
colors.innerHTML=color.hexString;
});
};
</script>
</html>En el caso de la API de ejemplo anterior, no necesita una clave de API para conectarse a ella. Sin embargo, para comprenderlo mejor, eche un vistazo más de cerca a JavaScript. Para conectarnos con esta API, solo necesitamos llamar a la función ColorPicker de la clase iro , luego pasamos el id del contenedor de la rueda de colores a la clase.
El punto final de la API iro.js es fácil de conectar porque sus desarrolladores han realizado el trabajo adicional de codificar la clase para sus usuarios. La imagen a continuación es el resultado del código de ejemplo anterior.
Para ver cómo ocurre el evento de cambio de color, puede abrir otro archivo HTML y pegar el siguiente código en su sección de scripts :
var colorPicker = new iro.ColorPicker('#color-pick', {
// Set the size of the color picker
width: 400,
// Set the initial color to pure red
color:"#ff0000"
});
const myColor =(color)=>{
console.log(color.hexString);
};
colorPicker.on("color:change", myColor);El código anterior registra valores de color hexadecimales cada vez que cambia la posición del selector de color en la rueda.
NB: Todo el código de ejemplo es el resultado de seguir las instrucciones en la documentación de la API.
Cómo Utilizar La API De Cambio De Moneda NoCodeAPI
NoCodeAPI ofrece muchas API, incluida la API de conversión de moneda. Para conectarse a su punto final de cambio de moneda, vaya al mercado NoCodeAPI y cree una cuenta.
Una vez que inicia sesión, hay una barra de búsqueda en la parte superior de la página. En esa barra de búsqueda, escriba cambio de moneda , una vez que aparezca su consulta, haga clic en Activar .
En la página siguiente, haga clic en Make Currency Exchange API . A continuación, escriba un nombre preferido para la API y haga clic en Crear .
Una vez que haya creado la API, haga clic en Ver documentación . A continuación, seleccione un idioma preferido para ver el código para conectarse al punto final de la API. Luego puede copiar ese código de muestra y pegarlo en su aplicación para una mayor personalización.
Eche un vistazo a nuestro código de ejemplo a continuación para la conversión de moneda:
<!DOCTYPE html>
<html>
<head>
<title>Currency converter</title>
</head>
<div id="currency"> </div>
</body>
<script>
let currency= document.getElementById('currency');
async function callingFn() {
try {
const response = await fetch("https://v1.nocodeapi.com/techyprem/cx/FHNXhKRkWDCvMehl/rates/convert?amount=10&from=USD&to=Eur", {
method: "get",
headers: {
"Content-Type": "application/json"
}
});
const json = await response.json();
currency.innerHTML="Success:" + JSON.stringify(json);
} catch (error) {
console.error("Error:", error);
}
}
callingFn();
<script>
</html>El código anterior es solo una versión modificada del que se encuentra en la documentación. Sin embargo, preste mucha atención a los parámetros de conversión en la variable de respuesta de JavaScript.
Así es como se ve la salida JSON sin procesar:
Success:{"query":{"from":"USD","to":"EUR","amount":10},"info":{"time":1604587505388,"rate":0.844865},"result":8.44865,"text":"10 USD = 8.44865 EUR"}Aprovecha Las API
El uso de API para su aplicación le permite completar proyectos más rápido. Aunque parte de la documentación de la API puede ser técnica, hay muchas que son útiles para los recién llegados.
Sin embargo, como dijimos anteriormente, para aprovechar al máximo cualquier API de la que desee aprovechar datos, debe estudiar su documentación de cerca y cumplir con las reglas para conectarse a ella.
Aunque hemos usado JavaScript para nuestros ejemplos aquí, dependiendo del tipo de API, la mayoría de ellos también admiten otros lenguajes de programación. Puede obtener información sobre el soporte de idiomas en la documentación de cualquier API. Además, tenga en cuenta que los ejemplos que usamos aquí son solo algunos de los muchos casos de uso de API.
