WEB3DEV

Cover image for Near - Exemplo Livro de visitas
Daniel Cukier
Daniel Cukier

Posted on

Near - Exemplo Livro de visitas

Artigo original: https://examples.near.org/guest-book

Abrir no Gitpod

Navegar no Github

Faça sign in com NEAR e adicione uma mensagem ao livro de visitas! Um app inicial construído com AssemblyScript no backend e React no frontend.

Início rápido

Para executar este projeto localmente:

  1. Pré-requisitos: Certifique-se de ter o Node.js ≥ 12 instalado (https://nodejs.org); e o utilize para para instalar o yarn: npm install --global yarn (ou apenasnpm i -g yarn)
  2. Execute o servidor local de desenvolvimento: yarn && yarn dev (avalie o arquivo package.json para uma lista completa de scripts que você pode executar com o yarn)

Agora você tem um ambiente local de desenvolvimento apoiado pela NEAR TestNet! Ao executar yarn dev , você receberá a URL que poderá utilizar no seu navegador para acessar o aplicativo.

Explorando o código

  1. O código do backend fica na pasta /assembly . Este código é implantado na blockchain NEAR quando você executa yarn deploy:contract. Esse tipo de código que é executado na blockchain é chamado de "contrato inteligente" (ou smart contract) – saiba mais sobre os contratos inteligentes da NEAR.
  2. O código do frontend fica na pasta /src. /src/index.html é um ótimo lugar para começar a explorar. Observe que ele carrega em /src/index.js, onde você pode aprender como o frontend se conecta à blockchain NEAR.
  3. Testes: existem diferentes tipos de testes para o frontend e o backend. O código do backend é testado com o comando asp, utilizado para os testes do AssemblyScript, e o comando jest para executar os testes do frontend. Você pode executar ambos ao mesmo tempo com yarn test.

Tanto o código do contrato quanto o do lado do cliente serão recarregados automaticamente (auto-reload) conforme você altera os arquivos do código-fonte.

Deploy

Cada contrato inteligente na NEAR tem sua própria conta associada. Quando você executa yarn dev, seus contratos inteligentes são implantados na NEAR TestNet real com uma conta descartável. Quando você estiver pronto para torná-lo permanente, basta seguir os procedimentos abaixo.

Etapa 0: Instalar o near-cli

Você precisa do near-cli instalado globalmente:

npm install --global near-cli
Enter fullscreen mode Exit fullscreen mode

Isso lhe dará o CLI NEAR. Certifique-se de que esteja instalado com:

near --version
Enter fullscreen mode Exit fullscreen mode

Passo 1: Criar uma conta para o contrato

Visite NEAR Wallet e crie uma conta. Você fará o deploy desses contratos inteligentes nesta nova conta.

Depois disso, autorize o NEAR CLI para esta nova conta e siga as instruções indicadas:

near login
Enter fullscreen mode Exit fullscreen mode

Etapa 2: Definir o nome do contrato

Modifique a linha em src/config.js que define o nome da conta do contrato. Defina-o para o ID da conta que você usou acima.

const CONTRACT_NAME = process.env.CONTRACT_NAME || 'sua-conta-aqui!'
Enter fullscreen mode Exit fullscreen mode

Etapa 3: Alterar a URL remota, se você clonou este repositório de código

A menos que você tenha feito um fork deste repositório, você precisará alterar a URL remota para um repositório ao qual você tenha acesso para realizar commits. Isso permitirá o deploy automático no Github Pages a partir da linha de comando.

1) vá para o GitHub e crie um novo repositório para este projeto

2) abra seu terminal e na raiz do projeto digite:

`git remote set-url origin https://github.com/SEU_USUARIO/SEU_REPOSITORIO.git `
Enter fullscreen mode Exit fullscreen mode

Etapa 4: Deploy!

Apenas um comando:

yarn deploy
Enter fullscreen mode Exit fullscreen mode

Como você pode ver no arquivo package.json, ele faz duas coisas:

  1. Faz o build e o deploy do contrato inteligente na NEAR TestNet
  2. Faz o build e o deploy do código-fonte do frontend no GitHub usando gh-pages. Isso só funcionará se o projeto já tiver um repositório configurado no GitHub. Sinta-se à vontade para modificar o script de deploy no arquivo package.json caso queira implantá-lo em outro lugar.

Top comments (0)