WEB3DEV

Cover image for Construa sua Própria Coleção NFT com QuickNode e Optimism
Isabela Curado Nehme
Isabela Curado Nehme

Posted on

Construa sua Própria Coleção NFT com QuickNode e Optimism

https://cdn.hashnode.com/res/hashnode/image/upload/v1693830816842/6ba52adb-550f-4ac8-866f-a1cda6c26afd.jpeg?w=1600&h=840&fit=crop&crop=entropy&auto=compress,format&format=webp

ÍNDICE

Requisitos

O Que é o QuickNode IPFS?

O Que é o Optimism?

Quais são as Etapas?

Armazenando Arquivos em IPFS

Criação e Implantação do Contrato Inteligente NFT

Criação de um Ponto de Extremidade do Optimism no QuickNode

Configurando sua Carteira Web3 com QuickNode

Compilando o Contrato Inteligente

Cunhando um NFT

🎉BOOM🎉

Construir e implantar sua própria coleção NFT pode consumir tempo e dinheiro, especialmente com os preços do gás na Ethereum. Com o surgimento de soluções de camada 2 e RPCs baratos, esse não precisa ser o caso! Este tutorial explicará a construção de uma coleção NFT usando o padrão de token ERC-721. Você armazenará todos os ativos e metadados NFT em IPFS com QuickNode e implantará o contrato inteligente na rede de teste Goerli da Optimism.

Requisitos

  1. Ter conhecimentos básicos sobre o desenvolvimento em Solidity será útil, mas não é obrigatório.
  2. Conhecimentos básicos do padrão de token ERC-721 serão úteis, mas não é obrigatório.
  3. Conhecimentos básicos do IDE (Integrated Development Environment ou ambiente de desenvolvimento integrado) Remix serão úteis, mas não é obrigatório.
  4. Ativos de imagem e metadados das coleções NFT.
  5. MetaMask ou qualquer outra carteira e uma pequena quantidade de ETH de teste Goerli.
  6. Uma conta QuickNode gratuita.

O Que é o QuickNode IPFS?

O serviço IPFS (Interplanetary File System ou sistema de arquivo interplanetário) QuickNode permite armazenar dados descentralizados usando IPFS. Seus arquivos são automaticamente distribuídos e replicados em data centers (centro de dados) globais, garantindo redundância e distribuição por toda a rede.

O Que é Optimism?

O Optimism é uma solução de escalonamento de camada 2 que os desenvolvedores da Ethereum escolhem por sua velocidade e baixos custos de transação, mantendo total compatibilidade com a EVM (Ethereum Virtual Machine ou máquina virtual Ethereum).

Quais São as Etapas?

  1. Armazenar ativos e metadados NFT no IPFS do QuickNode IPFS.
  2. Criar e implantar um contrato ERC-721 na rede de teste Goerli da Optimism.
  3. Interagir com o contrato inteligente para cunhar NFTs.
  4. Ver seus NFTs no OpenSea.

Armazenando Arquivos em IPFS

Primeiro, você carrega suas imagens e metadados via QuickNode.

Abra o site do QuickNode e navegue até a seção “Storage” (armazenamento). Clique no botão ”Add a file” (adicionar um arquivo) e selecione o arquivo em sua máquina local.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692864842685/265225f1-fdff-4a0f-bf08-10df2ca1353c.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Depois de fazer upload do arquivo, ele aparecerá assim, mostrando o nome do arquivo, CID, status e outras informações sobre o arquivo.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692865232027/369a9abb-568a-4e1d-ac3a-2c2e61eef173.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Faça upload de imagens para cada um dos NFTs. Você encontrará todas as imagens no GitHub. O resultado será semelhante a este.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692867518088/2ac00c65-2f3e-49b4-a368-baf62c1a4226.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Crie três arquivos de metadados JSON para armazenar informações sobre nossas coleções NFT.

  • 0.json: Coleção Agra
  • 1.json: Coleção Delhi
  • 2.json: Coleção Goa

O arquivo 0.json deve ficar parecido com isto:

{
  "name": "Agra",
  "description": "Agra is a historic city in northern India, renowned for the iconic Taj Mahal, a marble mausoleum. It's a UNESCO World Heritage site and symbolizes love and architectural splendor. Agra also boasts Agra Fort and Fatehpur Sikri, both reflecting the city's Mughal heritage and attracting countless tourists for their cultural significance. (Agra é uma cidade histórica no norte da Índia, conhecida pelo icónico Taj Mahal, um mausoléu de mármore. É Património Mundial da UNESCO e simboliza o amor e o esplendor arquitetónico. Agra também possui o Forte de Agra e Fatehpur Sikri, ambos refletindo a herança Mughal da cidade e atraindo inúmeros turistas pelo seu significado cultural.)",
  "image": "ipfs://Qmdr1zPumimEFKRkszo3nfFhGQ3UwofQXMbfDy1wd1gdLQ",
  "properties": {
    "rarity": "a bit rare (um pouco raro)",
    "fanciness": 8
  }
}
Enter fullscreen mode Exit fullscreen mode
  • name: contém o nome do NFT.
  • description: contém a descrição do NFT.
  • image: inclui o link para a imagem obtida anteriormente (URL IPFS).
  • properties: abrange os vários atributos do NFT.

Crie os arquivos JSON restantes 1.json e 2.json, para as coleções de Delhi e Goa. Você encontrará o exemplo de metadados no GitHub.

Da mesma forma, carregue sua pasta de metadados para o QuickNode IPFS. Depois de carregado com sucesso, ele aparecerá conforme mostrado:

https://cdn.hashnode.com/res/hashnode/image/upload/v1692874812751/79aa6d1d-7d71-4df8-8257-6beac718ed0a.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Você pode visualizar o arquivo JSON clicando no nome do arquivo no painel do QuickNode IPFS.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692875218884/4fda8d2e-8f92-4ae4-8944-268330d2c3c6.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Agora clique em “COPY IPFS URL” (COPIAR URL IPFS) para copiar o CID e o link do gateway, permitindo o acesso ao arquivo. Por exemplo, este é o link para o arquivo 0.json.

quicknode.quicknode-ipfs.com/ipfs/QmQQEjRjh..

https://cdn.hashnode.com/res/hashnode/image/upload/v1692875496119/12994666-7593-4e14-b459-95f67d3bc825.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Criação e Implantação do Contrato Inteligente NFT

Use a biblioteca de contratos OpenZeppelin para criar um contrato ERC-721 e implantá-lo na rede de teste Goerli da Optimism usando o IDE Remix. Certifique-se de ter algum Ether da Goerli, que você pode obter na torneira do Quicknode Optimism.

Crie um novo arquivo nomeado QuickNft.sol no IDE Remix e cole o seguinte código:

// SPDX-License-Identifier: MIT
pragma solidity 0.8.17;

import "@openzeppelin/contracts/token/ERC721/extensions/ERC721Enumerable.sol";
import "@openzeppelin/contracts/access/Ownable.sol";
import "@openzeppelin/contracts/utils/Strings.sol";

error NFT_NOT_EXIST();
error YOU_ALREADY_MINTED_NFT();
error ALL_NFTS_ARE_MINTED();

contract QuickNft is ERC721Enumerable, Ownable {
    uint256 public supplies = 500;
    uint256 public minted;
    string[] public cid = [
        "ipfs://QmQQEjRjhUQPgJ51U2PKkwyRLgktzGWmX95vgUzWfBj5gb",
        "ipfs://Qmch5VaqXCc5ZbwKuL2awac1vrBXBBPiB5h7WxtYKDZ7DS",
        "ipfs://QmQg5wf1KHLDA1pEg51wK44UqPa6wJztTxppgb92VyPEbR"
    ];

    constructor() ERC721("QuickNft", "QNN") {}

    /**
     * @notice função para colocar NFT no Opensea
     * @param _cidId ID dos metadados do NFT que queríamos cunhar
     * @dev tokenURI substitui a implementação do ERC721 da Openzeppelin ERC721 para a função tokenURI  
     * Essa função devolve o URI de onde podemos extrair os metadados para um determinado tokenId
     */
    function tokenURI(
        uint256 _cidId
    ) public view virtual override returns (string memory) {
        if (_cidId >= cid.length) revert NFT_NOT_EXIST();
        return string(abi.encodePacked(cid[_cidId]));
    }

    /**
     * @notice função para cunhar o NFT
     * @param _cidId CID ID para selecionar o metadado de sua escolha
     */
   function mint(uint256 _cidId) public {
       if (_cidId >= cid.length) revert NFT_NOT_EXIST();
       if (minted + 1 > supplies) revert ALL_NFTS_ARE_MINTED();
       _safeMint(msg.sender, minted);
       unchecked {
           ++minted;
       }
    }

    /**
     * @notice função para obter o número total de NFTs cunhados
     */
    function totalNftMinted() public view returns (uint256) {
        return minted;
    }
}
Enter fullscreen mode Exit fullscreen mode

Vamos analisar o código do contrato inteligente do Solidity acima, linha por linha:

// SPDX-License-Identifier: MIT
Enter fullscreen mode Exit fullscreen mode

Esta linha especifica o identificador de licença do contrato. Neste caso, indica que o contrato está sob licença MIT.

pragma solidity 0.8.17;
Enter fullscreen mode Exit fullscreen mode

Este pragma define a versão do Solidity. Neste caso, o compilador utilizará a versão 0.8.17 do Solidity para a compilação.

import "@openzeppelin/contracts/token/ERC721/extensions/ERC721Enumerable.sol";
import "@openzeppelin/contracts/access/Ownable.sol";
import "@openzeppelin/contracts/utils/Strings.sol";
Enter fullscreen mode Exit fullscreen mode

Essas linhas importam os contratos necessários da biblioteca OpenZeppelin. O contrato ERC721Enumerable ajuda a criar um token ERC-721 que suporta enumeração (listagem de tokens), o contrato Ownable fornecerá funcionalidade básica de propriedade e o contrato Strings será usado para manipular strings.

error NFT_NOT_EXIST();
error YOU_ALREADY_MINTED_NFT();
error ALL_NFTS_ARE_MINTED();
Enter fullscreen mode Exit fullscreen mode

Essas linhas definem mensagens de erro personalizadas que usamos no contrato.

contract QuickNft is ERC721Enumerable, Ownable {
Enter fullscreen mode Exit fullscreen mode

Esta linha define o contrato QuickNft, que herda de ERC721Enumerable e Ownable, portanto o contrato será um token ERC-721 (com recursos de enumeração) e terá funcionalidade de propriedade.

uint256 public supply = 500;
uint256 public minted;
Enter fullscreen mode Exit fullscreen mode

Estas linhas declaram duas variáveis ​​de estado. supply representa o número total de NFTs disponíveis para cunhagem e minted monitora quantos NFTs as pessoas cunharam até o momento.

string[] public cid = [
    "ipfs://QmQQEjRjhUQPgJ51U2PKkwyRLgktzGWmX95vgUzWfBj5gb",
    "ipfs://Qmch5VaqXCc5ZbwKuL2awac1vrBXBBPiB5h7WxtYKDZ7DS",
    "ipfs://QmQg5wf1KHLDA1pEg51wK44UqPa6wJztTxppgb92VyPEbR"
];
Enter fullscreen mode Exit fullscreen mode

Um array cid é definido contendo três URLs IPFS que representam os metadados dos NFTs.

constructor() ERC721("QuickNft", "QNN") {}
Enter fullscreen mode Exit fullscreen mode

O construtor do contrato inicializa o token ERC-721 com “QuickNft” como nome e “QNN” como símbolo.

function tokenURI(uint256 _cidId) public view virtual override returns (string memory) {
    if (_cidId >= cid.length) revert NFT_NOT_EXIST();
    return string(abi.encodePacked(cid[_cidId]));
}
Enter fullscreen mode Exit fullscreen mode

Esta função, tokenURI, substitui o comportamento padrão do ERC721 e retorna a URL IPFS (URI de metadados) associada ao arquivo _cidId.

function mint(uint256 _cidId) public {
    if (_cidId >= cid.length) revert NFT_NOT_EXIST();
    if (minted + 1 > supplies) revert ALL_NFTS_ARE_MINTED();
    _safeMint(msg.sender, minted);
    unchecked {
        ++minted;
    }
}
Enter fullscreen mode Exit fullscreen mode

A função mint permite aos usuários cunhar NFTs. Ele verifica se o _cidId é válido e se o número total de NFTs cunhados está dentro da oferta disponível. Se for esse o caso, ele cria um novo NFT para o chamador e incrementa a contagem minted.

function totalNftMinted() public view returns (uint256) {
    return minted;
}
Enter fullscreen mode Exit fullscreen mode

A função totalNftMinted retorna a contagem total de NFTs cunhados.

Caso você não tenha a rede de teste Goerli da Optimism configurada em sua carteira, siga estes passos:

Criando um Ponto de Extremidade Optimism no QuickNode

Para implantar um contrato inteligente na blockchain de teste da Optimism, Goerli, você precisará de um ponto de extremidade de API para se comunicar com a rede. Vá para o painel QuickNode para configurá-lo.

Uma vez logado, clique no botão "Create an endpoint" (criar um ponto de extremidade) e selecione a cadeia "Optimism" e a rede "Goerli".

Depois de criar seu ponto de extremidade, copie o link do provedor HTTP e mantenha-o à mão, pois você precisará dele em seguida.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692972974293/6532afd7-8c99-4fec-b026-76ddf2f3f989.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Configurando sua carteira Web3 com QuickNode

Defina suas configurações de RPC se estiver usando MetaMask para implantar este contrato. Algumas carteiras compatíveis são Coinbase Wallet, Rainbow Wallet e TrustWallet.

Abra a MetaMask e clique no menu suspenso de rede na parte superior. Depois, clique no botão “Add Network” (adicionar rede).

https://cdn.hashnode.com/res/hashnode/image/upload/v1692981270357/8cf1c8c2-1026-48e8-b20a-f594a2555de8.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Na parte inferior da página, clique em “Add a network manually” (adicionar uma rede manualmente) e preencha os seguintes dados:

  • Nome da rede: Optimism Goerli Testnet
  • Novo URL RPC: insira o URL HTTP do QuickNode que você recuperou anteriormente
  • ID da cadeia: 420
  • Símbolo da moeda: ETH
  • URL do Explorador de Blocos: optimism-goerli.blockscout.com

Deve ficar parecido com isto:

https://cdn.hashnode.com/res/hashnode/image/upload/v1692981515517/200fa9cf-1449-4b1e-8b2c-f6c49309ece1.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Compilando o Contrato Inteligente

Abra o IDE Remix, copie e cole o código acima e navegue até a seção “Deploy” (implantar). Selecione “Injected Web3” como ambiente e implante-o escolhendo o nome correto do contrato. Você precisa selecionar a cadeia em sua carteira MetaMask. No nosso caso, estamos implantando-o na rede de teste Goerli da Optimism com ID de cadeia 420. Clique no botão “Deploy” (implantar).

https://cdn.hashnode.com/res/hashnode/image/upload/v1692972641112/35e866c5-6d16-4580-9b37-870718c7b240.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Aprove a transação na MetaMask clicando no botão “Confirm” (confirmar). Assim que a transação for concluída, seu contrato será implantado.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692982135567/08bd8aae-c524-4765-9397-60925a641940.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Agora você pode executar funções como “mint NFT” (cunhar NFT) inserindo o ID CID. Também podemos recuperar o URI do NFT inserindo o ID CID.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692984714894/6918f5a7-9f13-4b2a-9d22-bb5e9f2e53c5.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Cunhando um NFT

Insira o CID ID do NFT que deseja cunhar e clique no botão “Confirm” (confirmar).

https://cdn.hashnode.com/res/hashnode/image/upload/v1692985097616/de40d378-da01-44f9-a5a9-cd2d348b4a8b.png?auto=compress,format&format=webp&auto=compress,format&format=webp

Depois de algum tempo, você poderá ver o NFT no OpenSea.

https://cdn.hashnode.com/res/hashnode/image/upload/v1692985680055/e4293a0d-8a57-4b6d-a5db-301137afd99e.png?auto=compress,format&format=webp&auto=compress,format&format=webp

🎉BOOM🎉

Você concluiu todo o tutorial. Dê a si mesmo um tapinha merecido nas costas. Você aprendeu como:

  • Criar uma coleção NFT usando o padrão Token ERC-721.
  • Armazenar metadados NFT de maneira descentralizada usando QuickNode IPFS.
  • Compilar e implantar um contrato inteligente na rede de teste Goerli da Optimism.
  • Interigir com o contrato inteligente usando o Remix.

🎉 Bônus por persistir até o fim: use o código BUILD-AMB-15. Esse cupom oferece 1 mês do plano QuickNode Build ($ 49) gratuitamente 🎉

💥 Simplesmente UAU 💥

Se você achou este tutorial útil e agradável, considere compartilhá-lo com seus amigos. Espero que você tenha obtido novos insights ou até mesmo resolvido um desafio. Obrigado por ler e divirta-se!

Sinta-se à vontade para se conectar comigo no Twitter, GitHub e LinkedIn. Aceito suas sugestões e comentários!

WAGMI 🚀🚀

Este artigo foi escrito por Aayush Gupta e traduzido por Isabela Curado Nehme. Seu original pode ser lido aqui.

Top comments (0)