• 介绍
• 前端应用
• 如何使用
• 发送token
• hardhat Tutorials , hardhat 教程
• Contact 联系方式
• 介绍
如果您想快速开始使用您的 dApp 或使用前端查看整个项目的外观，您可以使用 我们的样板存储库。
• 包含什么
- 我们在本教程中使用的 Solidity 合约
- 测试合约的全部功能
- 使用 ethers.js 与合约交互的最小 React 前端
• Solidity 合约和测试
在 repo 的根目录中，您会找到我们通过本教程与 Token 合约一起构建的 Hardhat 项目。刷新你对它实现的记忆：
- 代币的总供应量是固定的，无法更改。
- 整个供应分配到部署合约的地址。
- 任何人都可以收到代币。
- 任何拥有至少一个代币的人都可以转移代币。
- 代币是不可分割的。您可以转移 1、2、3 或 37 个代币，但不能转移 2.5 个。
• 前端应用
在 frontend 中，你会发现一个简单的应用程序，它允许用户做两件事：
- 检查连接钱包的余额
- 发送代币到一个地址
这是一个单独的 npm 项目，它是使用 create-react-app 创建的，所以这意味着它使用了 webpack 和 babel。
• 前端文件架构
src/包含所有代码src/components包含反应组件Dapp.js是唯一具有业务逻辑的文件。如果您将其用作样板，您可以在此处用您自己的代码替换代码- 每个其他组件都只呈现 HTML，没有逻辑。
src/contracts有合约的 ABI 和地址，这些是由部署脚本自动生成的
• 如何使用
先克隆仓库，然后准备合约部署：
cd hardhat-boilerplate
npm install
npx hardhat node
在这里，我们只安装 npm 项目的依赖项，并通过运行 npx hardhat node 启动一个 Hardhat Network 实例，您可以使用 MetaMask 连接到该实例。在同一目录中的不同终端中，运行：
npx hardhat --network localhost run scripts/deploy.js
这会将合约部署到 Hardhat Network。完成后，启动 react web 应用：
cd frontend
npm install
npm run start
然后在你的浏览器中打开 http://127.0.0.1:3000/ 你应该会看到这个：[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wMQg3UfN-1658429473916)(/front-5.png)]
在 MetaMask 中将您的网络设置为“127.0.0.1:8545”。
现在单击 Web 应用程序中的按钮。然后你应该看到这个：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-bfeQV5jd-1658429473917)(https://user-images.githubusercontent.com/28084126/180290883-096572f1-8ca0-4c0e-bea8-e78d3904b1e6.png)]
• 发送token
这里发生的情况是显示当前钱包余额的前端代码检测到余额为“0”，因此您将无法尝试转账功能。通过运行：
npx hardhat --network localhost faucet <你的地址>
您将运行我们包含的自定义 Hardhat 任务，该任务使用部署帐户的余额向您的地址发送 100 MHT 和 1 ETH。这将允许您将令牌发送到另一个地址。
您可以在 /tasks/faucet.js 中查看任务的代码，这是从hardhat.config.js。
$ npx hardhat --network localhost faucet 0x0987a41e73e69f60c5071ce3c8f7e730f9a60f90
Transferred 1 ETH and 100 tokens to 0x0987a41e73e69f60c5071ce3c8f7e730f9a60f90
在您运行“npx hardhat node”的终端中，您还应该看到：
eth_sendTransaction
Contract call: Token#transfer
Transaction: 0x460526d98b86f7886cd0f218d6618c96d27de7c745462ff8141973253e89b7d4
From: 0xc783df8a850f42e7f7e57013759c285caa701eb6
To: 0x7c2c195cd6d34b8f845992d380aadb2730bb9c6f
Value: 0 ETH
Gas used: 37098 of 185490
Block #8: 0x6b6cd29029b31f30158bfbd12faf2c4ac4263068fd12b6130f5655e70d1bc257
console.log:
Transferring from 0xc783df8a850f42e7f7e57013759c285caa701eb6 to 0x0987a41e73e69f60c5071ce3c8f7e730f9a60f90 100 tokens
显示合约中 transfer() 函数的 console.log 输出，这是运行水龙头任务后 Web 应用程序的外观：[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-pIx7a316-1658429473918)(/front-6.png)]
尝试使用它并阅读代码。它充满了解释正在发生的事情的评论，并清楚地表明什么代码是以太坊样板以及什么是实际的 dApp 逻辑。这应该使存储库易于为您的项目重用。
• hardhat Tutorials , hardhat 教程
CN 中文 Github hardhat 教程 : github.com/565ee/hardhat_CN
CN 中文 CSDN hardhat 教程 : blog.csdn.net/wx468116118
EN 英文 Github hardhat Tutorials : github.com/565ee/hardhat_EN
• Contact 联系方式
Homepage : 565.ee
微信公众号 : wx468116118
微信 QQ : 468116118
GitHub : github.com/565ee
CSDN : blog.csdn.net/wx468116118
Email : [email protected]