Alchemy Road to Web3- 第四周教程
step1 创建项目设置1.打开控制台并输入以下代码，从而创建 Next JS 项目样板并安装 TailwindCSS。 npx create-next-app -e with-tailwindcss nameoftheproject ，如图。2.输入cd nameoftheproject && code . （最后那个点别掉了，掉了打开的就是之前的项目）3.在控制台输入npm run dev ，如果电脑弹出防火墙，就点允许访问，不弹出也没关系。4.回到vscode，将index.tsx和_app.tsx的后缀改成.jsx，删除_app.jsx中报错的部分，如图。 或者直接粘贴下面的代码替换。import '../styles/globals.css' function MyApp({ Component, pageProps }) { return <Component {...pageProps} /> } export default MyApp step2 修改index.jsx代码1.这一步具体每行代码的意义可以到官方看，我这里放最终的代码，方便大家完成任务，...
Alchemy Road to Web3- 第四周教程
step1 创建项目设置1.打开控制台并输入以下代码，从而创建 Next JS 项目样板并安装 TailwindCSS。 npx create-next-app -e with-tailwindcss nameoftheproject ，如图。2.输入cd nameoftheproject && code . （最后那个点别掉了，掉了打开的就是之前的项目）3.在控制台输入npm run dev ，如果电脑弹出防火墙，就点允许访问，不弹出也没关系。4.回到vscode，将index.tsx和_app.tsx的后缀改成.jsx，删除_app.jsx中报错的部分，如图。 或者直接粘贴下面的代码替换。import '../styles/globals.css' function MyApp({ Component, pageProps }) { return <Component {...pageProps} /> } export default MyApp step2 修改index.jsx代码1.这一步具体每行代码的意义可以到官方看，我这里放最终的代码，方便大家完成任务，...
ALCHEMY第三周任务-使用Polygon链上元数据制作 NFT
我们都知道创建 NFT 时，最好将元数据存储在集中式对象存储或IPFS等分散式解决方案中，以避免直接在链上存储大量数据（如图像和 JSON 对象）产生的巨额 Gas 费用。 但这有一个问题： 不将元数据存储在区块链上将使您无法通过智能合约与之交互，因为区块无法与“外部世界”通信。**如果我们想直接从我们的智能合约更新我们的元数据，我们需要将其存储在链上，但是汽油费呢？幸运的是，像 Polygon 这样的 L2 链可以提供帮助，大大降低了 Gas 成本，并引入了许多优势，使开发人员能够扩展其应用程序的功能。 在本教程中，学习如何创建区块链游戏的基础知识，开发一个完全动态的 NFT，其链上元数据会根据您与它的交互而变化，并将其部署在Polygon Mumbai上以降低汽油费。 更准确地说，您将学习：如何在链上存储 NFT 元数据什么是 Polygon 以及为什么降低 Gas 费用很重要。如何在 Polygon Mumbai 上部署如何处理和存储链上 SVG 图像和 JSON 对象如何根据您与 NFT 的交互来修改元数据1.Polygon PoS - 更低的 Gas 费用和更快的交易P...
ALCHEMY第三周任务-使用Polygon链上元数据制作 NFT
我们都知道创建 NFT 时，最好将元数据存储在集中式对象存储或IPFS等分散式解决方案中，以避免直接在链上存储大量数据（如图像和 JSON 对象）产生的巨额 Gas 费用。 但这有一个问题： 不将元数据存储在区块链上将使您无法通过智能合约与之交互，因为区块无法与“外部世界”通信。**如果我们想直接从我们的智能合约更新我们的元数据，我们需要将其存储在链上，但是汽油费呢？幸运的是，像 Polygon 这样的 L2 链可以提供帮助，大大降低了 Gas 成本，并引入了许多优势，使开发人员能够扩展其应用程序的功能。 在本教程中，学习如何创建区块链游戏的基础知识，开发一个完全动态的 NFT，其链上元数据会根据您与它的交互而变化，并将其部署在Polygon Mumbai上以降低汽油费。 更准确地说，您将学习：如何在链上存储 NFT 元数据什么是 Polygon 以及为什么降低 Gas 费用很重要。如何在 Polygon Mumbai 上部署如何处理和存储链上 SVG 图像和 JSON 对象如何根据您与 NFT 的交互来修改元数据1.Polygon PoS - 更低的 Gas 费用和更快的交易P...
Alchemy的the Road to Web3-第二周文本教程
今天我们一起来看看第二周任务。首先看看任务的目标是什么？在本教程中，将学习如何使用Alchemy、Hardhat、Ethers.js开发和部署去中心化的“给我买杯咖啡”智能合约，允许访问者发送（假）ETH 作为提示并留下好消息。话不多说，我们现在就开始第二周课程吧。 1.先决条件npm (npx) version 8.5.5node version 16.13.1如果你会js代码更好2.创建项目#创建一个项目目录并且初始化package.json mkdir BuyMeACoffee-contracts cd BuyMeACoffee-contracts npm init -y 创建目录创建目录 创建目录# 使用hardhat生成项目框架 npx hardhat # 该命令建议执行，因为依赖可能有问题 npm install --save-dev hardhat@^2.9.3 @nomiclabs/hardhat-waffle@^2.0.0 ethereum-waffle@^3.0.0 chai@^4.2.0 @nomiclabs/hardhat-ethers@^2.0.0 et...
Alchemy的the Road to Web3-第二周文本教程
今天我们一起来看看第二周任务。首先看看任务的目标是什么？在本教程中，将学习如何使用Alchemy、Hardhat、Ethers.js开发和部署去中心化的“给我买杯咖啡”智能合约，允许访问者发送（假）ETH 作为提示并留下好消息。话不多说，我们现在就开始第二周课程吧。 1.先决条件npm (npx) version 8.5.5node version 16.13.1如果你会js代码更好2.创建项目#创建一个项目目录并且初始化package.json mkdir BuyMeACoffee-contracts cd BuyMeACoffee-contracts npm init -y 创建目录创建目录 创建目录# 使用hardhat生成项目框架 npx hardhat # 该命令建议执行，因为依赖可能有问题 npm install --save-dev hardhat@^2.9.3 @nomiclabs/hardhat-waffle@^2.0.0 ethereum-waffle@^3.0.0 chai@^4.2.0 @nomiclabs/hardhat-ethers@^2.0.0 et...
Alchemy第一周边学边获取NFT
Alchemy计划将新资金用于推广Web3采用，这方面的一些举措包括推出Web3 University，就是现在的 Road to Web3 活动，活动为期10周，每周一个NFT。 该课程是为期10周，只要你在10周完成就可以。 今天我们先来说下第一个任务课程：如何使用 Alchemy 开发 NFT 智能合约（ERC721） 官方提供了一个本课程的大纲：如何使用 OpenZeppelin 和 Remix 编写和修改智能合约使用Goerl网络获得免费的 Rinkeby ETH将其部署在以太坊 Goerl测试网区块链上以节省汽油费使用 Filebase 在 IPFS 上托管 NFT 令牌元数据。铸造 NFT 并在 OpenSea 上可视化1.编写合约 首先我们来到合约编写页面合约编写页面合约编写页面 合约编写页面 2.将合约使用Remix修改和部署导入Remix后合约的结构如下：我们需要修改如下几点： 1.该NFT是任何人都可以mint的，所以修改如下 function safeMint(address to, string memory uri) public { require(...
Alchemy第一周边学边获取NFT
Alchemy计划将新资金用于推广Web3采用，这方面的一些举措包括推出Web3 University，就是现在的 Road to Web3 活动，活动为期10周，每周一个NFT。 该课程是为期10周，只要你在10周完成就可以。 今天我们先来说下第一个任务课程：如何使用 Alchemy 开发 NFT 智能合约（ERC721） 官方提供了一个本课程的大纲：如何使用 OpenZeppelin 和 Remix 编写和修改智能合约使用Goerl网络获得免费的 Rinkeby ETH将其部署在以太坊 Goerl测试网区块链上以节省汽油费使用 Filebase 在 IPFS 上托管 NFT 令牌元数据。铸造 NFT 并在 OpenSea 上可视化1.编写合约 首先我们来到合约编写页面合约编写页面合约编写页面 合约编写页面 2.将合约使用Remix修改和部署导入Remix后合约的结构如下：我们需要修改如下几点： 1.该NFT是任何人都可以mint的，所以修改如下 function safeMint(address to, string memory uri) public { require(...
Alchemy的the Road to Web3第十周教程- 使用 Lens 协议创建去中心化 Twitter
在本课中，将学习：如何使用 Apollo GraphQL 客户端设置 Next.js 应用程序如何使用 Lens 协议 API 获取存储在 Polygon 区块链上的个人资料、帖子和其他数据MintKudos API 简介——以便您可以将您的 PoK 代币集成到您的 dapp 中！Lit 协议简介——如果您想加密某些帖子以仅显示给各个社区成员如何使用 Repl.it 部署你的去中心化社交媒体应用程序前端网站扩展此项目的多个挑战选项！话不多说了，我们开始今天的课程吧。1.设置依赖安装Apollo我们今天的课程需要在VScode中去执行，首先我们需要建立一个项目# 创建一个road-to-lens 这是注释 不要输入命令行 npx create-next-app road-to-lens # 安装graphql npm install @apollo/client graphql # 运行项目验证 npm run dev 当你出现这样的结果，恭喜你已经成功完成第一步了。2.在 index.js 页面上使用 Lens 推荐的配置文件尝试 Apollo GraphQL2.1新建apoll...
Alchemy的the Road to Web3第十周教程- 使用 Lens 协议创建去中心化 Twitter
在本课中，将学习：如何使用 Apollo GraphQL 客户端设置 Next.js 应用程序如何使用 Lens 协议 API 获取存储在 Polygon 区块链上的个人资料、帖子和其他数据MintKudos API 简介——以便您可以将您的 PoK 代币集成到您的 dapp 中！Lit 协议简介——如果您想加密某些帖子以仅显示给各个社区成员如何使用 Repl.it 部署你的去中心化社交媒体应用程序前端网站扩展此项目的多个挑战选项！话不多说了，我们开始今天的课程吧。1.设置依赖安装Apollo我们今天的课程需要在VScode中去执行，首先我们需要建立一个项目# 创建一个road-to-lens 这是注释 不要输入命令行 npx create-next-app road-to-lens # 安装graphql npm install @apollo/client graphql # 运行项目验证 npm run dev 当你出现这样的结果，恭喜你已经成功完成第一步了。2.在 index.js 页面上使用 Lens 推荐的配置文件尝试 Apollo GraphQL2.1新建apoll...
