Search
#純靠北工程師54n
----------
迷：我們這次調整範圍有點大，所以需要做v2整包複製成新的調整。
（幾個月過後，開會時...）
迷：我今天發現了一個軟體可以搭配git分析目前專案上誰用了不好的寫法。經過分析過後發現你寫的code最髒，現在...你有什麼話好說的嗎？
----------
💖 純靠北官方 Discord 歡迎在這找到你的同溫層！
👉 https://discord.gg/tPhnrs2
----------
💖 全平台留言、文章詳細內容
👉 https://init.engineer/cards/show/6647
📜 [專欄新文章] Optimistic Rollup 就這樣用（1）
✍️ Juin Chiu
📥 歡迎投稿： https://medium.com/taipei-ethereum-meetup #徵技術分享文 #使用心得 #教學文 #medium
ERC20 的入金、轉帳與出金
TL;DR
本文會跳過 Optimistic Rollup 的介紹而直接實際演示，關於 Optimistic Rollup 的概念與設計原理我將在日後另撰文說明，有興趣的讀者可以先參考下列三篇文章（由淺入深）：1. OVM Deep Dive 2. (Almost) Everything you need to know about Optimistic Rollup 3. How does Optimism’s Rollup really work?
本文將演示一個 Optimism Rollup 範例，程式碼在這裡。
本演示大量參考了以下這兩個官方範例：optimism-tutorial、l1-l2-deposit-withdrawal。
環境設置
Git
Node.js
Yarn
Docker
Docker-compose
筆者沒有碰到環境相容問題，但是建議都升到最新版本， Node.js 使用 v16.1.0 或以上版本
Optimism 服務啟動
有關 Optimisim 的所有服務，都包裝在 Optimism 這個超大專案當中了，直接使用原始碼進行組建：
$ git clone git@github.com:ethereum-optimism/optimism.git$ cd optimism$ yarn$ yarn build
組建完成後，就可以在本機啟動服務了：
$ cd ops$ docker-compose build$ docker-compose up
這個指令會啟動數個服務，包括：
L1 Ethereum Node (EVM)
L2 Ethereum Node (OVM)
Batch Submitter
Data Transport Layer
Deployer
Relayer
Verifier
Deployer 服務中的一個參數要特別注意： FRAUD_PROOF_WINDOW_SECONDS，這個就是 Optimistic Rollup 的挑戰期，代表使用者出金（Withdraw）需等候的時長。在本篇演示中預設為 0 秒。
如果有需要重啟，記得把整個 Docker Volume 也清乾淨，例如： docker-compose down -v
Optimism 整合測試
在繼續接下來的演示之前，我們需要先確認 Optimism 是否有順利啟動，特別是 Relayer 是否運作正常，因此我們需要先進行整合測試：
$ cd optimism/integration-tests$ yarn build:integration$ yarn test:integration
確保 L1 <--> L2 Communication 相關測試通過後再繼續執行接下來的演示內容。
啟動服務及部署合約需要花費一些時間，運行一段時間（約 120 秒）之後再執行測試，如果測試結果全部皆為 Fail，可能是 Optimism 尚未啟動完成，再等待一段時間即可。
ERC20 合約部署
Optimism 啟動成功並且完成整合測試後，接下來進行 ERC20 合約的部署。筆者已將合約及部署腳本放在 optimistic-rollup-example-erc20 這個專案中：
$ git clone git@github.com:ethereum-optimism/optimistic-rollup-example-erc20.git$ cd optimistic-rollup-example-erc20$ yarn install$ yarn compile
接下來我們需要部署以下合約：
ERC20，部署於 L1
L2DepositedEERC20，部署於 L2
OVM_L1ERC20Gateway，部署於 L1
其中，ERC20 與 L2DepositedERC20 是由上面的範例專案編譯的，可以直接在範例專案中直接取得 ABI；而 OVM_L1ERC20Gateway 則是由 Optimism 編譯的，屬於 Optimistic Rollup 協定的一部分，無法直接在範例專案中取得 ABI。
因此在部署以上三個合約前，我們需先手動將 OVM_L1ERC20Gateway 編譯後的生成品 （Artifacts）——即 ABI，複製到此專案中：
$ cp -r ~/projects/optimism/packages/contracts/artifacts/contracts/optimistic-ethereum/OVM/bridge/tokens/OVM_L1ERC20Gateway.sol ~/projects/optimistic-rollup-example-erc20/artifacts/contracts/
OVM_L1ERC20Gateway 只部署在 L1 上，顧名思義它就是 L1 <=> L2 的「門戶」，提供 Deposit / Withdraw 兩個基本功能，使用者必須透過這個合約來進出 L2。
雖然 OVM_L1ERC20Gateway 是 Optimistic Rollup 官方提供的合約。但是開發者也可以依需求自行設計自己的「門戶」。
接下來，我們直接用腳本進行部署：
$ node ./deploy.jsDeploying L1 ERC20...Deploying L1 ERC20...L1 ERC20 Contract Address: 0x1429859428C0aBc9C2C47C8Ee9FBaf82cFA0F20fDeploying L2 ERC20...L2 ERC20 Contract Address: 0x67d269191c92Caf3cD7723F116c85e6E9bf55933Deploying L1 ERC20 Gateway...L1 ERC20 Gateway Contract Address: 0xB0D4afd8879eD9F52b28595d31B441D079B2Ca07Initializing L2 ERC20...
ERC20 入金、轉帳與出金
ERC20 入金（L1 => L2）
目前餘額：
在合約部署完成後，Deployer 是目前唯一有資金的帳戶，接下來我們就進行入金（Deposit），將 Deployer 的資金從 L1 搬到 L2。
首先，進入 ETH（L1） 的 Console：
$ npx hardhat console --network ethWelcome to Node.js v16.1.0.Type ".help" for more information.>
取得 Deployer / User 帳戶：
// In Hardhat ETH Console
> let accounts = await ethers.getSigners()> let deployer = accounts[0]> let user = accounts[1]
取得 ERC20 及 OVM_L1ERC20Gateway 合約物件，合約地址可以從部署訊息中取得：
// In Hardhat ETH Console
> let ERC20_abi = await artifacts.readArtifact("ERC20").then(c => c.abi)> let ERC20 = new ethers.Contract("0x1429859428C0aBc9C2C47C8Ee9FBaf82cFA0F20f", ERC20_abi)> let Gateway_abi = await artifacts.readArtifact("OVM_L1ERC20Gateway").then(c => c.abi)> let Gateway = new ethers.Contract("0xB0D4afd8879eD9F52b28595d31B441D079B2Ca07", Gateway_abi)
先授權 OVM_L1ERC20Gateway 花費 ERC20：
// In Hardhat ETH Console
> await ERC20.connect(deployer).approve("0xB0D4afd8879eD9F52b28595d31B441D079B2Ca07", 10000)> await ERC20.connect(user).approve("0xB0D4afd8879eD9F52b28595d31B441D079B2Ca07", 10000)
注意：Deployer 及 User 都需要對 OVM_L1ERC20Gateway 進行授權，否則在接下來的出金步驟時 Relayer 會出錯
接著，在 OVM_L1ERC20Gateway 合約呼叫 Deposit：
// In Hardhat ETH Console
> await Gateway.connect(deployer).deposit(1000)
我們可以到 Optimism (L2) 的 Console 確認入金是否成功：
$ npx hardhat console --network optimismWelcome to Node.js v16.1.0.Type ".help" for more information.>
取得 Deployer / User 帳戶：
// In Hardhat Optimism Console
> let accounts = await ethers.getSigners()> let deployer = accounts[0]> let user = accounts[1]
取得 L2DepositedERC20 合約物件，合約地址可以從部署訊息中取得：
// In Hardhat Optimism Console
> let L2ERC20_abi = await artifacts.readArtifact("L2DepositedERC20").then(c => c.abi)> let L2DepositedERC20 = new ethers.Contract("0x67d269191c92Caf3cD7723F116c85e6E9bf55933", L2ERC20_abi)
確認入金是否成功：
// In Hardhat Optimism Console
> await L2DepositedERC20.connect(deployer).balanceOf(deployer.address)BigNumber { _hex: '0x03E8', _isBigNumber: true } // 1000
ERC20 轉帳（L2 <=> L2）
完成以上步驟後，目前的餘額如下：
接下來，我們在 L2 從 Deployer 轉移一部分資金給 User：
// In Hardhat Optimism Console
> await L2DepositedERC20.connect(user).balanceOf(user.address)BigNumber { _hex: '0x00', _isBigNumber: true } // 0> await L2DepositedERC20.connect(deployer).transfer(user.address, 1000){ hash: "..." ...}> await L2DepositedERC20.connect(wallet_1).balanceOf(user.address)BigNumber { _hex: '0x03E8', _isBigNumber: true } // 1000
ERC20 出金（L2 => L1）
完成以上步驟後，目前的餘額如下：
接下來，我們用 User 帳戶提領資金，在 L2DepositedERC20 合約呼叫 Withdraw：
// In Hardhat Optimism Console
> await L2DepositedERC20.connect(user).withdraw(1000){ hash: "..." ...}> await L2DepositedERC20.connect(user).balanceOf(user.address)BigNumber { _hex: '0x00', _isBigNumber: true }
最後，檢查在 L1 是否提領成功：
// In Hardhat ETH Console
> await ERC20.connect(user).balanceOf(user.address)BigNumber { _hex: '0x03E8', _isBigNumber: true } // 1000
由於挑戰期為 0 秒，因此提領幾乎無需等待時間，頂多只需數秒鐘
做完上述所有操作，餘額應該如下：
總結
本文演示了：
Optimistic Rollup 相關服務的本機部署
ERC20 L1 => L2 的入金（Deposit）
ERC20 L2 帳戶之間轉帳（Transfer）
ERC20 L2 => L1 的出金（Withdraw）
筆者未來將繼續擴充此系列的教學內容，例如 ERC721 / ERC1155 的使用方式，敬請期待。
參考資料
OVM Deep Dive
(Almost) Everything you need to know about Optimistic Rollup
How does Optimism’s Rollup really work?
Optimistic Rollup Official Documentation
Ethers Documentation (v5)
Optimism (Github)
optimism-tutorial (Github)
l1-l2-deposit-withdrawal (Github)
Optimistic Rollup 就這樣用（1） was originally published in Taipei Ethereum Meetup on Medium, where people are continuing the conversation by highlighting and responding to this story.
👏 歡迎轉載分享鼓掌
今天這篇文章探討的是 Git 的 pre-commit hook 系統，透過這種 pre-commit 的系統，能夠幫助開發者與本地開發時，先行進行一些處理，避免什麼問題都要丟到遠方的 CI/CD pipeline 去檢查。畢竟程式碼更新，觸發 CI/CD 流程，等待結果告知，這部分有時候都要花上數分鐘，往往就是檢查到一個格式錯誤，譬如拼字錯誤，多一個空白，格式錯誤等。
如果今天可以將一些常用的檢查給複製一份到本地端去執行，這樣開發者可以更快地找出錯誤，同時也可以節省很多等待的時間，因此本篇文章就要針對 git pre-commit hook 來介紹。
本篇文章要介紹的並不是直接使用 git 的 pre-commit hook，而是要使用 python 的套件 git pre-commit hook，其龐大的生態系可以幫助使用者輕鬆的使用常見的 yaml 格式來管理 git 本身的 pre-commit hook。舉例來說，可以於專案底下放置一個有下列內容的檔案
repos:
- repo: https://github.com/pre-commit/pre-commit-hooks
rev: v3.2.0
hooks:
- id: trailing-whitespace
- id: end-of-file-fixer
- id: check-yaml
- id: check-added-large-files
透過 python 的 pre-commit hook 系統，會將其中描述的四個功能 (trailing-whitespace....check-added-large-files)實際的程式碼給轉換並且安裝到 .git/hooks/pre-commit 底下。
同時透過這種框架，開發者也可以自行開發屬於自己的 pre-commit hook並整合到該 yaml 檔案之中。整個使用的方式非常簡單
1. 透過 python 的方式安裝 git pre-commit
2. 準備一個名為 .pre-commit-config.yaml 的檔案，並且描述你希望使用的 hook
3. 透過 pre-commit install 的方式將該 yaml 的內容轉換為真正 git 所使用的內容
4. 可以開始透過 git commit 來幫助你進行本地檢查囉
如果對於提升本地開發效率有興趣的人，不要錯過研究看看 git pre-commit 這種機制，不論是直接撰寫 git 或是透過這種 python 的 git pre-commit 框架，只要能夠幫忙解決相關問題，提升效率就會是一個值得研究的方法。
更多的 hook 參考以及該框架介紹，請點選下列全文來觀賞囉
https://towardsdatascience.com/pre-commit-hooks-you-must-know-ff247f5feb7e
Fork 專案. 如果你想要參與一個你沒有推送權限的專案，你可以「fork」一份。這代表說GitHub 會複製 ... ... <看更多>
git clone <複製的網址> ：就可以將別人的GitHub repository 複製到自己的電腦裡。 ... 可以放一些網頁的作品或是專案介紹。 ... <看更多>
git複製專案 在 從伺服器上取得Repository - 為你自己學Git | 高見龍 - gitbook.tw 的推薦與評價
如果你在GitHub 上看到某個專案很有趣，想要下載回來看看，只要使用Clone 指令就可以把整個專案複製一份回來了。在GitHub 專案的頁面有一個「Clone or download」的 ... ... <看更多>