Construir um Dapp Completo no Aptos

Uma maneira comum de aprender um novo framework ou linguagem de programação é construir uma lista de tarefas simples. Neste tutorial, aprenderemos como construir um dapp de lista de tarefas completo, começando do lado do contrato inteligente até o lado frontend e finalmente o uso de uma carteira para interagir com os dois.

Veja o código completo no código-fonte.

Após atender aos pré-requisitos e configurar conforme descrito abaixo, você seguirá este tutorial nesta ordem:

1. Criar um contrato inteligente
2. Configurar um frontend
3. Buscar dados da chain
4. Enviar dados para a chain
5. Manipular tarefas

Você deve ter:

• node e npm

Embora expliquemos algumas decisões do React, não vamos nos aprofundar em como o React funciona; então assumimos que você tem alguma experiência prévia com React.

Nesta seção, criaremos um diretório meu-primeiro-dapp para conter nossos arquivos de projeto, tanto código do lado cliente (baseado em React) quanto código Move (nosso contrato inteligente).

Para isso, usaremos create-aptos-dapp para criar o projeto.

1. Abra um terminal e navegue até o diretório desejado para o projeto (por exemplo, o diretório Desktop).
2. Execute npx create-aptos-dapp@latest para criar o projeto.

npx create-aptos-dapp@latest

3. Siga as instruções para criar o projeto.

• Escolha um nome para o projeto, por exemplo meu-primeiro-dapp.
• Escolha a opção Projeto full-stack.
• Escolha a opção Template Boilerplate.
• Para simplicidade, escolha não usar Surf.
• Escolha a opção de framework App Vite.
• Escolha a opção de rede Devnet.

A ferramenta criará o projeto em um diretório com o mesmo nome do projeto e instalará as dependências necessárias.

Siga as instruções dos Próximos Passos.

Agora vamos criar um contrato inteligente.