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!

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.

Como funciona uma API

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 cliente envia uma requisição (HTTP Request) e o servidor envia uma resposta (HTTP Response).

Untitled.png

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.

Utilizando uma API com JS

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:

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

Depois disso de instalado, é só usar o Axios:

const axios = require('axios');

// Para um GET
axios.get('https://pokeapi.co/api/v2/pokemon')
  .then((response) => {
    console.log(response.data);
  });

E com isso, as informações da API vão estar dentro do seu código. Não tem mistério. O grande segredo para o seu projeto, é o que você faz com essas informações!

Criando sua própria API

E não só de utilizar APIs vive um programador, também podemos desenvolver APIs. É até aí que entra o trabalho de um desenvolvedor backend: criar APIs.

Para criar uma API, temos que fazer o nosso código se comportar como um “servidor”. E é por isso que é imprescendível o uso de alguma biblioteca para isso acontecer. Com Javascript, você pode utilizar o Express.

Para instalar o Express:

npm install express
## ou
yarn add express

Para montar o ambiente para API, basta utilizar a estrutura:

const express = require('express');
const app = express();
const port = 3000;

// Suas funções aqui

app.listen(port, () => {
  console.log(`Seu servidor irá rodar em http://localhost:${port}`)
});

O que esse pedaço de código faz, é utilizar o Express para montar um servidor na sua máquina que está disponível na URL localhost:3000. O Express estará assistindo à porta 3000 a todo momento, e toda e qualquer requisição feita será identificada pela API.

A partir daí, é o que você quiser fazer. Você pode pegar qualquer função do seu código, e externalizar da forma que você quiser. Como exemplo, vamos tentar montar uma função para realizar a soma de dois números (a e b):

const express = require('express');
const app = express();
const port = 3000;

app.get('/calculo', (request, response) => {
    const a = request.query.a;
    const b = request.query.b;
    const result = parseFloat(a) + parseFloat(b);

    response.send({
        message: `O resultado é: ${result}`,
        result: result,
    });
});

app.listen(port, () => {
  console.log(`Seu servidor irá rodar em http://localhost:${port}`);
});

No código acima, estamos dizendo que toda requisição com método GET para a URL http://localhost:3000/calculo com os parametros a e b, como http://localhost:3000/calculo?a=2&b=5 irão fazer um cálculo de a + b e devem retornar a mensagem “O resultado é 7”.

Perceba que todas as funções são ligadas diretamente a variável app, ela que é sua API. É com ela que você cria as suas “rotas”, e externaliza cada função sua. O que cada função vai fazer, e a regra que será aplicada é você que define em seu código.

Ainda tem mais!

Ainda tem muita coisa para falar com API. Este texto aborda o assunto de forma bem genérica, e API um tema bastante extenso, não é atoa que temos profissionais focados em desenvolver apenas APIs, o desenvolvedor backend.

Costumamos até utilizar frameworks mais complexos, cheios de funcionalidade, como, por exemplo o NestJS ou AdonisJS. E claro, você também pode fazer APIs com outras linguagens. Temos o Flask e Django como frameworks de APIs para Python, temos o Laravel para PHP, Springboot para Java e por aí vai.

Nós vamos evoluir bastante nesse assunto nos próximos textos! Nos acompanhe no Discord, se inscreva em nossa newsletter e fique por dentro da devGo!