Com certeza você já ouviu falar sobre APIs. Nesse artigo, vou te explicar o que é, como usamos, e porquê é tão importante saber o que é uma API!
Vamos começar com um exemplo bem básico, uma atividade que todo programador iniciante vai acabar fazendo em algum curso por aí: montar uma “Pokedex”. O seu trabalho, é criar uma página, que liste todos os pokemons que existem. Mas vamos com calma, já imaginou o trabalho que é montar essa lista? A não ser que você seja um verdadeiro mestre pokemon, e gastado horas e horas do seu tempo procurando todos os pokemons de cada jogo já lançado, você não vai saber de cabeça todos os pokemons que existem. Mas alguém sabe! E você poderia até pesquisar, e achar uma Pokedex, e ir copiando Pokemon por Pokemon para a sua página, mas você é um programador, e programadores sempre tem uma solução mais fácil de ser aplicada. Essa solução é o que chamamos de API.
Alguém, que conhece tudo sobre Pokemon, conseguiu montar um enorme banco de dados com todas as informações possíveis. Esse mesmo alguém foi lá, e montou um código, que lista todos os Pokemons que existem. E disponibilizou essas informações por meio de uma API.
A ideia por trás de uma API é justamente “abrir” o seu programa para a internet. A expressão API vem de “Application Programming Interface”, uma interface criada em seu programa para compartilhar as funções de seu código, para outro código.
Então para você montar página que liste todos os pokemons, você realmente não precisa saber todos os pokemons. Você precisa de uma API, que disponibilize essa informação para você, conectar o seu código com essa API e exibir as informações.
E sim, existem APIs para tudo! Você pode encontrar todo o tipo de informação por meio de uma API. Antes que você pergunte, existe a PokeApi para você montar a sua Pokedex, mas também temos essa lista com centenas de outras APIs para cada tema que você imaginar.
Existem vários formatos para você externalizar as funções de seu código: SOAP, REST, até um GraphQL. O mais comum entre as APIs é o formato em REST. Uma API em REST utiliza de um padrão bastante comum na internet, o HTTP: em qualquer site que você entra, tem um HTTP por trás —perceba que todo site é como um https://devgo.com.br/. HTTP é um protocolo de rede, por onde mensagens e informações fluem de um canto a outro: um pergunta, alguém responde; o seu navegador pergunta o conteúdo de um endereço (a URL de um site) e o servidor deste site responde; você pergunta a API quais pokemons existem e a API responde. Chamamos isso de cliente/servidor, onde o client envia uma requisição (HTTP Request) e o servidor envia uma resposta (HTTP Response).
Cada “pergunta”, pode ser feita de diferentes formas, seguindo uma convenção de diferentes “métodos” HTTP: se você quer buscar uma informação, o método GET; se você quer pedir que numa nova informação seja adicionada a base de dados, o método POST; se você quer editar uma informação, os métodos PUT ou PATCH; se você quer deletar uma informação, o método DELETE.
É claro que, na prática, cada função deve ser programada dentro de uma API. Uma API é um código “aberto” para a internet, mas também não é um mundo sem leis. Cada API tem sua regra, e cada funcionalidade dentro de uma API também pode ter a sua regra. Vamos usar de exemplo a PokeAPI: para buscar a lista de pokemons, foi programado que você deve realizar um GET na rota https://pokeapi.co/api/v2/pokemon. Além disso, o desenvolvedor criou uma opção para você poder buscar o número de Pokemons que você quiser, adicionando o parâmetro, um “Query Param”, “limit” na URL https://pokeapi.co/api/v2/pokemon?limit=150. E ainda tem mais, você pode buscar todas as informações de um pokemon especifico com o nome do Pokemon, um “Route Param” diretamente na URL como https://pokeapi.co/api/v2/pokemon/pikachu
Por padrão, todo site que você entra em seu navegador usa o método GET em um servidor. Com isso, você consegue acessar qualquer URL de uma API direto do seu navegador, desde que ela esteja programada para receber o método GET.
Agora vamos aprender como fazer o seu código se conectar com uma API! Toda linguagem de programação tem suporte para isso, mas vamos começar com Javascript.
Como padrão da linguagem, o JS tem a função fetch, e você pode utilizar ela tranquilamente. Mas eu, particularmente, gosto bastante de utilizar outra biblioteca, o Axios, e vou te recomendar que use também.
Você pode instalar o Axios em seu projeto com o Yarn, ou NPM:
npm install axios
## ou
yarn add axios
Ou então, incluindo essa tag de importação de script entre as tags <header> do seu HTML: