lesson-1_ローカル環境でイ ーサリアムネットワークを立ち上げよう
📚 ブロックチェーン入門
さて、まずローカル環境のイーサリアムネットワークを用意する必要があります。
Webアプリで作業するには、ローカル環境をどのように起動する必要があるでしょうか?
今のところ、知っておく必要があるのは、スマートコントラクトはブロックチェーン上に存在するコードの一部であるということだけです。
ブロックチェーンは、誰でも安全にデータを有料で読み書きできる公共の場所です。
誰も実際に所有していないことを除けば、AWSのようなものだと考えてください。
ブロックチェーンは「マイナー」として知られている何千人もの匿名の人々によって運営されています。
ここでの全体像は次のとおりです。
-
スマートコントラクトを作成します。 そのコントラクトには、ドメインに関するすべてのロジックが含まれています。
-
これから作るスマートコントラクトはブロックチェーン上にデプロイされます。
- 世界中の誰もがあなたのスマートコントラクトにアクセスしてドメインをミントすることができるようになります。
- ドメインを簡単に作成できる Web サイトを構築します。
まず 、
node
/yarn
を取得する必要があります。お持ちでない場合は、こちらにアクセスしてください。
node v16
をインストールすることを推奨しています。
🍽 Git リポジトリをあなたの GitHub にフォークする
まだGitHubのアカウントをお持ちでない方は、こちら の手順に沿ってアカウントを作成してください。
GitHubのアカウントをお持ちの方は、下記の手順に沿ってプロジェクトの基盤となるリポジトリをあなたのGitHubにフォークしましょう。
- こちらからunchain-tech/Polygon-ENS-Domainリポジトリにアクセスをして、ページ右上の
Fork
ボタンをクリックします。
- Create a new forkページが開くので、「Copy the
main
branch only」という項目にチェックが入っていることを確認します。
設定が完了したらCreate fork
ボタンをクリックします。あなたのGitHubアカウントにPolygon-ENS-Domain
リポジトリのフォークが作成されたことを確認してください。
それでは、フォークしたリポジトリをローカル環境にクローンしましょう。
まず、下図のように、Code
ボタンをクリックしてSSH
を選択し、Gitリンクをコピーしましょう。
ターミナル上で作業を行う任意のディレクトリに移動し、先ほどコピーしたリンクを用いて下記を実行してください。
git clone コピーした_github_リンク
無事に複製されたらローカル開発環境の準備は完了です。
🔍 フォルダ構成を確認する
実装に入る前に、フォルダ構成を確認しておきましょう。クローンしたスタータープロジェクトは下記のようになっているはずです。
Polygon-ENS-Domain
├── .git/
├── .gitignore
├── LICENSE
├── README.md
├── package.json
├── packages/
│ ├── client/
│ └── contract/
└── yarn.lock
スタータープロジェクトは、モノレポ構成となっています。モノレポとは、コントラクトとクライアント(またはその他構成要素)の全コードをまとめて1つのリポジトリで管理する方法です。
packagesディレクトリの中には、client
とcontract
という2つのディレクトリがあります。
package.json
ファイルの内容を確認してみましょう。
モノレポを作成するにあたり、パッケージマネージャーの機能であるWorkspacesを利用しています。
workspacesの定義をしている部分は以下になります。
"workspaces": {
"packages": [
"packages/*"
]
},
この機能により、yarn installを一度だけ実行すれば、すべてのパッケージ(今回はコントラクトのパッケージとクライアントのパッケージ)を一度にインストールできるようになります。
📺 フロントエンドの動きを確認する
次に、下記を実行してみましょう。
yarn client start
あなたのローカル環境で、Webサイトのフロントエンドが立ち上がりましたか?
例)ローカル環境で表示されているWebサイト
上記のような形でフロントエンドが確認できれば成功です。
これからフロントエンドの表示を確認したい時は、ターミナルに向かい、Polygon-ENS-Domain
ディレクトリ上で、yarn client start
を実行します。これからも必要となる作業ですので、よく覚えておいてください。
ターミナルを閉じるときは、以下のコマンドが使えます ✍️
- Mac:
ctrl + c
- Windows:
ctrl + shift + w
👏 コントラクトを作成する準備をする
本プロジェクトではコントラクトを作成する際にHardhat
というフレームワークを使用します。
packages/contract
ディレクトリにいることを確認し、次のコマンドを実行します。
npx hardhat init
hardhat
がターミナル上で立ち上がったら、それぞれの質問を以下のように答えていきます。
・What do you want to do? →「Create a JavaScript project」を選択
・Hardhat project root: →「'Enter'を押す」 (自動で現在いるディレクトリが設定されます。)
・Do you want to add a .gitignore? (Y/n) → 「y」
(例)
$ npx hardhat init
888 888 888 888 888
888 888 888 888 888
888 888 888 888 888
8888888888 8888b. 888d888 .d88888 88888b. 8888b. 888888
888 888 "88b 888P" d88" 888 888 "88b "88b 888
888 888 .d888888 888 888 888 888 888 .d888888 888
888 888 888 888 888 Y88b 888 888 888 888 888 Y88b.
888 888 "Y888888 888 "Y88888 888 888 "Y888888 "Y888
👷 Welcome to Hardhat v2.13.0 👷
✔ What do you want to do? · Create a JavaScript project
✔ Hardhat project root: · /Polygon-ENS-Domain/packages/contract
✔ Do you want to add a .gitignore? (Y/n) · y
✨ Project created ✨
See the README.md file for some example tasks you can run
Give Hardhat a star on Github if you're enjoying it! 💞✨
https://github.com/NomicFoundation/hardhat
⚠️: 注意
Windows で Git Bash を使用してハードハットをインストールしている場合、このステップ (HH1) でエラーが発生する可能性があります。問題が発生した場合は、WindowsCMD(コマンドプロンプト)を使用して HardHat のインストールを実行してみてください。
この段階で、フォルダー構造は下記のようになっていることを確認してください。
Polygon-ENS-Domain
├── .gitignore
├── package.json
└── packages/
├── client/
└── contract/
+ ├── .gitignore
+ ├── README.md
+ ├── contracts/
+ ├── hardhat.config.js
+ ├── package.json
+ ├── scripts/
+ └── test/
次に、安全なスマートコントラクトを開発するために使用されるライブラリ OpenZeppelin を追加します。
packages/contract
ディレクトリにいることを確認し、以下のコマンドを実行してください。
yarn add @openzeppelin/contracts@^4.8.2
OpenZeppelin はイーサリアムネットワーク上で安全なスマートコントラクトを実装するためのフレームワークです。
OpenZeppelinには非常に多くの機能が実装されておりインポートするだけで安全にその機能を使うことができます。
それでは、packages/contract
ディレクトリ内のpackage.json
ファイルを更新しましょう。下記のように"private": true,
の下に"scripts":{...}
を追加してください。よく利用するコマンドを設定しておきます。
{
"name": "contract",
"version": "1.0.0",
"private": true,
"scripts": {
"run:script":"npx hardhat run scripts/run.js",
"deploy": "npx hardhat run scripts/deploy.js --network amoy",
"test": "npx hardhat test"
},
"devDependencies": {
⭐️ 実行する
すべてが機能していることを確認するには、以下を実行します。
yarn test
次のように表示されます。
Lock
Deployment
✔ Should set the right unlockTime (2737ms)
✔ Should set the right owner
✔ Should receive and store the funds to lock
✔ Should fail if the unlockTime is not in the future (44ms)
Withdrawals
Validations
✔ Should revert with the right error if called too soon
✔ Should revert with the right error if called from another account (44ms)
✔ Shouldn't fail if the unlockTime has arrived and the owner calls it (48ms)
Events
✔ Should emit an event on withdrawals (71ms)
Transfers
✔ Should transfer the funds to the owner (93ms)
9 passing (3s)
ターミナル上でls
と入力してみて、下記のフォルダーとファイルが表示されていたら成功です。
README.md cache hardhat.config.js package.json test
artifacts contracts node_modules scripts
ここまできたら、フォルダーの中身を整理しましょう。
まず、test
の下のファイルLock.js
を削除します。
-
test
フォルダーに移動:cd test
-
Lock.js
を削除:rm Lock.js
次に、上記の手順を参考にしてcontracts
の下のLock.sol
を削除してください。実際のフォルダは削除しないように注意しましょう。
☀️ Hardhat の機能について
Hardhatは段階的に下記を実行しています。
1. Hardhat は、スマートコントラクトを Solidity からバイトコードにコンパイルしています。
- バイトコ ードとは、コンピュータが読み取れるコードの形式のことです。
2. Hardhat は、あなたのコンピュータ上でテスト用の「ローカルイーサリアムネットワーク」を起動しています。
3. Hardhat は、コンパイルされたスマートコントラクトをローカルイーサリアムネットワークに「デプロイ」します。
🙋♂️ 質問する
ここまでの作業で何かわからないことがある場合は、Discordの#polygon
で質問をしてください。
ヘルプをするときのフローが円滑になるので、エラーレポートには下記の3点を記載してください ✨
1. 質問が関連しているセクション番号とレッスン番号
2. 何をしようとしていたか
3. エラー文をコピー&ペースト
4. エラー画面のスクリーンショット
以上の環境設定が完了したら、次のレッスンに進んでください 🎉