lesson-1_開発環境を用意しよう
✅ 環境構築を行う
このプロジェクトの全体像は次のとおりです。
1 . スマートコントラクトを作成します。
- ユーザーがトークンをスマートコントラクト上で交換するためのAMMロジックを実装します。
- 開発は
Ethereum
のローカルチェーンを利用して作成します。
2 . スマートコントラクトをブロックチェーン上にデプロイします。
- スマートコントラクトを
Avalanche
のFuji C-Chain
へデプロイします。 - 世界中の誰もがあなたのスマートコントラクトにアクセスできます。
- ブロックチェーンは、サーバーの役割を果たします。
3 . Web アプリケーション(dApp)を構築します。
- ユーザーはWebサイトを介して、ブロックチェーン上に展開されているあなたのスマートコントラクトと簡単にやりとりできます。
- スマートコントラクトの実装 + フロントエンドユーザー・インタフェースの作成 👉 dAppの完成を目指しましょう 🎉
まず、node
/ yarn
を取得する必要があります。
お持ちでない場合は、下記のリンクにアクセスをしてインストールしてください。
node v16
をインストールすることを推奨しています。
それでは本プロジェクトで 使用するフォルダーを作成してきましょう。作業を始めるディレクトリに移動したら、次のコマンドを実行します。
mkdir AVAX-AMM
cd AVAX-AMM
yarn init --private -y
AVAX-AMMディレクトリ内に、package.jsonファイルが生成されます。
AVAX-AMM
└── package.json
それでは、package.json
ファイルを以下のように更新してください。
{
"name": "AVAX-AMM",
"version": "1.0.0",
"description": "AMM dApp",
"private": true,
"workspaces": {
"packages": ["packages/*"]
},
"scripts": {
"contract": "yarn workspace contract",
"client": "yarn workspace client",
"test": "yarn contract test"
}
}
package.json
ファイルの内容を確認してみましょう。
モノレポを作成するにあたり、パッケージマネージャーの機能であるWorkspacesを利用しています。
この機能により、yarn installを一度だけ実行すれば、すべてのパッケージ(今回はコントラクトのパッケージとクライアントのパッケージ)を一度にインストールできるようになります。
workspacesの定義をしている部分は以下になります。
"workspaces": {
"packages": [
"packages/*"
]
},
また、ワークスペース内の各パッケージにアクセスするためのコマンドを以下の部分で定義しています。
"scripts": {
"contract": "yarn workspace contract",
"client": "yarn workspace client",
"test": "yarn contract test"
}
これにより、各パッケージのディレクトリへ階層を移動しなくてもプロジェクトのルート直下から以下のようにコマンドを実行することが可能となります(ただし、各パッケージ内にpackage.json
ファイルが存在し、その中にコマンドが定義されていないと実行できません。そのため、現在は実行してもエラーとなります。ファイルは後ほど作成します)。
yarn <パッケージ名> <実行したいコマンド>
次に、TypeScriptの設定ファイルtsconfig.json
を作成しましょう。今回のプロジェクトは、contractとclientどちらもTypeScriptを使用するため、それぞれのパッケージにtsconfig.jsonが存在します。そのため、ルートディレクトリにもtsconfig.jsonを配置することでパッケージ間で共通したい設定を記述することができます。
それでは、AVAX-AMMディレクトリ直下にいることを確認し、下記のコマンドを実行しましょう。
tsc --init
tsconfig.json
ファイルが生成されたことを確認してください。設定はデフォルトのままにしておきます。
それでは、ワークスペースのパッケージを格納するディレクトリを作成しましょう。
以下のようなフォルダー構成となるように、packages
ディレクトリとその中にcontract
ディレクトリを作成してください(client
ディレクトリは、後ほどのレッスンでフロントエンド構築の際に作成したいと思います)。
AVAX-AMM
├── package.json
+├── packages/
+│ └── contract/
└── tsconfig.json
contract
ディレクトリには、スマートコントラクトを構築するためのファイルを作成していきます。
最後に、AVAX-AMMディレクトリ下に.gitignore
ファイルを作成して以下の内容を書き込みます。
**/yarn-error.log*
# dependencies
**/node_modules
# misc
**/.DS_Store
最終的に以下のようなフォルダー構成となっていることを確認してください。
AVAX-AMM
├── .gitignore
├── package.json
├── packages/
│ └── contract/
└── tsconfig.json
これでモノレポの雛形が完成しました!
✨ Hardhat をインストールする
スマートコントラクトをすばやくコンパイルし、ローカル環境にてテストを行うために、Hardhat というツールを使用します。
-
Hardhatにより、ローカル環境でイーサリアムネットワークを簡単に起動し、テストネットでイーサリアムを利用できます。
-
「サーバー」がブロックチェーンであることを除けば、Hardhatはローカルサーバーと同じです。
それでは、先ほど作成したpackages/contract
ディレクトリ内にファイルを作成します。ターミナルに向かい、packages/contract`ディレクトリ内で以下のコマンドを実行します。
cd packages/contract
yarn init --private -y
# Hardhatのインストール
yarn add --dev hardhat@^2.11.2
# スマートコントラクトの開発に必要なプラグインのインストール
yarn add --dev @nomicfoundation/hardhat-network-helpers@^1.0.0 @nomicfoundation/hardhat-chai-matchers@^1.0.0 @nomicfoundation/hardhat-toolbox@^2.0.0 @nomiclabs/hardhat-ethers@^2.0.0 @nomiclabs/hardhat-etherscan@^3.0.0 @types/chai@^4.2.0 @types/mocha@>=9.1.0 @typechain/ethers-v5@^10.1.0 @typechain/hardhat@^6.1.2 hardhat-gas-reporter@^1.0.8 solidity-coverage@^0.8.1 ts-node@^10.9.1 typechain@^8.1.0
yarn add dotenv@^16.0.2 @openzeppelin/contracts@^4.7.3
以下は主要なパッケージの説明です。
hardhat
:solidity
を使った開発をサポートします。@openzeppelin/test-helpers
: テストを支援するライブラリです。コントラクトのテストを書く際に利用します。dotenv
: 環境変数の設定で必要になります。コントラクトをデプロイする際に利用します。@openzeppelin/contracts
: openzeppelinが提供するコードを使用します。イーサリアムネットワーク上で安全なスマートコントラクトを実装するためのフレームワークです。OpenZeppelinには非常に多くの機能が実装されておりインポートするだけで安全にその機能を使うことができます。
✍️:
warning
について Hardhat をインストールすると、脆弱性に関するメッセージが表示される場合があります。基本的に
warning
は無視して問題ありません。YARN から何かをインストールするたびに、インストールしているライブラリに脆弱性が報告されているかどうかを確認するためにセキュリティチェックが行われます。
👏 サンプルプロジェクトを開始する
次に、Hardhatを実行します。
packages/contract
ディレクトリにいることを確認し、次のコマンドを実行します。
npx hardhat init
hardhat
がターミナル上で立ち上がったら、それぞれの質問を以下のように答えていきます。
・What do you want to do? →「Create a TypeScript project」を選択
・Hardhat project root: →「'Enter'を押す」 (自動で現在いるディレクトリが設定されます。)
・Do you want to add a .gitignore? (Y/n) → 「y」
・Do you want to install this sample project's dependencies with npm (hardhat @nomicfoundation/hardhat-toolbox)? (Y/n) → 「n」
(例)
$ 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 TypeScript project
✔ Hardhat project root: · /任意のディレクトリ/AVAX-AMM/packages/contract
✔ Do you want to add a .gitignore? (Y/n) · y
✔ Do you want to install this sample project's dependencies with npm (hardhat @nomicfoundation/hardhat-toolbox)? (Y/n) · n
You need to install these dependencies to run the sample project:
npm install --save-dev "hardhat@^2.12.6" "@nomicfoundation/hardhat-toolbox@^2.0.0"
✨ 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
⚠️: 注意 #1
Windows で Git Bash を使用してハードハットをインストールしている場合、このステップ (HH1) でエラーが発生する可能性があります。問題が発生した場合は、WindowsCMD(コマンドプロンプト)を使用して HardHat のインストールを実行してみ てください。
この段階で、フォルダー構造は下記のようになっていることを確認してください。
AVAX-AMM
├── .gitignore
├── package.json
├── packages/
│ └── contract/
+│ ├── .gitignore
+│ ├── README.md
+│ ├── contracts/
+│ ├── hardhat.config.ts
+│ ├── package.json
+│ ├── scripts/
+│ ├── test/
+│ └── tsconfig.json
└── tsconfig.json
それでは、contract
ディレクトリ内に生成されたpackage.json
ファイルを以下を参考に更新をしましょう。
{
"name": "contract",
"version": "1.0.0",
- "main": "index.js",
- "license": "MIT",
"private": true,
"devDependencies": {
"@nomicfoundation/hardhat-chai-matchers": "^1.0.0",
"@nomicfoundation/hardhat-network-helpers": "^1.0.0",
"@nomicfoundation/hardhat-toolbox": "^2.0.0",
"@nomiclabs/hardhat-ethers": "^2.0.0",
"@nomiclabs/hardhat-etherscan": "^3.0.0",
"@typechain/ethers-v5": "^10.1.0",
"@typechain/hardhat": "^6.1.2",
"@types/chai": "^4.2.0",
"@types/mocha": ">=9.1.0",
"hardhat": "^2.11.2",
"hardhat-gas-reporter": "^1.0.8",
"solidity-coverage": "^0.8.1",
"ts-node": "^10.9.1",
"typechain": "^8.1.0"
},
"dependencies": {
"@openzeppelin/contracts": "^4.7.3",
"dotenv": "^16.0.2"
},
+ "scripts": {
+ "deploy": "npx hardhat run scripts/deploy.ts --network fuji",
+ "cp": "yarn cp:typechain && yarn cp:artifact",
+ "cp:typechain": "cp -r typechain-types ../client/",
+ "cp:artifact": "cp artifacts/contracts/ERC20Tokens.sol/USDCToken.json artifacts/contracts/ERC20Tokens.sol/JOEToken.json artifacts/contracts/AMM.sol/AMM.json ../client/utils/",
+ "test": "npx hardhat test"
+ },
}