在本Web3教程中,我们将构建一个功能齐全的区块链web3应用程序。我们将从构建区块链应用程序的基础开始,最后,我们将上线应用程序供所有人使用。我们要建造什么?我们将构建一个名为PickUpLines的去[1]中心化应用程序(dApp)。顾名思义,我们的用户将能够发送一些好的老式搭讪台词,并有机会赢得以太坊作为奖励
先决条件React初级到中级知识对Solidity智能合约有一定了解对区块链编程的基本了解我们需要的工具工作变成了使用正确的工具,对吧?幸运的是,web3有很多工具可以用来实现臭名昭著的WAGMI1.VisualStudioCode或任何文本编辑器2.用于以太坊开发的安全帽amask作为加密钱包4.Vercel和Alchemy作为托管平台让我们开始!现在,我们对最终的应用程序和我们将要使用的工具有了一些了解,让我们开始编写代码吧!首先教程知识,我们将编写区块链应用程序的智能合约。然后,我们将构建我们的React应用程序,最后,将这两个东西连接起来以拥有一个成熟的web3应用程序LOL赛事押注。
用Solidity编写我们的智能合约:1.运行我们的本地以太坊网络我们需要启动一个本地以太坊网络。本地以太坊网络是专门在您的本地机器上运行的区块链网络。我们将在构建应用程序时使用它进行测试,因为它为我们提供了所有区块链功能,而无需使用真正的加密货币。在这个web3教程中,我们将使用Hardhat[2]。由于我们需要在启动之前在本地测试我们的区块链应用程序,因此我们将使用假ETH和假测试帐户通过Hardhat测试我们的智能合约。最重LOL赛事押注要的是,它将有助于在我们的本地区块链上编译我们的智能合约。现在,前往终端并移动到您想要的目录。在那里,运行以下命令:mkdirpickup-linescdpickup-linesnpminit-ynpminstall--save-devhardhat接下来LOL赛事押注,让我们运行一个示例项目:/*TocreateourHardhatproject*/npxhardhat运行项目:/*Tocompileourcontracts*/npxhardhatcompile测试项目:/*Torunourtests*/npxhardhattest上面的代码设置了一个准系统Hardhat项目。没有插件,它允许您创建自己的任务、编译您的Solidity代码并运行您的测试。基本上,您正在本地环境中创建区块链网络你会看到类似这样的东西:
2.创建我们的智能合约现在,让我们在Contracts目录下创建一个PickupLines.sol文件。我们需要遵循严格的文件夹结构。这非常重要,因为我们是在Hardhat之上构建的,我们的/contractsLOL赛事押注,/scripts和/test的默认路径是预定义的。不遵循此结构将导致我们的Hardhat任务失败。要小心!/*Usealicensedep