Construa um aplicativo de gerenciamento de bibliotecas descentralizado com Solidity

1. INTRODUÇÃO DO CURSO: Blockchain é a força motriz da próxima geração, que também é conhecida como a árvore verbal. Blockchain reinventa a forma como os dados são armazenados e gerenciados. árvore da Web abraça a descentralização e está sendo construída e de propriedade de seus usuários. Como está em muitas novas oportunidades para desenvolvedores como nós neste dominante. Neste curso, aprenderemos como construir um aplicativo completo de gerenciamento de celebridades descentralizado a partir do zero, usaremos a solidariedade para o paradigma de desenvolvimento de contratos inteligentes para parte de teste e implantação estava sede de nos comunicar com o contrato, MetaMask para assinar a transação, React JS para o financiamento e alquimia é que o blockchain os fornecerá. No final do curso, você entenderá os conceitos necessários para se candidatar a eles para colocar um emprego ou até mesmo construir sua própria aplicação no blockchain akkadiano sem perder mais tempo. Inscreva-se agora e vamos começar. 2. Crie um novo projeto de hardhat: Olá, bem-vindo ao primeiro vídeo do curso, onde aprenderemos como criar um aplicativo de gerenciamento de bibliotecas descentralizado. Então, não vou perder seu tempo explicando o que é a Web três, o que é descentralização e tudo mais. Se você quiser, você pode Google por conta própria. Vou apenas estaticamente para o currículo do curso ou o roteiro do curso. Portanto, o curso é dividido em etapas D7. O primeiro passo será configurar o ambiente de desenvolvimento. Em seguida, criaremos um contrato inteligente. Em seguida, escreveremos o teste unitário. Em seguida, implantaremos um contrato inteligente. Depois de todos esses testes forem bem-sucedidos. Em seguida, usaremos um framework, framework React conhecido como próximos dois anos para construir um front-end. E então usaremos cadeiras éteres no front-end para interagir com o contrato inteligente. E, finalmente, testaremos todo o aplicativo se tudo está funcionando bem ou não. Então, antes de avançar, gostaria apenas de ter certeza de que você instalou máscara Matter e ter alguns interesses acadêmicos de teste em sua conta. Eu não vou me arrumar com, de novo. Assista a qualquer tutorial sobre ele e continue com o curso. Dificilmente será tecnológico cinco minutos, é isso. Agora, antes, antes de trabalhar no aplicativo, você deve pelo menos saber essa pilha de tecnologia. Então, obviamente, estamos usando uma cadeia de blocos de titânio. E solidez é essa linguagem de programação para escrever contratos inteligentes. Em seguida, usaremos o capacete como ferramenta de implantação. Em seguida, carteira MetaMask. Em seguida, a alquimia é um provedor de nó oculto. Ele diz que este é um laboratório para se comunicar com o contrato inteligente, depois HTML, CSS e, finalmente, React JS, ou você pode dizer Next JS. É isso. Vamos começar com o ambiente de desenvolvimento. Primeiro, crie uma pasta. O nome é gerenciamento de bibliotecas. Tudo bem, se você quiser, você pode nomear qualquer coisa e, em seguida, anexar um terminal nele. E para instalar o coração, você precisa primeiro criar um pacote NPM executando o comando e a VM nele. Por quê? Ele inicializará um pacote NPM vazio. É isso. Então você pode ver que esse arquivo package.json está lá. Em seguida, fazendo o estilo hardhead. Esse comando é npm. Instale, trave, trave, salve , tab, capacete e pressione Enter. Certo. Os pacotes hardhead são a dependência mais difícil instalada. Para não criar um projeto hardhat, usaremos esse comando, que nos dará uma estrutura mínima nua, que é capacete NP. Em seguida, pressione Enter. Em seguida, selecione o primeiro que é criar um projeto de amostra B6 e pressione Enter novamente e, novamente, Enter e, em seguida, insira. É isso. Agora, poucas pastas e arquivos são criados. O projeto de amostra pedirá que você instale hardhead por um terroristas mais difícil e poucas outras dependências que tornam o hardhead compatível com o teste falharão e tem celebridade para simplesmente copiar esta linha e cole-a e pressione enter. Ele baixará todas as dependências necessárias para o projeto. Certo. Deixe dependências que eu instalei com sucesso. Agora basta anexar o VS Code Editor e anexar sua pasta do projeto nele. Estes são os arquivos fictícios que a cabeça dura nos fornece. No próximo vídeo, incluiremos chaves de alquimia e máscara Meta na implantação da configuração Hardhead. Obrigado. 3. Teclas de alquimia e metamask: Oi. Então, um capacete nos dá poucas pastas e arquivos. Vamos entender todos esses passo a passo. Mas primeiro, vamos para o arquivo js de ponto de conflito com cabeça dura. E certifique-se de que estamos apontando nossa rede para correlacionar a rede de teste itanium. E para que isso funcione, precisamos ir antes do URL do nó itanium e de um endereço de carteira. Vr usando curly e não roubar Stone ou qualquer outro porque na Alchemy, essas redes estão sendo depreciadas. Então, certo, não a melhor escolha seria usar a rede caudalmente. Como já tenho uma conta no Alchemy, não vou criar uma nova conta, mas simplesmente vá para alchemy.com. E estou clicando em Login. Você tem que se registrar. É muito simples. Basta conectar sua conta do Google e tudo mais. Nada extravagante. E aqui, depois de criar uma nova conta em alquimia, você será redirecionado para esta tela do painel. Aqui, basta clicar no botão Criar aplicativo. E agora vamos preencher essas informações. nome do meu aplicativo será Gerenciamento de biblioteca, guia. Então a cadeia será tédio, mas a rede será piedosa. E como eu disse, isso é depreciado, depreciado. Portanto, é melhor usar apenas rede fria e clicar em Criar aplicativo. Então você criou com sucesso um aplicativo na Alquimia. Agora, o próximo passo é obter a chave privada do MetaMask. Você pode instalar a máscara Meta acessando o mascote Madame no seu site e instalar a extensão para o seu navegador. Como já o tenho, você pode simplesmente pausar o vídeo e assistir a configuração de uma nova carteira e como obter comedores de teste em sua conta. Porque definitivamente para fazê-lo funcionar, você deve fazer algum teste. Um teste como este. Esta é minha carteira. E apenas fazendo login. Então você pode ver, eu tenho tanto no teste. Come e certifique-se de boba. Você seleciona a rede oralmente nas opções. Em seguida, para obter a chave privada, você precisa clicar nos detalhes da conta, exportar a chave privada e digitar sua senha. É isso. Então você receberá sua chave privada. E isso, este 0 x a d, Essa coisa é a sua chave pública, que agora não é necessária, mas pelo menos você deve saber. Agora, você precisa instalar algumas dependências para escrever essas chaves. Porque escreveremos URL de alquimia e chave privada MetaMask em nossa configuração de hardhead. E para isso, instalaremos e usaremos a dependência chamada dot ENV porque não é recomendável passar essas informações confidenciais diretamente em nosso código. Então, basta anexar seu terminal e escrever npm install dot ENV. Mas também estou instalando Penn Zeplin acrescenta um avião é dizer que biblioteca de contratos modulares, reutilizáveis e inteligentes que retornam sólidos. Portanto, é simplesmente um código pré-escrito que você pode usar diretamente. Nada mais. Vou apenas escrever npm instalar um anexo direto dos contratos de barra Zeplin e, em seguida, espaço D, O, D E e V ponto ENV. Essa é outra dependência. Isso significa que existem duas dependências. E então vamos apenas pressionar Enter. Então, está feito. Agora. Use esse ponto ENV primeiro. Criarei um novo arquivo no diretório raiz pelo nome ponto ENV. Isso é assim. Você pode ver que está no diretório raiz. E então aqui vou criar um bem. Ou você pode dizer algo que armazenará o valor. URL da alquimia é igual a isso, e let g é igual a isso. Lembre-se de que não há nada que seja mina de carvão, tudo ainda diretamente. Estou escrevendo. Agora, para obter o URL da alquimia, basta acessar seu aplicativo e clicar na tecla Exibir. Então você verá esse cookie HTTP simplesmente copiado e colá-lo em sua URL de alquimia como este. E, em seguida, para obter a chave privada da carteira , acrescente a máscara de método. Em seguida, aqui os detalhes da conta, exporte a chave privada e a senha válida Dario e confirme. Copie essa chave e cole-a aqui na chave privada violeta. É isso. Salve e feche-o. Agora, queremos essas chaves em nossa configuração de hardhead. Para isso, acabou de abrir um arquivo de configuração com cabeçalho rígido. E dentro dos módulos ou exportação, certo? Redes, depois chaves encaracoladas. Então, dentro dele, como o nome da rede, estou usando feminino. Então, novamente, chaves encaracoladas. Em seguida, uma propriedade é URL, que usamos esses dados de arquivo ENV de ponto. Temos que escrever o URL de alquimia ENV de ponto de processo. E para fazê-lo funcionar no topo, temos o primeiro exigir o pacote dot ENV. Essa é a configuração de ponto ENV ponto como esta. Dessa forma, podemos acessar o arquivo ponto ENV. E, em seguida, o URL é fornecido. E o segundo parâmetro que temos que enviar essas contas. É no NA, nós simplesmente temos que escrever processo de ponto ENV, carteira de pontos, chave privada. É isso. É isso para a fertirrigação da cabeça dura. Agora, nosso projeto está apontando para a rede de mesa de correlação de alquimia. No próximo vídeo, trabalharemos na criação do contrato. Obrigado. 4. Como criar contrato de biblioteca: Então agora é hora de trabalharmos em nosso contrato inteligente. Crie um novo arquivo dentro da pasta Contratos e nomeie-o Library dot soul. Então a primeira coisa que temos que fazer qualquer contrato é a licença delta e o desvio de DVR sólido e sólido usando o contrato certo e o nome do contrato. Nós daremos o contrato chamado biblioteca. Agora, sou a biblioteca Wesley terá livros. Então, a primeira coisa que faremos é criar uma estrutura de livro. Ou seja, um livro terá algumas ideias, algum nome assim. Basta escrever um livro. Então. Ele terá um ID de livro. Em seguida, o nome do livro. Então, sim, publique. Então, quem é o Arthur? E, finalmente, se terminamos de ler este livro ou não, assim, porque esse conceito será que teremos nossa própria biblioteca onde podemos escrever. Este livro é deixado para ler. Já li este livro assim. Então a estrutura está pronta. Agora, criarei uma variável de listas de livros, que será uma lista de livros do tipo. Ou seja, ele manterá a estrutura do livro. Será um particular e vou apenas nomeá-lo vocalista. Em seguida, mapearemos esse ID do livro para o endereço da carteira do usuário que está adicionando esse livro. Para que mais tarde possamos buscar diretamente que os usuários reservem sem nenhum problema. Então, vou simplesmente escrever mapeamento. Em seguida, você termina em 56 será mapeado para o endereço, e será simplesmente reservar para o proprietário. Novamente, estou dizendo que é um mapeamento da ID do livro para o endereço da carteira do proprietário. É isso. Então a primeira função que criaremos é adicionar um livro. Então, basta adicionar em massa. Então essa função será uma função externa. Ele se lembrará de fora. E ele aceitará poucos valores como string mamary name você em 16 anos. Em seguida, artéria mamária de corda. Em seguida, um booleano de acabado. Essas coisas ele aceitará. Agora, para adicionar um livro, precisamos ter um ID de livro e ele deve ser exclusivo. serviço simplesmente não usará nenhuma dependência externa no momento. Vou dar ao ID o comprimento de nossos folhetos. Esse é este. Como obviamente, depois de adicionar um livro, ele continuará aumentando. Então, sempre isso será único. Suponha que a primeira coisa, começaremos a partir de 0, então esse é o id do livro será 0, depois um, depois dois assim. Então, na lista de livros, vamos empurrar o valor da estrutura. Ou seja, do livro de estrutura irá empurrá-lo. E a primeira coisa que será preciso é o ID do livro. Então dê um nome aqui. Então terminei assim. Então, isso vamos empurrá-lo. Então, automaticamente, o comprimento aumentará de 0 para um. Então, no mapeamento também, farei o mapeamento do livro. Id pertence ao remetente da mensagem assim. Então este livro pertence a isso, a quem quer que esteja chamando essa função. E no final, gostaria de emitir um evento. O evento será adicionado livro. Simplesmente. Ele solicitará o destinatário, destinatário e o ID do livro. Então, isso só será registrado nessa cadeia de blocos. Qualquer externamente que possamos lê-lo é informação. Basta vê-lo como uma função de login. Adicione evento de livro. O destinatário será remetente da mensagem e o ID do livro será o ID do livro. Então, espero que você tenha entendido que este é um código muito básico. Se você vem de qualquer outra linguagem de programação, entenderá o conceito. Obviamente, essas coisas como algo novo. Se você ainda tiver dúvidas, basta ler sobre mapeamento e eventos. E no próximo vídeo, trabalharemos em outras funcionalidades em nosso contrato inteligente. Obrigado. 5. Funcionalidade para buscar livros: Agora vamos trabalhar na funcionalidade para obter todos os livros desse usuário em particular. Então eu chamaria isso, simplesmente obter lista de livros. Será uma função privada. Vou te dizer o porquê. Ele só lhe dará as informações de que estou usando a palavra-chave view e retornará esse livro de coisas assim. Você pode estar pensando por que isso privado, porque eu só quero passar argumentos como booleano terminado. Isso significa se é se estamos pedindo os livros que estão acabados ou que não lemos. Então, com essa função, podemos chamar ou podemos implementar duas funcionalidades. Vamos começar a trabalhar. Você entenderá tudo. Certo? Função de ortografia errada. Certo? Agora, a primeira coisa que eu faria é criar uma variável, nomeie-a. Então, será uma nova lista de livros. E essa terra seria vocalista, terra escura como esta. Ok, então agora no início, contaremos quantos livros esse usuário tem. Porque nesta lista de livros haverá muitos livros de usuários diferentes e diferentes. A primeira coisa que temos que iterar ou percorrer essa lista para encontrar o proprietário do. Ou seja, defina os livros que estão sendo de propriedade desse usuário. Significa isso. Basta criar um loop for. Será quando eu for igual a 0. Eu menos que lista de livros, lista de livros, aterro I plus plus, assim. Então a primeira coisa que temos que verificar é se o proprietário do livro, seja, esse ID do livro pertence a este remetente de ponto de mensagem ou não. É. Como sabemos que a ID do livro começa a partir de 0. E é por isso que começamos isso a partir de 0. E perguntamos que o mapeamento está lá com esse endereço, para que possamos verificar se ele pertence a esse remetente. E outra condição que verificaremos é a lista de livros. I. Terminado igual a, igual ao acabado. Assim. Simplesmente significa, o que significa que este ponto da lista de livros terminou. Essa é essa propriedade. Se é igual à variável que estamos enviando é este booleano, seja igual ou não. Se estiver lá, nessa variável temporária, simplesmente neste local do contador, insira esse valor que é o valor contábil. Em seguida, incremente esse contador assim. Certo? Então agora, sem dúvida, temos todos os livros que são de propriedade do usuário nessa variável, mas esse comprimento é definido como maior, ou seja, toda a lista de livros. Pode ser um 100. E apenas cinco livros estarão lá. Para economizar memória e espaço. Ele criará outra variável. Ou seja, todas essas são variáveis temporárias que são o resultado final. E será, de novo. Uma nova área de livros, mas desta vez, o comprimento disso contava essa terra real. E usarei o loop for para simplesmente buscar todos os dados desses dois distintos. Agora, novamente usado novo int I é igual a 0. Eu menos do que contador I plus plus. Aqui, simplesmente, na matriz de resultados. Copie tudo dessa matriz temporária. É isso. É apenas cópia simples. E finalmente retornou. Isso é assim. Então, novamente, gostaria de explicar primeiro, esta é uma função privada que só vê. Ele não faz nada na cadeia de blocos. Nesta função, estamos enviando um parâmetro chamado finished, ou seja, verdadeiro ou falso. Então, vamos enviar. Então. A primeira coisa que criamos uma variável pelo nome temporário. É uma matriz vazia. Com isso é com o tamanho da matriz igual ao tamanho do livreto estável. Pode ser, suponha, suponha que 500. Em seguida, criamos este contador que começa a partir de 0. E simplesmente pense nisso. Quantos livros são de propriedade do usuário? Se for de propriedade e ele será implementado. E como eu sei, começa a partir de 0, é por isso que, no temporário, eu apenas o envio para a posição 0. Ou então, como enviaremos um valor dentro dele. Então, se você quiser, você pode devolver o temporário também, mas o comprimento é muito porco. Para removê-lo, acabei de criar uma nova matriz com esse comprimento de contador, ou seja, dez e horas, apenas por exemplo. E simplesmente copie cole tudo de dois dias temporários, resultado, variável e retorne o resultado. Agora, o propósito de torná-lo privado era usar esses dois porque estamos criando para funcionar. Primeiro, o nome da função está concluído. Livros. externa visualização externa retorna a memória do livro. E ele simplesmente retornará essa função que é obter lista de livros com valor final para true. E outra função que criaremos e nomearemos, terminaremos. Livros. visualização externa retorna uma matriz de estrutura de livros. E ele retornará a mesma coisa que é, obter lista de livros, mas definitivamente valorizará com false. Então, com essa função, somos capazes de escrever mais duas funções ou então temos que escrever desejo, talvez tenhamos que escrever separado, separado. Será, novamente, o código será repetido e tudo. Portanto, é muito simples. Você entenderá isso passo a passo ou então , pause o vídeo e tente entender a lógica por trás dele. Agora, a funcionalidade final que precisamos é definir esse valor final de false. Ou seja, de verdadeiro a falso e tudo. Porque, obviamente, se eles usarem a leitura daquele livro, ele pode querer atualizá-lo. Então, basta escrever a função. Punido. Então, será uma função externa. Agora, essa função solicitará esse ID do livro e um valor booleano. Terminado. Primeiro, verificaremos se o usuário é o dono deste livro ou não, porque ele só pode ler ou ver seus próprios livros. Este ID de livro pertence ao remetente do ponto da mensagem? Essa coisa estará aqui assim. Em seguida, basta lista de livros. ID do livro, ponto terminado será esse valor. E depois disso, eu gostaria de, novamente, eu fiz um evento. Assim como o conjunto de eventos foi concluído, ele pedirá o ID do livro. E o valor booleano. Aqui. Vamos emitir o conjunto terminado. E estamos enviando esse ID do livro e o valor final. Então é isso. Para nossa biblioteca, contrato inteligente. Nós escrevemos tudo. No próximo vídeo, escreveremos um teste de unidade para garantir que tudo esteja funcionando corretamente. Obrigado. 6. Crie um novo arquivo de teste: Olá, bem-vindo de volta. Como o Blockchain é imutável, então antes de implantar nosso contrato inteligente, devemos escrever testes unitários para garantir que todas as nossas funções e variáveis em nossos contratos estejam funcionando corretamente. E retornando os valores corretos. Usaremos o Mocha Chai para esse propósito. Então, dentro dessa pasta de teste, crie um novo arquivo e nomeie-o Library dot test, desculpe, biblioteca dot js. Agora, vamos certo, o necessário que é importação e toda a biblioteca que usaremos é Chai, isso é assim, temos que escrever. E então a próxima coisa que vamos exigir é os comedores são iguais a exigir e tos. Temos essas dependências quando criamos um novo projeto hardhead. Então, vamos criar nossa mesa. E vamos escrever um contrato de biblioteca. Então, dentro dele. Espero que você saiba como escrever teste usando capacete. Então, agora, antes de executar as funcionalidades e tudo, devemos escrever alguns dados ou algumas variáveis. Como antes de tudo, definitivamente, devemos ter nosso contrato de biblioteca e assim por diante. Vamos escrever essas variáveis. Então, o proprietário que está implantando o contrato. Esta segunda biblioteca que é letras pequenas será como um objeto e verificação do nosso contrato. E isso será uma fábrica, você pode dizer. Em seguida, devemos adicionar alguns dados fictícios à nossa biblioteca em primeiro lugar. Então, vamos apenas escrever o número do número de livros acabados é igual a cinco. Apenas dados fictícios. E secundário nós const num, livro acabado, erro ortográfico. Quando o livro de nicho é igual a três. Então, vamos ter terminado livros inacabada e outra lista de livros finalizada. Então Mark II usa ganchos para organizar a estrutura. Esta palavra-chave de mesa é usada para agrupar todos os nossos testes e podemos ir como Nest MLL. Podemos aninhá-lo. Ou seja, novamente, podemos escrever esse gráfico. Mais uma vez, podemos fazer assim para que possamos aninhar tudo. Depois, há cozinheiro de TI, são os casos de teste e tudo o que usaremos mais tarde. Então temos antes h, é um gancho. Ou seja, temos isso. Temos isso antes de cada gancho também. Portanto, é um gancho que será executado antes de todo o escriba e ele funcione. Então, em palavras simples, o que você escrever dentro disso antesCada um será executado quando nossos casos de teste que são construídos em quatro mesas separadas. Ok, agora vamos seguir em frente. Vamos começar com antes de cada gancho. Dentro dele, eles ganharão uma função sinc. Agora, usaremos essa palavra-chave de biblioteca, que é variável de biblioteca. E nós simplesmente escreveremos aguardar éteres, ponto get, fábrica de contratos. E o nome do nosso contrato é esse. Elaborando. Ok, então teremos este. Deixe a biblioteca, que estará aguardada , implantar pontos da biblioteca. Mais uma vez, aguarde isso. Não precisamos escrever diretamente. Agora podemos pegar o signatário assim. O proprietário é igual a aguardar. Comece. Consiga signatários assim. Certo. Certo, estou apenas verificando. Eu tenho tudo. Tudo está lá. Agora. Essa é a estrutura. Ou seja, ele terá uma lista de valores. O primeiro valor entrará nessa variável. Isto é, esse é o significado dessa afirmação. Agora vamos inicializar esse vocalista sem mobília para esta lista vazia e lugar mais amigável para esta lista vazia. Agora, o que faremos é adicionar cinco dados fictícios nesta lista de livros inacabados e três dados fictícios nesta lista de livros finalizada. Agora, para isso, usarei um loop for que é longe que eu seja igual a 0. Eu menos do que o número de livros inacabados I plus, mais. Assim, simplesmente, criarei um objeto de livro. Objeto ou você pode dizer assim. Então ele terá nome. Ele terá ano. Ele terá, terá um valor de terminado. Isso será falso. Agora, obtenha valores aleatórios de nome aqui em Arthur, já que ele estará fazendo um loop através dele. Vou criar uma função aleatória básica aqui. Assim. Função. Obtenha um número inteiro aleatório. Agora vou apenas definir os dígitos mínimo e máximo e tudo e simplesmente retornar o piso de ponto matemático. Então, não aleatório. Multiplique pelo máximo menos mínimo. Assim. Esta é uma função entorpecida muito básica. Se você estiver usando alguns mais complexos, se quiser alguns números mais complexos, então você deve usar algumas outras bibliotecas. Mas agora, isso fará esse trabalho. Este é apenas um propósito de teste. Vou simplesmente obter um inteiro aleatório. Eu preciso, é de um a 10 mil? E eu vou fazer com que ele fique assim. Mais uma vez, para o ano. Será qualquer coisa entre 1800 suponha até 2022. Então nosso terceiro seria apenas esse número aleatório. Apenas lembre-se, isso é apenas para testes. Quero que alguns dados estejam nesse lado. Agora, depois desse objeto de livro, vou simplesmente escrever aguardar, biblioteca, ponto, adicionar livro e livro. Livro, nome do ponto, livro, orelha de ponto, gancho. Nosso terceiro livro, terminado. E então vou empurrar essas informações em detalhes, essa lista inacabada. Esse é esse valor contábil como este. Então, simplesmente, novamente, isso antes de h ser executado antes de cada teste definido, definiremos o total para teste de unidade aqui. E antes de cada teste, esse pedaço de código será executado. Aqui estamos primeiro implantando nosso contrato e, em seguida, obtendo a instância dele e, em seguida, adicionando alguma caixa fictícia. Agora, novamente, da mesma forma, temos que adicionar dados para este livro que está concluído também. Depois deste livro inacabado, novamente, escreveremos um pouco o mesmo. Então, o que vou fazer é copiá-lo, colá-lo aqui. Então, a primeira coisa que vou fazer é obter esse número de livros acabados. Aqui. Eu igual a 0 menor que o número de livros acabados. Então, novamente, estes serão os livros e este aqui, valor da definição será verdadeiro. Então vou escrever aguardar ponto da biblioteca, adicionar livro, nome do ponto do livro. Então aqui vou enviar essas informações para esta lista de livros finalizada. É isso. Então, finalmente, agora estamos concluídos com isso antes de cada gancho. No próximo vídeo, escreveremos o teste unitário para adicionar um livro e obter todos os livros. Obrigado. 7. Teste de unidade para adicionar e buscar livros: Então, agora vamos escrever nosso primeiro teste para adicionar um livro. Depois disso, antes de cada cláusula. Vamos escrever novamente que descreva grupo e adicione livro. Isso será uma função. Então, dentro dele, use-o. Isso é o que isso vem da biblioteca também. Estes são os casos de teste. O primeiro caso de teste, devemos nos encontrar e reservar o evento. Basta anotá-lo. Se você não está entendendo, definitivamente no final do teste você entenderá o que essa linha significa. Mais uma vez, vamos criar um livro aleatório. Para isso. Copie, este objeto de livro. Aqui. Está tudo bem. Depois disso, basta escrever aguardar x de volta, novamente dentro dele imediatamente. Ponto da biblioteca, adicionar, reservar. Em seguida, escreva essas coisas dentro dela. Basta copiar e colar se quiser. Então isso emitirá um valor que deve emitir. Em seguida, nossa instância de biblioteca, ou seja, instância de contrato. Em seguida, ele emitirá um evento chamado Adicionar livro com argumentos ou endereço NOR. Em seguida, número de livro e finalizado mais o número de um livro finalizado como este. Então, o que quero dizer com esse código, já que no final da nossa função de livro de anúncios nesse contrato de biblioteca, é isso, estamos emitindo isso, certo? Portanto, esse evento é esse, que é o destinatário, que é quem é o dono do livro. E esse ID do livro. E como o id do livro é o tamanho da lista de livros. E em nosso, antes de cada livro, já inserimos esse número de livros que é 53 na lista. Esse limão começa a partir de 0. Então, em palavras simples, o que quero dizer é que já temos uma tarefa que é essa tarefa fictícia nessa lista. E esta será a nove tarefa que somos, ou seja, nove livros, que estamos adicionando, que terá um id oito. Isso terá um índice oito porque na lista de e-mails o índice começa a partir de 0. Portanto, este livro terá um id oito. É isso. Assim. Este livro terá uma identificação oito. Apenas verificaremos se o evento emitirá essas informações ou não. É isso. E para fazer verificação de igualdade ou comparar os resultados esperados com o resultado real, podemos usar o Chai, o que nos dá três afirmações ou seja, isso espera que haja um terceiro também e há deve também, mas usaremos apenas esperar. Agora. Isso adiciona um teste de livro feito. Depois disso, escreveremos outro teste unitário, que será para obter livros. Vamos escrevê-lo. Será uma função novamente. O primeiro caso de teste, na verdade, devemos retornar o número correto disso está correto. Livros inacabados. Haverá uma função sinc. Agora, vamos pegar os livros do nosso contrato. São livros encadeados. Este blockchain será o ponto da instância da biblioteca. Obtenha um livro inacabado que está aqui. Obtenha livros inacabados como este. Então o que esperamos é, em primeira coisa, livros do comprimento do ponto da corrente devem ser iguais ao número de livros inacabados. E então o que faremos é também verificar se livros ou seja, que livros dentro dessa matriz são iguais aos livros dentro desta lista de livros de seu contrato. Para isso, temos que criar uma função que irá verificar livros e, portanto, simplesmente anotá-lo. O código que estou prestes a escrever. A primeira função será verificar um único livro, ok? Serão necessários cadeias de livros e livros. Então, esperamos que o nome do ponto do livro seja igual ao nome do ponto blockchain. Então teremos outra expectativa. Livro. Dot ir dot duas cordas será igual a ponto blockchain, ponto a string. Então, esperamos um livro. Nosso terceiro deve ser o mesmo que n igual ao ponto blockchain Arthur. E agora teremos outra função, verifique a lista de livros. Então, serão livros da cadeia e da lista de livros. Vamos primeiro esperar livros da cadeia. comprimento não deve ser igual a ele, não é igual. Não é igual a 0. Então a segunda espera será o comprimento da cadeia de livros é este comprimento do é este ponto da lista de livros. Então, como temos muitos livros, isso é nesta área também e nesta área também teremos muitos livros. Então, temos que percorrer todos os livros e depois verificar. Então nós temos, teremos um loop de barra. Então. Começará de I igual a 0, eu menos do que o comprimento do ponto da lista de livros I plus. Então, basta escrever const. A cadeia de livros é igual aos livros da cadeia. Suponho que 0 índice primeiro índice assim. Em seguida, o livro será uma lista de livros, que é aqui que não é um teste. E então usaremos esse verificável, que isso verifica um único livro. Isto, para este livro em particular, verificaremos esse nome ou se tanto o nome quanto o autor, cor Eric, não assim no blockchain e no livro. Portanto, estamos simplesmente comparando livros armazenados nesse contrato e livros armazenados na variável local deste teste. É isso. Então, novamente, vá até aqui. O que vou escrever esta lista de livros de verificação. Então eu simplesmente enviarei livros da cadeia. E, em seguida, lista de livros inacabada. Então, definitivamente, deve nos dar uma lista de livros inacabada dessa cadeia. E então listas de livros inacabadas daqui que estão neste teste. E da mesma forma, teremos outra condição para obter o número correto de livros acabados. Aqui. Isso vamos terminar o livro, livros. Então os livros de Jane são iguais ao número de acabados. Isso será livros finalizados iguais. E, em seguida, verifique livretos, ou seja, livros de Jane. E este livro finalizado lista, seja igual ou não. Então é isso. Criamos com sucesso o teste unitário para adicionar um livro e até buscar nossos livros. Está buscando livros que são inacabados e buscando livros que estão acabados. É isso para este vídeo. Vejo você na próxima sessão. Obrigado. 8. Faça os testes: Neste vídeo, vamos apenas escrever nosso caso de teste final e, em seguida, executar todo o nosso teste e ver se está, se está funcionando corretamente ou não. Finalmente, o teste será terminar um livro, ou seja, um livro inacabado. Vamos mudá-lo para finalizado. Então, vamos novamente assim, esse cinza. Em seguida, defina a função final. Esse caso de teste realmente devemos definir o evento finalizado. Em seguida, escreva nossa função. Suponha que vamos levar esse ID do livro para ser 0. Esse é o primeiro livro. Em seguida, olhou. Livro. O acabamento é igual a verdadeiro. Então, basta escrever aguardar, esperar. Em seguida, conjunto de pontos da biblioteca função finalizada. Enviaremos o ID do livro. E esse é o decimal quais genes são verdadeiros. Então ele emitirá. Ele emitirá uma função ou um evento chamado set. Os capitalistas terminaram com argumentos, argumentos, ID do livro e um valor verdadeiro. Então, quando chamamos esse conjunto de terminado aqui, você pode ver que ele emite um evento que tem o ID do livro e um booleano acabado. É isso. É disso que estamos falando aqui. Vamos verificar se é uma reunião ou não. Agora, está na hora. Nós executamos nosso teste. Certifique-se de salvar todos os seus arquivos. Em seguida, no diretório do seu projeto, basta abrir seu terminal e direita e px, capacete, teste e pressione Enter. Lembre-se, se você receber algum erro aqui depois de terminar o adicionado ou depois de corrigir esse erro, use NP x hardhead clean e, em seguida, execute o teste novamente. Isso é executar este teste novamente. Nosso contrato de biblioteca contém alguns problemas. Você pode vê-lo. Certo. Vamos verificar. Temos alguns problemas. Vou voltar para você com uma solução. Então eu consegui a solução. Os erros que cometi foram o primeiro erro foi, ou seja, na quarta linha, eu deveria ter esse capacete, não uma biblioteca de testes. Essas cartas devem vir da biblioteca principal de Howard. E um segundo erro foi: Essa expectativa deveria vir da biblioteca infantil, mas não deve ser maiúscula, deve ser pequena letra que é ACS, pequena. Vamos salvá-lo. E novamente, vou conseguir um novo terminal. Vou ler e px. Eu tinha limpo. Então vou adicionar NP x tinha testado. Vamos ver. Agora tudo está funcionando corretamente ou não. Então, finalmente, você pode ver todos os casos de teste estão mostrando, ok, isso significa que estamos prontos para ir. No próximo módulo, enviaremos nosso contrato inteligente para o blockchain. Obrigado. 9. Como escrever o roteiro de implantação: Olá, bem-vindo de volta. Neste vídeo, escreveremos scripts de implantação para nosso contrato inteligente. Basta ir para a pasta de scripts e criar um novo arquivo pelo nome implantar dot js. Agora vamos começar a trabalhar nisso. Vamos exigir o pacote ethers da dependência hardhead. Agora basta escrever esse pedaço de código que é necessário para a finalidade de implantação. Primeiro de tudo, criaremos uma fábrica contratada. E espero que os comedores obtenham fábrica contratada. O nome é biblioteca. Em seguida, crie uma instância que seja contrato para o ponto de negociação. Implante. Um contrato de peso implantado. Vamos esperar para garantir que o contrato esteja sendo implantado. E depois do dia. Depois disso, vamos consolar o endereço do contrato log dow, o que é muito importante. Usaremos este endereço de contrato mais tarde no front-end. Basta escrever o endereço do contrato. E então vamos escrever outra função. Para executar a função acima assim. Tenha um bloco try catch. Queremos dizer, então, processar essa saída 0 se tudo estiver bem. E se tivermos algum somador, então você lê o log de pontos do console, talvez erro registrado. E vamos escrever saída do processo. Um. Podemos editar o botão Sair adder. E finalmente vamos escrever e executar o main aqui, digamos. Portanto, esse é o script de implantação. Basta salvar tudo. Em seguida, para implantar apenas o terminal anexado na pasta raiz. E simplesmente digite NP x. Heart executou scripts. Implante dot js. A rede é piedosa e pressione Enter. Vamos ver se está tudo bem, então obteremos nosso endereço de contrato. Como nosso contrato foi implantado com sucesso. Basta copiar esse endereço e simplesmente obter uma vírgula, ou seja, Command. E apenas salve-o para que não percamos essas informações. Agora, se você quiser, você também pode verificar o contrato. Informações em. Divino. Esters pode simplesmente acessar este site e simplesmente colar o endereço do seu contrato e apenas pesquisar. Veja, temos este contrato que está sendo carregado são implantados há 52 segundos. Você pode apenas verificar se sim, nosso contrato foi implantado dias de sucesso, sem problemas nele. Então é isso para este vídeo. No próximo módulo, trabalharemos no front-end e depois interagiremos com nosso contrato diploide. Obrigado. 10. Trabalhe no frontend do próximo js: Olá. Neste módulo, trabalharemos no front-end do nosso aplicativo e usaremos o próximo JS, que é área ainda framework. Agora, na pasta do projeto, basta escrever o comando npm. Crie, próximo aplicativo. Então, também usaremos os vivos lá. Basta escrever css tailwind e eu vou nomeá-lo cliente e pressionar enter. Ele criará um próximo aplicativo JS básico. Ok, então nossa próxima aplicação de cadeiras foi criada com sucesso. Agora, para interagir com nosso contrato inteligente implantado, precisaremos de duas coisas. Endereço do contrato e essa ABI. Para obter a ABI, basta copiar o arquivo json de ponto da biblioteca, que está dentro de artefatos e pasta Contratos e, em seguida, biblioteca. Então também temos esse arquivo json de ponto da biblioteca. Este cliente. E esse cliente cria uma nova pasta chamada ABI. Nova pasta aqui, ABI. E, em seguida, dentro desta pasta, basta colar o arquivo json do ponto da biblioteca. Ou seja, esta é a ABI que é necessária para a tarefa, ou seja, para este endereço de contrato. Basta criar um novo arquivo chamado config dot js dentro do diretório do cliente. Diretamente isso está dentro disso, crie um novo arquivo chamado config dot js. E por dentro, basta escrever exportação, tarefa const. Ou você pode simplesmente dizer não contrato, você pode simplesmente escrever contrato. O endereço é igual e, em seguida, copie diretamente este endereço aqui e salve-o. Usaremos isso mais tarde. Agora, se você quiser, você pode simplesmente removê-lo. O endereço aqui. É isso. Agora também teremos, precisaremos instalar algumas dependências para nosso próximo projeto JS. Então, basta ir para esse diretório do cliente no terminal que é cliente de CD. E simplesmente escreva npm, instale comedores , digite componentes com estilo e pressione Enter. Então, os comedores interagem bastante com o contrato inteligente. Os tipos verificarão os adereços e vamos ver o que eu cometi erro. Eu não fiz componentes se espalhando um pouco. Combo. Os tipos Nance verificarão a passagem de adereços para seus componentes, atenderão às suas condições. E certifique-se de que os dados recebidos sejam válidos. Talvez tipos, que é apenas para garantir que os dados enviados para o componente sejam válidos, então esses componentes de estilo nos permitem criar componentes e anexar estilos a ele usando tag ES6, modelo literais, os estilos que estão retornando CSS. Em palavras simples, é um pacote de terceiros usando o qual podemos criar um componente como uma variável JavaScript que já está estilizada com código CSS. Você entenderá isso mais tarde. Então agora basta executar, nosso aplicativo é npm run dev. Ok, agora vamos simplesmente ir para isso. É host local e veja nosso próximo aplicativo JS foi escrito com sucesso. Então é isso. Mais uma vez, vou o quê? Vou fazer isso pequeno. É assim. O endereço do contrato, apenas as cartas posteriores do CamelCase que eu gosto, eu gosto dessa maneira. Então, a próxima coisa que faremos é trabalhar no arquivo de índice, que está dentro das páginas. Aqui. Temos esse arquivo TypeScript de ponto de índice. E vou remover tudo daqui e simplesmente começar a escrever do zero. Primeira coisa que vou deixar você ficar e usar pessoas afetadas do React. Então terei o endereço do contrato. Endereço de contrato do arquivo de configuração, que está fora disso, ou seja, esse arquivo de configuração. Então eu vou importar o pacote éteres, éteres. Então vou importar nossa ABA que esta biblioteca da biblioteca de barras ABA dot json. Em seguida, importarei a próxima página da próxima. Então também vou simplesmente declarar janela de leads. Para que, mais tarde , não dê nenhum erro. Isso é ótimo. Nosso componente que é explorado em casa para o atraso. Então agora temos nosso componente irradiado se nossa próxima aplicação está pronta. No próximo vídeo, trabalharemos em como conectá-los a carteira MetaMask em nosso aplicativo. Obrigado. 11. Funcionalidade para criar uma conexão com o MetaMask: Olá. Neste vídeo, trabalharemos nessa funcionalidade para conectar nosso Liam válido é a massa molar à nossa aplicação. Então, vamos primeiro trabalhar na função e chamá-la de conexão. Ou deixe. Vamos embrulhar tudo nele. Tente pegar. O bloco simplesmente escreverá o somador console.log conectando-se ao meu termostato. E simplesmente escreveremos isso adicionado. Agora primeiro, obteremos o objeto do estádio, que é injetado no nosso navegador. Então veremos se temos um TDM ou não. Se não tivermos um TDM, simplesmente escreveremos console.log. Você pode mascarar não detectado e retornar. E se tivermos, então vamos verificar se ele está conectado à rede correta, seja, a rede Garlin ou não, simplesmente receberá a solicitação para eles minha vez, que é conhecida como auxiliar em cadeia. E então sabemos que sabemos que ID feminina é 0, X5, isso é cartilagem e ID. Então, vamos compará-lo se o Shane AD não for igual a correlacionar a cadeia AD. Nesse caso, basta alertar que você não está conectado a uma rede e simplesmente retornou daqui. E se isso também estiver bem, então simplesmente obterá essa conta. Este ponto um pedido. Essa solicitação e ouviremos solicitar que meu terceiro, que é conhecido como contas de solicitação, assim. E então devemos ter um estado que é variável aqui. Vou nomeá-la conta corrente. Para alterá-lo, simplesmente definirei a conta corrente. Espero que saiba que você declara o gancho no React. Simplesmente significa que esta é uma variável e seu valor inicial estará vazio. Esta é uma função que será usada para atribuir valor a essa variável. É isso. Então, assim, eu copio essa função, coloco aqui e simplesmente escrevo contas. O primeiro. Assim, assim, teremos várias contas no MetaMask, basta obter a primeira. Esta é a função que é a função para conectar a carteira. Agora, vamos trabalhar na parte HTML. Basta retornar uma div. Vamos dar a ele alguns nomes de classe de CSS. Flex, flex chamados itens. Se você quiser, você pode simplesmente copiar o que tudo isso significa. Porque este é um código CSS de vento de cauda, F3, F6 para. Então. Este é apenas um estilo básico. É isso. Nada mais. 68508. Principalmente a mãe estará dentro deste preenchimento inferior 20. Então, tenha outra aula. Me deu o nome da classe. Transição ao longo da data. Quando deu. Em seguida, em escala, quando 05, transição, duração 500. Facilidade para entrar, sair. Então, não dentro dele. Fora dele. Dado H2. É que os decks C x negrito, e B é margem inferior. Para adicionar uma margem, top 12. E dê um nome. Gerencie sua biblioteca pessoal. Assim. Então, agora vem nossa parte ou seja, verificaremos se a conta corrente é igual a vazia, então teremos um botão ou então teremos outra coisa. Certo? Vamos ver. Se estiver vazio, teremos um botão. O nome do botão será conectado. Vamos. Agora vamos dar algum estilo. Nome da classe. Texto, fonte suportada. Adicionando meus três. Apostas x 12. Plano de fundo. Um, C, 232, margem grande , inferior. Em seguida, dimensione 105, transição. E no evento onClick, vamos simplesmente escrever connect, bem a função de TI. Nós atribuiremos isso n. Se eles já estiverem conectados. Então teremos uma tag div, que terá uma vantagem para isso. Em seguida, a carteira, a carteira conectada e o endereço dessa conta atual. E vamos dar um pouco de estilo também. Em seguida, excel. No dia 12, gerenciando o ponto. Vamos salvá-lo. Quero adicionar um C. Temos esta linda carteira de botão completo, pescoço. Se eu clicar nele, ele exibirá meu MetaMask. E minha tarefa já está conectada à rede Golgi. Vou simplesmente escrever em seguida, conectar e dizer, bem conectado, este é o meu endereço público. Então, criamos steadies com sucesso. Trabalhamos com sucesso na funcionalidade para conectar nossa carteira My Thomas ao aplicativo. Nos próximos vídeos, trabalharemos no front-end e na funcionalidade para adicionar e excluir livros e tudo mais. Então é isso. Vejo você no próximo vídeo. 12. Funcionalidade para adicionar um livro: Oi. Neste vídeo, trabalharemos em uma fazenda que permitirá ao usuário enviar um livro. E direi que temos que escrever uma função que irá inserir essas informações nessa cadeia de blocos. Tão alto, vamos começar com a função. Para que a função funcione. Primeiro, devemos ter alguns estados. São algumas variáveis. Você pode dizer const, nome do livro. Então, definitivamente leia o livro terá um nome. E para atualizar essa variável, temos esse nome de livro definido. Você ficou no início. Ele estará vazio. Então teremos autor do livro. E então ele terá definido. O livro está de acordo com o estado de uso. Mais uma vez, será e então esse livro terá um ano. É ouvido rico, esse livro foi publicado. Reserve aqui. Você declara MD. E, finalmente, teremos o livro terminado. Isso é muito que este livro está terminado ou não. livro foi concluído. Então, no início, será não. Obviamente, quando adicionamos, adicionando um livro, o valor padrão deve ser conhecido. Então vamos trabalhar em sua função e nomeá-la. Envie livro. Será uma função sinc. Em seguida, vamos criar o objeto Book. Simule. A chave será nomeada BlockName. Depois, seu chefe. Não temos que mudá-lo para inteiro, essa string. Esse é o mais volumoso. Então temos o terceiro livro. Então nós terminamos o valor. Se o valor final do livro for sim, ele será verdadeiro ou falso. Você entenderá disso o que estou falando, porque esta é uma biblioteca pessoal. Então você pode querer inserir seu livro que já está sendo vermelho, mas você deseja adicioná-lo na cadeia de blocos. Tudo bem. Então, vamos fazer o bloco try-catch. Tente pegar bloco. Temos console.log e enviamos um novo livro. E então escreva o editor, traga diarréia. E o que faremos é primeiro pegar o estádio daquela janela. Então, se tivermos o objeto KTM, então vamos escrever const. O provedor é igual a novos provedores de comedores. Provedor da Web três. E passaremos esse objeto Itanium. Então vamos pegar o signatário. signatário será o ponto do provedor, obterá signatário assim. E então teremos uma instância de contrato. Biblioteca. O contrato é igual a novo contrato, este endereço de contrato, então devemos ter a ABA, ABA, e então temos que dar ao signatário. E agora temos que chamar a função adicionar livro deles. Um, blockchain. Agora deixe a transação da biblioteca ser igual a aguardar contrato de laboratório. Livro de adição de pontos de contrato de biblioteca. Isso está devolvendo o contrato inteligente. Enviaremos livro, nome do ponto, livro, aquele livro auditivo. Nosso livro. Terminou assim. E, em seguida, simplesmente registraremos o console dessa transação, ou seja, transação de biblioteca. E se o objeto Tanium não estiver disponível, o que não será o caso. Mas como não correremos nenhum risco, ele vai escrever, vamos escrevê-lo. A verificação não existe. Então é isso. Que esta é a função para enviar um livro. Vamos apenas nomear esta função enviar livro. Agora, vamos trabalhar na parte HTML. Vamos para baixo. Aqui. Ou seja, nesta carteira conectada. Você quer que o formulário seja exibido porque, no início, o usuário precisa conectá-lo a uma carteira de mesquita. Então, abaixo disso, abaixo disso teremos, primeiro lugar, o que vou fazer é envolver essa coisa dentro de uma div. Dave, espere, só estou pensando no que pode ser feito? Sim. Apenas dê uma div. Feche esta div. Certo. Agora, depois que essa carteira estiver conectada, Dave, vamos escrever esse formulário que é rápido. Nova div. Vou dar alguns ventos traseiros, CSS a ele. Essas coisas serão texto, fonte, semi negrito, e serão margem Duan De, quatro primeiros. Então, vamos ter nossos campos de entrada. A primeira entrada será o texto do tipo de entrada e, em seguida, o suporte do lugar será o nome do livro. E esse valor será a variável que mencionamos acima. E OnChange. O que teremos. Quando obtemos o valor. Isso é o que quer que esteja lá, vamos definir o nome do livro. Simplesmente definiremos o nome do livro e passaremos o valor de ponto, ponto, ponto. Assim. Vamos dar um pouco de estilo também. Então, vou dar um nome de classe. Não vai enviar texto para o Excel a bordo. Margem, margem inferior, superior. Assim. Então eu vou dar-lhe uma tag BR. Quebra de linha. E, novamente, terei outro campo de entrada. Então, basta copiá-lo e cole-o aqui. O estilo será o mesmo. Somente o espaço reservado será livro. O valor será livro e inalterado. Ele será um livro definido. Assim. Então, novamente, terei o mesmo campo de entrada. Então, estou apenas copiando o BR, isso é quebra de linha também. Esse terceiro será o valor contábil será ouvido de livro. Inalterado, disse livro aqui, assim. Certo? Em seguida, basta ter uma tag BR e depois um rótulo. Simplesmente certo? terminou de ler este livro? Então? Teremos alguns, teremos uma opção para selecionar essa tag HTML selecionada. O valor será concluído o livro. Em seguida, o onchange será semelhante. Como o que for que tivermos, vamos mudá-lo para terminar o livro. E ponto, ponto, ponto, ponto. Dentro dessa tag select, devemos ter opções. A primeira opção será de valor. Sim, esse é o que li este livro. E a segunda opção, saberemos? Ou seja, obviamente este livro não está certo por ele. Obter. Agora, depois desse rótulo, devemos ter um botão. Só estou colando esse código porque no último eu gravei este curso e apenas cometi um pequeno erro. Então você pode ver que este é um botão com um nome de classe de texto, Excel, fonte, negrito POR três, preenchimento em x2. Em seguida, fundo, cor desligada, hash F1, C, 232 , arredondado, margem grande, dez inferior, margem esquerda cinco. Em seguida, passe o mouse, dimensione. 105, depois transição. Duração 500, facilidade de entrada, saída. E onclick. Estou apenas atribuindo a função de botão de envio e dando a ela um nome do livro. É isso. Então, se você executar, você pode simplesmente pausar o vídeo e anotá-lo. É apenas uma linha de código. Agora salve-o e vá para seu aplicativo. Basta clicar na carteira Connect. Veja que o formulário está aqui. Você pode nomear qualquer coisa. Eu já tenho um livro porque, como eu disse, fiz isso que fiz o teste nele. Então aprenda livro duro ou ela, isso é certo. Bill Gates. Não sei que ele está interessado nisso ou não e deu 2019. Adicione um livro, então. Thomas pedirá aprovação. Simplesmente confirme isso. Vamos ver se no console recebemos nossa transação ou não. Estou apenas verificando, ainda está pendente. Está feito. Agora clique em Inspecionar. E nesse console temos esse objeto, que é a transação completa C. Então é isso para este vídeo. A funcionalidade para adicionar um livro está funcionando perfeitamente. No próximo vídeo, vamos trabalhar em como buscar esses livros da blockchain. Obrigado. 13. Funcionalidade para buscar livros: Então, agora vamos trabalhar na funcionalidade para buscar livros da cadeia de blocos. Primeiro de tudo, precisaremos de alguns estados. Basta escrever livros const. Caixa acabada e disse. Terminado é igual ao estado de uso. Será uma matriz. Da mesma forma, teremos outra caixa. E os livros acabados e produtos acabados. Eles usam data. Novamente, será uma matriz vazia. Agora, vamos trabalhar com a função abaixo desta função de envio de livro. Vou escrever const, obter livros é igual a uma pia. Então eu recebo um, mesma forma, teremos um bloco try catch. Se houver algum erro, simplesmente consolar o console.log. Nessa seção try. Mais uma vez, teremos essa linha de código. Basta copiar tanto em licença. Vou apenas copiar para dentro. Vou remover, o que não é necessário. Eu simplesmente removerei essas duas linhas porque precisaremos do contrato da biblioteca Itanium. A instância do contrato para trabalhar para buscar a função do blockchain. Agora, simplesmente, vamos pegar livros. Mobiliado é igual a aguardar. Ponto de contrato de biblioteca get. Agora vamos verificar. Conclua os trabalhos. Receba livros acabados. E da mesma forma, teremos deixado livros sem mobília, ponto de contrato ficar inacabado. E então vamos simplesmente definir o valor do estado. Isso é o conjunto de livros terminados. O livro está terminado. E definir livros inacabados será igual à lista proveniente de livros inacabados. Então, assim, temos nossa função get reserve também. Agora, para mostrá-lo no front-end, criaremos um componente separado. Então, dentro desta pasta Pages chamada Come on Nance, gumbo, Nance. E dentro dele crie um arquivo chamado Book JS. É isso. Então, será apenas imaginar um livro separado e separado. Nós apenas daremos um loop for e ele retornará esse componente. Então aqui vou usar algum estilo, se você quiser. Novamente, estou dizendo que você pode fazer por conta própria essas propriedades que instalamos no início, essas dependências, tipos de prop e, em seguida, importar quadros-chave estilo de componentes de estilo. Agora, vamos certo, alguns quadros-chave de estilo. E isso. Então, dentro disso, teremos, você pode simplesmente escrever esse código mesmo porque, como estou dizendo repetidas vezes, não me importo com o estilo. Só para vazar, só para parecer decente. Pelo menos estou dando essa transformação de estilos. Escala 0,5. Em seguida, leia por cento. Mais uma vez, vou copiar essas duas linhas. Colado. Escala um. E então nós escalamos um. Certo? Então, com componentes de estilo poeira, terei um recipiente. Então, isso é apenas que estamos dando um estilo a um componente diretamente. É disso que se trata as dependências de componentes de estilo . Ficando isso. Dave, vamos anotá-lo. Animação um por um. Deslizando 0,82 cúbico Bézier cúbico dentro dele. Certo? W 0,390,5750,5651. Em seguida, exiba grade. Em seguida, as colunas do modelo de grade serão 38 porcentagem, 20 por cento, cinco anos, porcentagem, 37 porcentagem. Em seguida, estamos adicionando dois REMs, 0.1881.625168, data REM, borda, sólido, um pixel. Borda, raio. Para big cell. Linha, altura. Normal. Transição de volta ao solo, 0,40 como linear. Margem. Brilhante. Primeiro, estou a taxa de 50 pixels. Exibir bloco em linha. É isso. Então é isso para a porção de estilo. Se você quiser, você pode simplesmente pausar este vídeo e anotá-lo novamente. Se eu fosse um pouco rápido. Então, no próximo vídeo, trabalharemos no componente do livro. Obrigado. 14. Como criar um componente de livro: Então, agora vamos criar esse componente de livro. Abaixo deste pedaço de código. Digamos que o livro const seja igual a isso. E neste componente aceitaremos alguns adereços como id, name. Aqui são punidos e uma função que será Click book. Terminou assim. Vamos voltar. Vamos voltar, vamos então esse contêiner, que já está estilizado assim. É por isso que usamos esses componentes de estilo para que, quando o usamos, ele já esteja predefinido e funcione como se estivesse funcionando como um componente. Você pode ver, suponha que algum tipo de componente de contêiner. Você o nomeia, você o nomeia contêiner e podemos usá-lo assim. Agora, vamos. Esse é Dave, nome. Então. Então temos aqui. Então, esta tag de span, simplesmente diremos se terminar igual a, igual a pausa. Se o livro não estiver sendo concluído, teremos algo ou outra coisa, ou então , simplesmente teremos uma tag p. Então teremos um botão. Em seguida, esta tag p mais tarde. Então aqui, se tivermos isso, eles terão um botão. E vamos dar um pouco de estilo ao botão. Fonte, negrito, casamento em x, y, quebrar. Ash, F, F, 77, F. Então teremos Dexter White. Em seguida, arredondado. Margem grande, top cinco. Nossa escala 105. Transição. Duração. 500 está neste fardo. Então, neste botão, o que teremos é que teremos o método on click também. É, está dentro, aqui fora. Vamos ter o clique ao clicar. Quando o usuário clica em um clique, essa função divertida será executada, que é fornecida pelo Glick Book. E temos que enviar o ID. Esse é um livro rico. Temos que excluir e apenas nomeá-lo. Livro de nicho como este. Então, será quando, quando, quando a propriedade for falsa e se for verdadeira, então simplesmente podemos dar um parágrafo e dar-lhe algum estilo. Fonte. Bola, negrito , texto, altura 0 d, 71 E. E será escrito livro terminado. Digamos. Então. Agora, após esse componente, teremos alguns tipos de prop que realmente garantem que essas propriedades ascendam nessa ordem. Tempos de suporte é, temos algumas condições que devem ser cumpridas no início. Ou seja, essa é a coisa em que é como se o id fosse adquirido assim. Número do ponto dos tipos de prop, que deve ser numerado e necessário. Isso é um nome. Tipos de prop. String, ponto é necessário. tipo B de prop cadeia de capital é necessária do que o que temos. Temos nosso talento acabado. Então, acabamos de copiar. Nós terminamos. Assim. Isso, essa coisa é um número. E, finalmente, vamos simplesmente exportar o livro padrão, assim. componente livro está pronto. Agora vamos mostrar este livro na página de índice que não é que as páginas iniciais o mostrem. Depois disso. Temos este botão Adicionar. Então temos esse Dave. Temos este debate em 132 após dia, após dia é Dave. Teremos outra div que conterá que conterá a lista de livros. Vamos dar um pouco de estilo a isso também. Flex, flex, coluna, justificar, centralizar, centralizar itens como este. Então, novamente, teremos um nome de classe Dave. Não são texto semi-negrito, texto grande, centro, gerenciando os quatro últimos. E vou nomear a lista de livros. Certo? Então teremos um, então teremos um botão. Então teremos um botão e ele chamará get books. E esse botão terá novamente classes como o Excel a bordo, assim. E se você for bom com o Tailwind CSS, você também pode alterá-lo. Estes são apenas um estilo básico. Em seguida, arredondado, arredondado, margem inferior. Então nossa escala quando 05, duração da transição, 500 está dentro, fora. Portanto, este é o botão. E abaixo desse botão, faremos nossa lógica. Simplesmente. O que faremos são livros inacabados. Aquela terra. Se for maior que 0, então teremos uma div. Se o comprimento for 0, então teremos div, que, como eu estou indo, ele simplesmente escreverá livro inacabado. E dentro disso haverá um número de livros. Ou seja, livros inacabados, não terra assim. E vamos dar um estilo básico a isso. Fonte. Texto em negrito, centro, margem, inferior. Para margem, os cinco primeiros. E se não for, então simplesmente teremos alguma div vazia. Assim. Não mostrará nenhum caminho para ele porque será, não parece bom. Então abaixo disso, abaixo disso, deixe-me ver. Abaixo disso, vamos ter outro div nome de classe será flex. linha flexível justifica o centro, o centro de itens. E aqui teremos como esses livros, inacabados, mapa, assim. E aqui teremos livros únicos. E neste único livro, chamaremos o componente do livro. Vamos, vamos importar o componente duplo aqui. Importar livro Componentes assim. Agora isso aceitará algumas propriedades. Livro chave que ID, ID, análise int. Vamos apenas dizer livro. Nós nos certificamos de que seja um ID. Ou seja, é n taxa numérica. Digamos que o editor vá mais tarde. nome do ponto do livro é igual a barras. Livro, o ouvido. String, assim assim são terríveis. Livro. Não. Em seguida, terminei. Livro. Dot, terminado, ponto dois. String. Em seguida, clique em livro. Terminado será o clique da função , clique em Livro fornecido. Temos que criar essa função. Digamos que que tenhamos esse componente de livro. Certo, aqui. Isso será isso. Vamos ver. Existe algum editor? Vamos chamar este componente Este livro de cliques concluído. Aqui. Clique Ok, a ortografia, eu acho, terminou C. Ok. Agora, eles estão funcionando corretamente. Você pode ver que temos que criar uma função de flip book finalizada também. E para essas linhas vermelhas e tudo, se você quiser, você pode simplesmente ir para o arquivo ts config dot JS, que está aqui. E então aqui, altere o valor estrito para false. O distrito para falso, é isso. Se você fizer isso, essas linhas vermelhas e essas coisas serão resolvidas. C, Esses agora estão resolvidos. Então é isso para este vídeo. No próximo vídeo, trabalharemos com funcionalidade para alterar a livraria para concluída. Obrigado. 15. Funcionalidade para alterar o status do livro: Então, bem-vindo de volta. Vamos trabalhar em nosso aplicativo. V4. Bom, para atribuir essa função ou seja, obtenha livros. Esse botão. O botão aqui, que é esse. Então, basta escrever onclick e isso é um bom livro. E também da mesma forma, isso mostrará todos os livros que estão acabados. Da mesma forma, teremos, teremos que mostrar livros que são, quais são, que estão acabados dessa maneira. Estes são livros que não estão acabados e temos que mostrar livros que estão acabados. Então, o que vou fazer é simplesmente copiar esse pedaço de linhas. Vamos dizer, suponha que a primeira coisa eu copiarei isso e colarei aqui. Serão livros de escrita. Livros, acabados. Livros, acabados. Comprimento do ponto em vez da mesma coisa e ele realmente terminou o livro, é isso. E então eu farei novamente o mapeamento assim. Então, basta copiá-lo e cole-o abaixo aqui. Farei esse mapeamento com livros, terminado, mapa de pontos. E ele terá livros acabados nos dias de hoje. E agora vamos trabalhar na função aqui e vamos nomeá-la. Reserve, acabado, copiado e colado aqui também. Esta será a função que estaremos criando agora. Livro do lago terminado. Vá até aqui. Função criativa. Const assim. Uma pia. Ele aceitará ID, assim. Certo? Então agora, novamente, teremos try-catch e tudo mais. Da mesma forma, como sempre, já que temos que nos conectar ao contrato inteligente, que já está implantado, basta escrever console.log e alterar status do livro. Basta imprimir o cabeçalho também. Então, nesse bloco try, nós simplesmente teremos, copiaremos de, copiaremos daqui. Basta copiar essas linhas. Cole-o aqui. Certo, temos o provedor. Em seguida, a transição da biblioteca será, ela será simplesmente definida. ID finalizado assim, digamos log de pontos do console. Portanto, esta é a função. E a maioria das funções é um pouco semelhante. Nada tão extravagante. Estamos apenas chamando este que está pronto para terminar isso aqui. Este, é preciso um ID de livro e um booleano acabado. Então, simplesmente vamos e enviamos o ID e o booleano, é isso. Então, finalmente, escrevemos todos esses códigos para o aplicativo. Fico feliz que você assistiu a coisa agora, no próximo módulo, testaremos nosso aplicativo se tudo está funcionando corretamente ou não. E se recebermos algum erro, vamos resolvê-lo o mais rápido possível. Obrigado. 16. Teste o aplicativo completo: Olá. Neste vídeo, nós realmente testamos o funcionamento do nosso aplicativo. Estamos citando os últimos vídeos, mas agora, é hora de testar se todas as funcionalidades estão funcionando ou não. Então, a primeira coisa que vou fazer é genes do que a rede de meus tomates de Gormley para ser suponho. E então eu vou clicar na carteira Connect. Veja, você não está conectado para chamá-lo de rede, por isso está nos solicitando a mudar nossa rede. Isso está funcionando bem. Vamos para a colina. Então, quando clico em Conectar violeta, MetaMask acrescenta e, em seguida, e conecte-se. Certo. Agora temos esses livros. Se você se lembra, já adicionamos um livro azul anteriormente. Então, se eu clicar em Obter livros, teremos dois livros inacabados. Veja, este é um, aprenda árvore web e a outra é aprender capacete. Então isso está muito bonito. E também se eu escrever aprender, há uma data de negociação é a próxima. Js. Mark Zuckerberg e 2018. Suponha que se eu simplesmente escrever, se eu mudar para sim, vamos ver o que acontece. Alertas podem se formar. Vamos ver se a transação ainda está pendente. Vai demorar algum tempo. Está feito. Então, agora, se eu clicar em Obter livros, veja que tenho livros terminados. Mas estou bem. Esse erro. Eu entendi por que são dois porque aqui esquecemos de mudar. Então, os livros acabados terão esse comprimento. Digamos que isso seja um erro muito pequeno. É, está corrigido. Livros terminaram um. E se eu clicar neste livro acabado, aprenda capacete. Mais uma vez. Mostrando isso, depois clico em confirmar. Esse motivo principal deste curso era entender o básico da cadeia de blocos. A tecnologia não é essa interface do usuário. Se você quiser, você pode usar qualquer ferramenta de interface do usuário front-end e torná-la muito bonita. Porque você pode estar pensando que isso é muito simples, mas o principal é essa funcionalidade. Agora, está gastando a função finalizada definida. Esse gasto. Agora está feito. Se eu clicar em Obter livros. Veja, isso também está na seção finalizada e agora temos um livro inacabado e para o livro finalizado. Então, esse aplicativo completo está funcionando de forma incrível. E acho que estamos orgulhosos de nós mesmos por termos construído um aplicativo descentralizado do zero. Então, espero que você tenha gostado do curso. Certifique-se de assistir a outros cursos meus também. Obrigado. Tenha um bom dia.