Alchemy 0擼教程:第二周任務 通往web3.0之路 手把手教你搭建“給我買杯咖啡”的

時間：2023-07-21 16:03:01 | 來源：網(wǎng)站運營

時間：2023-07-21 16:03:01 來源：網(wǎng)站運營

Alchemy 0擼教程:第二周任務 通往web3.0之路 手把手教你搭建“給我買杯咖啡”的 DeFi dapp：寫在前面：接下來我會把Alchemy 1-10周的任務全部寫出來。（1-10周理解成10個任務，完成后每個任務會有一個NFT，并不是代表你這周只能做第一個，下周只能做第二個）

注意：所有任務，只能用電腦做，因為Alchemy這個項目是教大家寫Web3.0代碼的，通過這些任務讓你知道智能合約是怎么部署的，NFT畫廊以及平臺是怎么搭建的，swap dapp是怎么搭建的，以及gamefi的簡單代碼之類的。它是從純粹技術角度來幫助大家更加深刻理解Web3.0。

電腦配置要求：win 8及以上的系統(tǒng)。（因為需要裝一些軟件，那些軟件的配置對電腦的要求至少是win 8）

小狐貍錢包：最好是空錢包，你不用的，因為涉及到要在軟件上傳一些私鑰之類的重要信息。

Alchemy項目介紹：

2019年12月，Alchemy完成1500萬刀A輪融資，投資機構是Pantera Capital，斯坦福大學，Coinbase以及三星等

2021年4月，Alchemy完成8000萬刀B輪融資，Coatue和Addition領投，DFJ Growth、K5 Global、Chainsmokers（煙鬼組合）、演員Jared Leto和Glazer家族參投。

2021年10月，Alchemy完成2.5億刀C輪融資，由a16z領投的。

2022年2月，Alchemy又完成2億美元融資，Lightspeed與Silver Lake領投。

截止目前為止一共融資5.45億刀。估值為105億刀。




有a16z領投的項目放心就擼就可以了。項目背景強大、經(jīng)費充足、踏實做事、還沒有發(fā)token，目前每完成一個任務給一個靈魂綁定的NFT（NFT在你的錢包不可以賣，跟錢包是綁定的，Web3.0后期玩法非常多）

并且由于任務難度太大，并且任務比較多，勸退了很多人。并沒有那么多擼子能堅持下來。第一遍做1-10個任務，快的話需要兩天，一般需要三天時間，每天十個小時的那種。做到后面賬號就快很多，但是一整天時間是要的。并且做完后官方快照速度慢。這又勸退了一大部分人。能堅持做下來的沒幾個。如果項目最后空投，那么絕對是大毛。一個NFT預估1000刀應該不是什么大問題。（開玩笑的，你們自己判斷。這種毛先擼為盡）




教程開始

1.安裝環(huán)境(第二周就要搭建安裝環(huán)境了，后面任務都要用到)

注意：這里對電腦配置就有要求了。至少是win8及以上的系統(tǒng)。不然后面任務都做不了了。

安裝Nodejs軟件，選擇最新版本。（怎么安裝Nodejs大家直接自行百度，我在這里不放鏈接了。）

安裝完畢之后，還要做接下來的設置。（如果不設置，后面部署dapp一定出錯！?。。?br>
在你的電腦輸入 cmd指令，并且依次輸入node -v npm -v npx -v看這三個的版本號。

安裝VScode（怎么安裝VScode大家直接自行百度，我在這里不放鏈接了。）

2.對 BuyMeACoffee.sol 智能合約進行編碼

1.按win+R調出命令框，輸入cmd，進入控制臺。

2.輸入mkdir BuyMeACoffee-contracts按回車創(chuàng)建文件夾，再輸入cd BuyMeACoffee-contracts 按回車進入該文件夾。(注意看路徑，文件夾就在那個路徑，多賬號做的時候最好在1-10任務做完之后，把那些文件粘貼到新的文件，因為第二個賬號做的時候，又會生成一樣的文件。至于文件是否保留，還是你直接刪除，這個你們自己決定。我是每一個賬號做的文件我都是分好類的。沒有刪除。創(chuàng)建的文件一般都是在C：/Users/*** 路徑下 你可以去找到那個文件夾)

3.輸入npm init -y 開始新項目。

4.輸入npx hardhat創(chuàng)建示例項目。（然后連續(xù)按三下 enter鍵）

6.按照提示輸入下面代碼，坐等安裝完畢。出現(xiàn)警告不管。

npm install --save-dev "hardhat@^2.10.1" "@nomicfoundation/hardhat-toolbox@^1.0.1"

7.打開vscode，點擊file，點擊open folder。（在第5行。如果實在不習慣英文版本，VScode有中文版本的。你們下載中文版本的也一樣。）

8.找到剛才創(chuàng)建的BuyMeACoffee-contracts文件夾，點擊選擇文件夾。（創(chuàng)建的文件一般都是在C：/Users（用戶）/*** 路徑下 你可以去找到那個文件夾）

9.打開后如圖所示。

10.右鍵rename將合約文件lock.sol重命名為BuyMeACoffee.sol

11.BuyMeACoffee.sol代碼替換成下面的并保存?。ú槐４鏇]用啊，要點保存。如果實在不知道怎么保存就看我圖片紅色標出來的地方，會有你現(xiàn)在正在運行的文件，邊上有一個×，你關閉它，會彈出來讓你保存的提示。你點保存就好了。）




//SPDX-License-Identifier: Unlicense

// contracts/BuyMeACoffee.sol
pragma solidity ^0.8.0;

// Switch this to your own contract address once deployed, for bookkeeping!
// Example Contract Address on Goerli: 0xDBa03676a2fBb6711CB652beF5B7416A53c1421D

contract BuyMeACoffee {
// Event to emit when a Memo is created.
event NewMemo(
address indexed from,
uint256 timestamp,
string name,
string message
);

// Memo struct.
struct Memo {
address from;
uint256 timestamp;
string name;
string message;
}

// Address of contract deployer. Marked payable so that
// we can withdraw to this address later.
address payable owner;

// List of all memos received from coffee purchases.
Memo[] memos;

constructor() {
// Store the address of the deployer as a payable address.
// When we withdraw funds, we'll withdraw here.
owner = payable(msg.sender);
}

/**
* @dev fetches all stored memos
*/
function getMemos() public view returns (Memo[] memory) {
return memos;
}

/**
* @dev buy a coffee for owner (sends an ETH tip and leaves a memo)
* @param _name name of the coffee purchaser
* @param _message a nice message from the purchaser
*/
function buyCoffee(string memory _name, string memory _message) public payable {
// Must accept more than 0 ETH for a coffee.
require(msg.value > 0, "can't buy coffee for free!");

// Add the memo to storage!
memos.push(Memo(
msg.sender,
block.timestamp,
_name,
_message
));

// Emit a NewMemo event with details about the memo.
emit NewMemo(
msg.sender,
block.timestamp,
_name,
_message
);
}

/**
* @dev send the entire balance stored in this contract to the owner
*/
function withdrawTips() public {
require(owner.send(address(this).balance));
}
}

3 創(chuàng)建一個 buy-coffee.js 腳本來測試你的合約

1.將deploy.js重命名為buy-coffee.js

并將代碼替換成下面的：（不保存沒用啊，要點保存。如果實在不知道怎么保存就看我圖片紅色標出來的地方，會有你現(xiàn)在正在運行的文件，邊上有一個×，你關閉它，會彈出來讓你保存的提示。你點保存就好了。）




const hre = require("hardhat");

// Returns the Ether balance of a given address.
async function getBalance(address) {
const balanceBigInt = await hre.ethers.provider.getBalance(address);
return hre.ethers.utils.formatEther(balanceBigInt);
}

// Logs the Ether balances for a list of addresses.
async function printBalances(addresses) {
let idx = 0;
for (const address of addresses) {
console.log(`Address ${idx} balance: `, await getBalance(address));
idx ++;
}
}

// Logs the memos stored on-chain from coffee purchases.
async function printMemos(memos) {
for (const memo of memos) {
const timestamp = memo.timestamp;
const tipper = memo.name;
const tipperAddress = memo.from;
const message = memo.message;
console.log(`At ${timestamp}, ${tipper} (${tipperAddress}) said: "${message}"`);
}
}

async function main() {
// Get the example accounts we'll be working with.
const [owner, tipper, tipper2, tipper3] = await hre.ethers.getSigners();

// We get the contract to deploy.
const BuyMeACoffee = await hre.ethers.getContractFactory("BuyMeACoffee");
const buyMeACoffee = await BuyMeACoffee.deploy();

// Deploy the contract.
await buyMeACoffee.deployed();
console.log("BuyMeACoffee deployed to:", buyMeACoffee.address);

// Check balances before the coffee purchase.
const addresses = [owner.address, tipper.address, buyMeACoffee.address];
console.log("== start ==");
await printBalances(addresses);

// Buy the owner a few coffees.
const tip = {value: hre.ethers.utils.parseEther("1")};
await buyMeACoffee.connect(tipper).buyCoffee("Carolina", "You're the best!", tip);
await buyMeACoffee.connect(tipper2).buyCoffee("Vitto", "Amazing teacher", tip);
await buyMeACoffee.connect(tipper3).buyCoffee("Kay", "I love my Proof of Knowledge", tip);

// Check balances after the coffee purchase.
console.log("== bought coffee ==");
await printBalances(addresses);

// Withdraw.
await buyMeACoffee.connect(owner).withdrawTips();

// Check balances after withdrawal.
console.log("== withdrawTips ==");
await printBalances(addresses);

// Check out the memos.
console.log("== memos ==");
const memos = await buyMeACoffee.getMemos();
printMemos(memos);
}

// We recommend this pattern to be able to use async/await everywhere
// and properly handle errors.
main()
.then(() => process.exit(0))
.catch((error) => {
console.error(error);
process.exit(1);
});




2.在控制臺輸入npx hardhat run scripts/buy-coffee.js，出現(xiàn)下圖就對了。

4.使用Alchemy 和 MetaMask 將你的 BuyMeACoffe.sol 智能合約部署到以太坊 Goerli 測試網(wǎng)

1.右鍵點擊scipts，點擊new file，創(chuàng)建一個名為deploy.js的文件。

2.在deploy.js中粘貼以下代碼。（把代碼粘貼好后，點那個×，會彈出窗口讓你保存。）




// scripts/deploy.js

const hre = require("hardhat");

async function main() {
// We get the contract to deploy.
const BuyMeACoffee = await hre.ethers.getContractFactory("BuyMeACoffee");
const buyMeACoffee = await BuyMeACoffee.deploy();

await buyMeACoffee.deployed();

console.log("BuyMeACoffee deployed to:", buyMeACoffee.address);
}

// We recommend this pattern to be able to use async/await everywhere
// and properly handle errors.
main()
.then(() => process.exit(0))
.catch((error) => {
console.error(error);
process.exit(1);
});




3.在控制臺輸入npx hardhat run scripts/deploy.js ，并按回車，出現(xiàn)下面那句BuyMeACoffee deployed to: 0x5FbDB2315678afecb367f032d93F642f64180aa3就對了。

4.打開你的hardhat.config.js文件，刪除它里面的所有代碼并將下面的代碼粘貼到其中。記得保存。

// hardhat.config.js

require("@nomiclabs/hardhat-ethers");
require("@nomiclabs/hardhat-waffle");
require("dotenv").config()

// You need to export an object to set up your config
// Go to https://hardhat.org/config/ to learn more

const GOERLI_URL = process.env.GOERLI_URL;
const PRIVATE_KEY = process.env.PRIVATE_KEY;

/**
* @type import('hardhat/config').HardhatUserConfig
*/
module.exports = {
solidity: "0.8.4",
networks: {
goerli: {
url: GOERLI_URL,
accounts: [PRIVATE_KEY]
}
}
};

5.在控制臺輸入npm install dotenv，安裝dotenv。如圖所示

6.在控制臺輸入echo test>.env 創(chuàng)建一個.env文件

然后在這里可以看到。

7.將以下代碼粘貼進.env

GOERLI_URL=https://eth-goerli.alchemyapi.io/v2/<your api key>
GOERLI_API_KEY=<your api key>
PRIVATE_KEY=<your metamask api key>







注意：第7步的這三行代碼不是最終的，三行全部要換成自己對應的鏈接，繼續(xù)往下看。

8.替換GOERLI_URL。

登錄進你的Alchemy帳戶(谷歌郵箱登錄)。進入dashboard，點擊create app。（有些用戶系統(tǒng)會自動給你創(chuàng)建好一個Goerli賬戶。沒有就創(chuàng)建一個。）

點擊view key

復制HTTPS的框內內容，切換到vscode，粘貼到如下位置。（=后面全部刪了，粘貼剛剛的https里面的鏈接進去。）

9.替換GOERLI_API_KEY。

將API KEY框內內容復制，然后切換到vscode粘貼到如下位置。（跟上面一樣的）

10.替換PRIVATE_KEY。（這一步要用到你小狐貍錢包的私鑰。你直接把私鑰復制進去。有些私鑰是0x開頭的，有些不是。如果是0x開頭的，那么0x不要復制進去。）

11.訪問領水網(wǎng)站并使用你的 Alchemy 帳戶登錄以獲得一些免費的測試eth。（網(wǎng)站自己手敲）




順便來把Goerli測試網(wǎng)絡加到你的小狐貍錢包（不管你的小狐貍錢包現(xiàn)在有沒有Goerli測試網(wǎng)，你添加一個新的。網(wǎng)絡名稱可以隨便取，但是你自己要以后看得懂。如果你需要擼多個錢包，那么建議你把錢包最后三位來命名。比如321-Goerli網(wǎng)絡 這樣以后你看到這個你就明白是尾號312錢包對應的測試網(wǎng)絡，就不會亂。 RPC URL就是你之前復制的 HTTPS URL）

12.運行部署腳本npx hardhat run scripts/deploy.js --network goerli ，會發(fā)現(xiàn)出現(xiàn)紅色的報錯。

13.直接輸入npm install --save-dev @nomiclabs/hardhat-waffle 安裝第11步的缺的包。安裝時有一堆warn不需要管。

14.再運行npx hardhat run scripts/deploy.js --network goerli ，出現(xiàn)下面那行BuyMeACoffee deployed to: 某個地址（這個地址就是你部署的合約地址，記得復制粘貼下來）就對了。（如果你的錢包沒有測試幣，部署合約一定會失敗?；蛘呷绻厦娴牟襟E你沒有做好，也一定會失敗。如果部署合約失敗，你就把電腦中的文件夾刪了。重頭再來。這樣最保險。）

5.實施一個withdraw腳本

1.右鍵點擊script創(chuàng)建withdraw.js文件，將下列代碼粘貼進去。




// scripts/withdraw.js

const hre = require("hardhat");
const abi = require("../artifacts/contracts/BuyMeACoffee.sol/BuyMeACoffee.json");

async function getBalance(provider, address) {
const balanceBigInt = await provider.getBalance(address);
return hre.ethers.utils.formatEther(balanceBigInt);
}

async function main() {
// Get the contract that has been deployed to Goerli.
const contractAddress="0xDBa03676a2fBb6711CB652beF5B7416A53c1421D";
const contractABI = abi.abi;

// Get the node connection and wallet connection.
const provider = new hre.ethers.providers.AlchemyProvider("goerli", process.env.GOERLI_API_KEY);

// Ensure that signer is the SAME address as the original contract deployer,
// or else this script will fail with an error.
const signer = new hre.ethers.Wallet(process.env.PRIVATE_KEY, provider);

// Instantiate connected contract.
const buyMeACoffee = new hre.ethers.Contract(contractAddress, contractABI, signer);

// Check starting balances.
console.log("current balance of owner: ", await getBalance(provider, signer.address), "ETH");
const contractBalance = await getBalance(provider, buyMeACoffee.address);
console.log("current balance of contract: ", await getBalance(provider, buyMeACoffee.address), "ETH");

// Withdraw funds if there are funds to withdraw.
if (contractBalance !== "0.0") {
console.log("withdrawing funds..")
const withdrawTxn = await buyMeACoffee.withdrawTips();
await withdrawTxn.wait();
} else {
console.log("no funds to withdraw!");
}

// Check ending balance.
console.log("current balance of owner: ", await getBalance(provider, signer.address), "ETH");
}

// We recommend this pattern to be able to use async/await everywhere
// and properly handle errors.
main()
.then(() => process.exit(0))
.catch((error) => {
console.error(error);
process.exit(1);
});




如圖所示，記得保存。

2.在控制臺輸入npx hardhat run scripts/withdraw.js ,運行后如下圖就行(這一步是看你小狐貍錢包還有多少測試幣已經(jīng)等下你要買咖啡需要多少以太測試幣的)

6.使用 Replit 和 Ethers.js 構建前端 Buy Me A Coffee 網(wǎng)站 dapp

1.在此處訪問官方示例項目，并創(chuàng)建您自己的副本以進行修改，點擊fork repl復制代碼到你的replit.

BuyMeACoffee - Solidity DeFi Tipping app - Node.js Repl

2.進入該界面，沒用過replit的要注冊一下。注冊用你的谷歌郵箱。

3.下面那一串合約地址換成你在第14步得到的BuyMeACoffee deployed to:冒號后面的地址。（也就是你部署的合約地址。這里就是把官方的示例代碼里面的合約地址替換成你自己的，讓dapp跟你的合約進行綁定。這樣理解就好了。）

4.在 pages/index.js 中按ctrl+f將名稱字符串Albert （有三處）全部改成為你自己的名稱。(名稱你隨便取。)

5.點擊run 按鈕，出現(xiàn)如圖所示即可。

6.右上角點擊publish。（如果右上角沒有publish，那么在左上角里面有。）




7.一直點下一步（要你寫文字的地方，你隨便寫什么都可以），最后publish即可。

8.進入自己創(chuàng)建的網(wǎng)站鏈接小狐貍錢包試著幾筆打賞就可以了。里面要寫一些文字，你隨便寫什么都可以的。（那個網(wǎng)站你記得保存下來。點擊 go to templates跳轉就是你的網(wǎng)站。）

然后第二周任務，就完成了。（這個任務你最好把你部署的合約地址和你的dapp的網(wǎng)站地址都復制出來，方便你填任務表格時候用。）

【注意】你要保存的資料：你的谷歌賬號 你的錢包地址 你的任務合約地址/Github代碼地址/你任務的網(wǎng)址中的一個（有些任務只有合約地址 有些任務都有，都有的你就選一個填） 這些都會在領取NFT的時候用上。建議多做幾個任務后，然后一起提交表格。

表格鏈接要去官方的discord里面問。