Criando um rastreador de portfólio Web3 com API DeCommas

A tecnologia Blockchain desencadeou o surgimento de uma indústria totalmente nova, amplamente conhecida como “Web3”, uma nova fronteira na economia digital onde a descentralização, a interoperabilidade e a capacitação dos utilizadores são colocadas em primeiro plano.

Como parte do surgimento da Web3, diversas novas classes de ativos estão se tornando disponíveis para as massas. Criptomoedas como Bitcoin e Ethereum são um produto básico bem conhecido dos ativos web3, mas desde o surgimento das finanças descentralizadas e dos NFTs, a variedade de classes de ativos baseados em blockchain está aumentando rapidamente.

Com essa complexidade crescente nos ativos Web3, os usuários estão procurando maneiras convenientes de acompanhar seus ativos através de blockchains e protocolos Web3. Introduzir o Rastreador de portfólio , uma plataforma conveniente que se conecta a uma parede Web3 e fornece uma visão geral abrangente de seus saldos e posições:

Neste artigo, forneceremos um passo a passo para desenvolvedores web3 e curiosos em web3 criarem seu próprio recurso de rastreamento de portfólio, usando o aplicativo gratuito API de controle de missão da DeCommas .

O que é a “API de controle de missão” do DeCommas?

A API DeCommas é uma API amigável ao desenvolvedor que fornece acesso rápido e conveniente a dados estruturados de blockchain. Sobre https://build.decommas.io/ os desenvolvedores podem obter acesso a chaves de API gratuitas em questão de segundos, fornecendo acesso a uma das APIs Web3 de cadeia cruzada mais rápidas do mercado.

Como desenvolvedor, você pode acessar e consultar os dados armazenados em vários blockchains com tempos de resposta extremamente rápidos, abaixo de 150 ms, gratuitamente. Também não há necessidade de duplicar várias chamadas de API, pois a resposta da API é cruzada por padrão.

Recentemente, a equipe DeCommas dobrou sua aposta no OP Stack, adicionando suporte para opBNB e Base L2 também.

Caso você esteja curioso sobre a API, a documentação completa está disponível aqui .

Tutorial: Construindo um Rastreador de Portfólio usando API Mission Control

Neste tutorial, ajudaremos você a construir um recurso de rastreamento de portfólio. Usaremos a API Mission Control e faremos uso de endpoints para buscar saldos ERC20, participações NFT e até posições de protocolo.

Neste tutorial, iremos:

• Mostrar como obter sua chave da API Mission Control
• Configure a API Mission Control em seu ambiente
• Saiba mais sobre a chamada da API e sua resposta
• Crie recursos fundamentais para o seu rastreador de portfólio

Vamos mergulhar!

Obtenha sua chave pessoal da API Mission Control

A API DeCommas Mission Control é necessária para concluir este tutorial. Seu uso é gratuito, oferece suporte a consultas entre cadeias por padrão e atinge tempos de resposta extremamente altos.

Obter acesso é simples:

1. Dirigir a https://build.decommas.io/
2. Clique em “Começar”
3. Insira o seu endereço de email
4. Verifique seu e-mail e clique no link para cantar
5. Agora você poderá acessar https://dashboard.decommas.io/ , que contém suas chaves de API

Você precisará de suas chaves de API para concluir este tutorial, então vá em frente e copie-as e cole-as em algum lugar onde sejam fáceis de encontrar para você, mas armazenadas com segurança. Para este tutorial, a documentação do DeCommas também será útil: https://docs.decommas.io/

Configurando a API Mission Control em seu ambiente

Dependendo de suas preferências, você pode interagir com a API por meio de uma solicitação HTTPS bruta ou em JavaScript usando nosso SDK.

Caso você opte pela primeira rota, a chamada ficaria assim:

 https://datalayer.decommas.net/datalayer/api/v1/tokens/{address}?api-key={YOUR-API-KEY}

No entanto, para este tutorial, usaremos o SDK JavaScript fornecido e o guia de início rápido para iniciar a API Mission Control em seu ambiente.

SDK DeCommas: https://github.com/DeCommas/decommas-sdk

1. Instale o aplicativo Mission Control API em seu ambiente Javascript

 npm install @decommas/sdk

2.Depois de instalar o aplicativo você pode importar e usar o SDK:

 import { Decommas } from '@decommas/sdk'; // Allows to use SDK in DEV-ONLY mode const decommas = new Decommas(); const getVitalikERC20Balances = async () => { const address = '0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045'; // any address const tokens = await decommas.address.getTokens({ address }); console.log(tokens); };

Agora você está pronto e pronto para chamar a API!

Construindo recursos fundamentais do Portfolio Tracker

Agora você está familiarizado com o SDK e puder acessar a API, vamos criar alguns recursos do mundo real!

Um bom Portfolio Tracker precisa fornecer insights sobre as participações do ERC-20, o valor dessas participações e o histórico de transações do usuário. Daremos a você uma introdução sobre todos os três!

1. Obtenha saldos ERC-20 atuais para uma carteira

Para que um usuário saiba quais e quantos tokens ERC-20 ele possui, usaremos o Ponto final de tokens ERC-20 mais uma vez.

Ao fornecer o endereço da carteira do usuário para a chamada da API, a API retorna uma visão geral dos tokens ERC-20 em todas as redes suportadas. Neste caso, para o endereço da carteira 0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045, a API retornará uma matriz de tokens junto com seus saldos correspondentes.

A API responderá com um array limpo contendo tokens, as cadeias em que estão e seus respectivos saldos. Você pode usar esses dados para fornecer uma visão geral em seu Portfolio Tracker, por exemplo, mostrando uma lista de tokens que um usuário possui, classificados pelo valor total de cada token.

 { "count": 2, "status": 200, "result": [ { "chain_name": "mainnet", "chain_id": 1, "address": "0x228ba514309ffdf03a81a205a6d040e429d6e80c", "name": "Global Social Chain", "decimals": 18, "symbol": "GSC", "logo_url": "https://assets.coingecko.com/coins/images/4304/large/global-social-chain.png?1547742843", "actual_price": "0.00147295", "is_verified": true, "is_stable": false, "amount": "20000000000000000000" }, { "chain_name": "mainnet", "chain_id": 1, "address": "0x38e4adb44ef08f22f5b5b76a8f0c2d0dcbe7dca1", "name": "Concentrated Voting Power", "decimals": 18, "symbol": "CVP", "logo_url": "https://assets.coingecko.com/coins/images/12266/large/Powerpool.jpg?1598621373", "actual_price": "0.433299", "is_verified": true, "is_stable": false, "amount": "42130000000000000000" } ] }

2. Informar o valor dos tokens ERC-20 em USDC

Embora saber quanto de token um usuário possui seja uma informação valiosa, muitos usuários gostariam de ver o valor de seus ativos expresso em dólares americanos.

Vamos dar uma olhada na resposta do endpoint ERC-20 Tokens:

 { "count": 2, "status": 200, "result": [ { "chain_name": "mainnet", "chain_id": 1, "address": "0x228ba514309ffdf03a81a205a6d040e429d6e80c", "name": "Global Social Chain", "decimals": 18, "symbol": "GSC", "logo_url": "https://assets.coingecko.com/coins/images/4304/large/global-social-chain.png?1547742843", "actual_price": "0.00147295", "is_verified": true, "is_stable": false, "amount": "20000000000000000000" }, { "chain_name": "mainnet", "chain_id": 1, "address": "0x38e4adb44ef08f22f5b5b76a8f0c2d0dcbe7dca1", "name": "Concentrated Voting Power", "decimals": 18, "symbol": "CVP", "logo_url": "https://assets.coingecko.com/coins/images/12266/large/Powerpool.jpg?1598621373", "actual_price": "0.433299", "is_verified": true, "is_stable": false, "amount": "42130000000000000000" } ] }

Usando a variável “actual_price”, você pode mostrar ao usuário a soma de seus ativos expressos em dólares americanos. Dependendo do que você tem em mente para o seu Portfolio Tracker, você pode considerar mostrar a quantidade de tokens por token, combinada com um valor total em USDC que o usuário possui naquele token. Para isso você pode usar “Nome”, “Símbolo”, “Valor” e “Preço Real”.

Concluindo - Seus primeiros passos para construir seu web3 Portfolio Tracker

É claro que este é apenas o começo para construir seu Rastreador de Portfólio. Quer saber mais sobre como expandir seu Portfolio Tracker? Fique de olho em DeCommas HackerNoon , já que novos tutoriais do web3 são postados com frequência!

Começar no desenvolvimento web3 pode parecer assustador, mas usando a API Mission Control da DeCommas você pode acelerar tremendamente o processo. A utilização de apenas algumas chamadas diretas de API já permite acesso a muitos dados armazenados em blockchain, gratuitamente.

Gostou deste Tutorial e quer saber mais? Acompanhe DeCommas HackerNoon , onde publicamos regularmente tutoriais de desenvolvimento Web3 como este! Já sabe tudo o que precisa e deseja desenvolver? Vá para build.decommas.io e use a API Mission Control a seu favor!