看到DC很多小伙伴在做任务二的过程中遇到了各种细节问题,因此想整合MOD:souleigh.eth和大中天#9164 的教程重新整理一份更加详细的流程,希望可以帮到大家。
打开replit实例地址 https://replit.com/@hsl947/Condor-Comment-Panel?v=1 ,点击Fork Repl

名称和介绍随意填写,也可以不用改,直接确认

Fork完会自动打开代码,我们找到“pages/index.tsx”中15行的 RPC地址,确认已被替换成如图所示

确认“hooks/useCommentsContract.ts” 中的 abi 和 合约地址,后续替换

打开remix,点击箭头处的create创建新工作区

新工作区随意命名,点OK

contracts上右键,点击new file,建立新sol文档

打开souleigh.eth部署的合约链接,点击“code”

将Contract source code内的代码内容复制下来

粘贴到remix里刚刚新建的sol文档内

点击小箭头处,将compiler切换成0.8.7(已经是0.8.7就不用动),再点击大箭头处开始编译,等待完成

点击最左侧小箭头,确认是否为Metamask,是否为当前链接的钱包地址,是否为你的合约。都没问题了之后点击Deploy开始部署合约,直至左下角出现合约地址和右下角绿色小勾

部署完成后复制合约地址,打开浏览器,将地址粘贴进去

出现合约信息后点击code,再点击Verify&Publish

如图确认合约地址和选项后点击next

注意:输入contract name为“Comments”,compiler为“v0.8.7”,optimization为“NO”,代码处粘贴本文第十步骤复制的代码,点击Verify,等待验证通过,code右侧出现对号,至此合约部分完成

回到remix,找到“contracts/artifacts/comments_metadata.json”文件,复制其中第9行到123行内容。

回到replit,找到“hooks/useCommentsContract.ts”,将复制内容替换掉第28行到142行内容,并将第160行的 addressOrName改成本文第十三步骤部署的合约地址。

替换好后,点击顶部正中间的“RUN”,测试能否连接钱包及发言。如果连接不了钱包,建议新窗口打开

点击“sign in”登录钱包,经过授权签名后测试下留言功能

如能成功显示则表示构建成功

在浏览器上可以查看到我们进行过的交互 注意:确保code旁边出现绿色对号,也就是验证通过

去discord提交证明,身份到手!


