Se há uma ferramenta que a maioria dos programadores ama, sem dúvidas é o terminal. Seja você usuário do Windows, Linux ou Mac; os respectivos terminais sem dúvidas devem fazer parte do seu dia a dia como desenvolvedor. Seja para navegar entre os diretórios, executar scripts, etc.

Algo muito recorrente em que o terminal é muito útil é nos dar um feedback sobre o status das nossas aplicações, normalmente em forma de logs. Agora, já pensou se além de texto, também pudéssemos usar imagens para notificar eventos em nossas aplicações?

Imagens no terminal? É isso mesmo! Neste artigo apresentarei o terminal-image, um pacote do Node muito simples que nos permite renderizar imagens (até mesmo em Full HD no iTerm) com poucas linhas de código.

Exibindo imagens no terminal

Este pacote é um projeto de código aberto (sob licença MIT) do Sindre Sorhus que apesar de ainda não ser muito famoso, sem dúvidas é bem interessante. A ideia é que com ele a gente consiga exibir imagens no terminal (desde que ele suporte cores) de forma bem simples e objetiva.

O primeiro passo é criar um projeto Node (usando o bom e velho npm init) e então importar o pacote para o projeto com o comando:

npm install --save terminal-image

Agora precisamos escolher uma imagem para exibir. Escolha uma que de preferência esteja no formato jpg ou png. Eu, por exemplo, fiz o teste com a foto de perfil do meu site. Assim que escolher, importe para a raiz do seu projeto.

Feito isso, utilizaremos o método file() passando por parâmetro o caminho da imagem. Este método retornará uma Promise. Utilizaremos então o mecanismo de async/await para conseguir colocá-la no console.

Ainda não manja direitinho como funciona o async/await? Te convido a dar uma olhada no meu curso sobre o assunto! Está completão e baratinho!

Parece complicado? Não esquenta que é mais fácil do que parece. Seu código deverá ficar mais ou menos assim:

const terminalImage = require('terminal-image');

(async () => {
	console.log(await terminalImage.file('diegopinho.jpg'));
})();

Note que ali utilizei o diegopinho.jpg como parâmetro. No seu caso, deve ser o nome da imagem que você inseriu no projeto.

Para fazer funcionar, basta subir o seu projeto no terminal! Veja só o resultado que legal:

Exibindo imagens remotas

Caso queira fazer uma brincadeira mais complexa, podemos utilizar o pacote got para exibir imagens remotas. Para isso, o primeiro passo é importar o pacote para dentro do projeto:

npm install --save got

Feito isso, altere o index.js para o seguinte código:

const terminalImage = require('terminal-image');
const got = require('got');

(async () => {
	const {body} = await got('http://diegopinho.com.br/assets/images/uploads/avatar/avatar-195x195.png', {encoding: null});
	console.log(await terminalImage.buffer(body));
})();

Note que houveram algumas mudanças. A primeira delas é que utilizamos o got para buscar a imagem no endereço que eu passei (no caso, a localização da mesma imagem, mas no meu site pessoal). Junto a ele, passamos um objeto definindo que o encoding é nulo. Depois disso, usamos o método buffer(), que assim como o file(), também nos retorna uma Promise.

O resultado é mesmo! (ele só irá demorar mais porque precisará buscar a imagem na internet).

Conclusão

Depois disso tudo, você pode estar se perguntando: “Pra que eu vou usar isso?”. Talvez o pacote não tenha nenhuma aplicação prática real dentro do seu projeto, mas pode tornar seus processos de build/testes mais divertidos, como por exemplo:

Afinal de contas, em um mundo tão estressante como o de desenvolvimento de software, o que custa uma brincadeira inofensiva para descontrair?