Aplicação Descentralizada (DApp) com Ethereum e Ganache
Olá pessoal.
Ultimamente estive focando os estudos em Blockchain, Ethereum e tecnologias similares. Blockchain é um universo a parte, as possibilidades em aplicações são inúmeras. Nesse artigo, meu objetivo é apresentar uma alternativa de deploy em uma DApp. Mas, o que é uma DApp? Você deve está se perguntando.
Embora o conceito seja bem novo, há alguns fatores que podemos elencar em uma DApp:
- Descentralização: Aqui, umas das características mais importantes desse tipo de aplicação. Todos os registros da operação do aplicativo devem ser armazenados em uma blockchain pública e descentralizada para evitar armadilhas da centralização.
- Incentivo: Os validadores da blockchain devem ser incentivados, recompensando-os de acordo com os tokens criptográficos. Existem aplicações descentralizadas em conteúdo, por exemplo, em que os usuários ao utilizarem a rede social, podem ser recompensados pela publicação de conteúdo.
- Protocolo: A comunidade de aplicativos deve concordar com um algoritmo criptográfico para mostrar prova de valor. Por exemplo, o Bitcoin usa a Prova de Trabalho (PoW) e a Ethereum está atualmente usando a PoW com planos para um PoW / Prova de Estaca (PoS) 5 híbrida no futuro.
Você pode ver então que uma DApp (Aplicação Descentralizada), é muito diferente de uma aplicação tradicional. A primeira coisa que você deve ter em mente, ao desenvolver uma Aplicação Descentralizada, é pensar em um problema em que Blockchain possa ser útil. Caso você tenha interesse nesse tipo de conteúdo, recomendo esse link, um artigo do Medium, que comenta diversos negócios que podem ser beneficiados com Blockchain.
Feito um pequeno resumo inicial sobre Blockchain, vamos agora a parte que interessa. Para dar os passos iniciais na construção de uma DApp, você deve escolher algumas das plataformas disponíveis no mercado, ou até mesmo, criar a sua própria plataforma de desenvolvimento. O projeto que vou mostrar no artigo, utiliza a plataforma Ethereum.
A plataforma Ethereum é muito popular e vem sendo adotada como uma das principais plataformas para construção de um Smart Contract (leia-se backend para uma DApp). A linguagem de programação que é utilizado no Ethereum, é Solidity. Para tornar o desenvolvimento em Ethereum mais produtivo, você pode utilizar alguma stack de desenvolvimento em Ethereum, como o Truffle. Para baixar em sua máquina, será necessário, primeiramente instalar o NodeJS. Ao instalar o NodeJS, automaticamente será instalado e configurado em sua máquina, o seu gerenciador de pacotes chamado npm. Por isso, que o Truffle é instalado numa máquina pelo comando:
npm install truffle -g
Ou seja, instale o módulo Truffle globalmente (parâmetro -g). A partir daí, você pode dá início ao desenvolvimento de suas aplicações descentralizadas com o Truffle. Quero compartilhar ainda sobre o Truffle, uma iniciativa bem legal, o Truffle Box. Nós comentamos acima que o Truffle é uma stack de desenvolvimento para Smart Contract (backend de uma DApp). Isso mesmo, um Smart Contract, não é uma aplicação end to end. É apenas o backend. Todo o processamento, lógica de negócio, é realizado aqui. Mas nós sabemos, no que tange a desenvolvimento web, que é o frontend, que apresenta a interface de usuário (UI), e é responsável pela interface na qual o usuário irá se comunicar dentro da aplicação. Pois bem, para termos uma DApp, precisamos então do backend e do frontend. Com o backend, nós definimos utilizar o Solidity, já no frontend, você pode escolher algumas linguaens que tenham compatibilidade e conseguem se comunicar bem com o Blockchain. Javascript, Go, Python, são linguagens que podemos citar aqui, que tem uma boa interoperabilidade com Blockchain. Javascript, leva vantagem, por quê, possui diferentes bibliotecas e frameworks focados em frontend e UI. Aqui entra então o Truffle Box, que comentamos acima. No site do Truffle, eles disponibilizam algumas aplicações ‘templates’, que contêm uma estrutura padrão, tanto para o backend, quando frontend. Abaixo, uma imagem, para apresentar melhor essa feature do Truffle.
Para esse projeto, usamos o box pet-shop que pode ser encontrada nesse link. Definido então, a plataforma de desenvolvimento da Blockchain escolhida e a linguagem de desenvolvimento no frontend, só nos resta escolher o principal, uma ferramenta que permita executar a Blockchain propriamente dita. Isso mesmo, é muita coisa que precisamos para desenvolver uma DApp. A boa notícia, é que para esse fim, temos uma excelente ferramenta capaz de executar e processar as transações de uma Blockchain, o Ganache. O Ganache é um dos produtos mantidos pelo Truffle, então é uma escolha mais do que indicada se você pretende usar o Truffle no seu projeto. Para instalar o Truffle, é só acessar esse link.
Agora que o Ganache foi instalado, você pode executá-lo e mantê-lo em execução durante todo o desenvolvimento e conclusão da aplicação. Ao abri-lo, selecione a opção Quickstart. O resultado será esse:
A partir desse momento, você tem uma Blockchain em execução, sendo intermediada pelo Ganache. Cada um dos Address, poderá ser usado posteriormente na execução da DApp. Na imagem acima, um dos itens mais importantes, é o RPC Server. Você deve copiar esse endereço, pois utilizaremos ele na aplicação.
Na aplicação pet-shop que você baixou o esqueleto pelo Truffle Box, terá um arquivo de configuração chamado truffle-config.js. Esse arquivo, você deve informar o endereço RPC Server do Ganache.
Perceba que os valores para a propriedade host e port, estão semelhantes ao RPC Server que o Ganache gerou.
Estamos prontos para desenvolver o Smart Contract com o Solidity. Mais antes, vamos só apresentar o propósito da aplicação pet-shop. A aplicação é bem simples. Temos um arquivo json, que contêm informações de cachorros, como nome, idade, imagem, etc. Esse arquivo json, será lido, e com as informações do arquivo, criaremos dinamicamente a interface (UI) da aplicação. Para cada cachorro que tivermos no arquivo json, além de todas as suas informações serem apresentadas na aplicação, teremos um botão ‘Adotar’. Aqui está o coração do Smart Contract. Vamos gerenciar as adoções para um cachorro, utilizando Blockchain. Assim, que um cachorro estiver sido adotado, temos uma flag que controla o evento na aplicação e o botão para Adotar, ficará desabilitado.
No código acima, podemos ver que estamos utilizando a linguagem o compilador da linguagem solidity com a versão 0.4.22. Perceba que temos apenas uma variável. A variável adotantes. Essa variável, vai receber o endereço da Blockchain do Ganache, que executamos anteriormente. Por isso, que o tipo de dado da variável é address, contendo um tamanho de 16 caracteres. Quanto a primeira função, a função getAdopters(), simplesmente daremos um retorno na variável que criamos. Por meio dessa função, faremos uma associação para saber se um determinado cachorro foi adotado por aquele adotante. A outra função, a função adopt(), vamos realizar o processamento de uma adoção. Para isso, vamos requerer inicialmente, que o petId, o parâmetro que passamos na função, tenha o mesmo tamanho da nossa variável address. Por isso, que no código abaixo, vamos indexar cada um dos adotadores pelo petId, e por meio do msg.sender, vamos conseguir capturar o proprietário do contrato que realizou a adoção de um cachorro. Mas como eu consigo essa informação, você deve está se perguntando.
É aí que entra outro componente de nossa aplicação, o provider que fará o intermédio entre a DApp e a Blockchain. Esse provider, pode ser criado por meio do Geth, ou você pode utilizar uma outra ferramenta que também é muito útil para esse fim, o MetaMask. O MetaMask é uma extensão que pode ser adicionado ao navegador web. Assim, que a DApp, for executada, o Metamask será acionado, e a cada transação na DApp, terá uma janela de confirmação no metamask. Caso a transação seja aceita, será descontado gas do ether de sua conta.
A imagem acima, representa que estamos na rede truffle. Essa rede, foi criada por meio da opção RPC Personalizada, e sabe o que passamos nesse endereço? Exatamente, o endereço RPC Server do Ganache. A partir daí, temos conexão entre o Ganache e o Metamask. Já estamos quase finalizando, falta apenas realizar o deploy do Smart Contract no truffle e realizar as interações necessário no lado do frontend. Para realizar o deploy do Smart Contract que desenvolvemos acima, é só digitar no terminal, o comando truffle deploy. Para isso, é necessário a configuração que fizemos acima, conectando nosso Smart Contract no Ganache. O resultado do deploy do Smart Contract, é salvo em um arquivo .json, com o mesmo nome do contrato, que pode ser visto na imagem abaixo:
Definindo o provider do Metamask para nossa aplicação como padrão, podemos relacionar o arquivo json acima, que foi gerado pelo deploy do SmartContract, com o SmartContract que desenvolvemos anteriormente no Solidity. É o que fazemos na função initContract.
Quando finalizamos a associação entre o arquivo json gerado e o SmartContract desenvolvido, chamamos o método markAdopted(), e já conseguimos interagir com o SmartContract diretamente no frontend, utilizando a biblioteca web3js, que vem junto com a stack do Truffle.
Na linha 77 usamos o método deployed(), para conseguir capturar detalhes da instância do Smart Contract, caso isso dê certo, já chamamos um dos métodos que definimos no SmartContract, o getAdopters(). Aquele método indicava se um determinado cachorro foi associoado ou não com um adotante, é por isso que fazemos uma condição no código acima. Quando houver a associação, o botão de Adoção ficará desabilitado na aplicação e o texto do botão será alterado para Sucesso. É isso que fazemos na linha 84.
Agora só falta a interação com o segundo método. Nesse, precisaremos recuperar o id de cada um dos cachorros, bem como a conta de endereço que estivermos usando no Metamask. Definimos isso na função handleAdopt, que pode ser vista abaixo:
Na linha 95, recuperamos o id do cachorro de acordo com o evento de clique que realizarmos na aplicação. Nas linhas 98 a 100, tentamos recuperar a conta de endereço do proprietário que estamos usando no Metamask. Depois que isso estiver ok, podemos buscar novamente a instância do nosso SmartContract e chamar o método adopt(), que foi definido no Smart Contract em Solidity. Esse método requer dois parâmetros, o id do cachorro e o proprietário da conta de endereço do Metamask. Usamos uma promise, caso a função dê tudo certo, chamamos o método markAdopted() que foi discutido acima, onde associamos o cachorro com seu adotante, e atualizamos o texto do botão para Sucesso. Caso a função promisse der errado, será retornado um erro no console do navegador.
Ufa. Muita coisa não é verdade? Mas o bacana de tudo isso, é que agora temos um DApp construída. O resultado final pode ser visto por meio do gif a seguir. Na apresentação do gif, mostro algumas informações adicionais, como por exemplo, importar uma conta do Ganache, usando o MetaMask.
Espero ter contribuído um pouco mais para o conhecimento de aplicações descentralizadas (DApp) em Blockchain, utilizando a plataforma Ethereum. No próximo artigo, mostrarei como podemos fazer o deploy de nossa DApp. Vai ser bem legal. Até a próxima!!
Referências:
