ブロックチェーンに 1 のような整数を書き込むだけのサンプルを見つけたので、動作手順をメモしておきます。
とりあえずスマートコントラクトを体験してみたい！という人におすすめです。
※MetaMaskをインストールしてない場合は下記記事を参考にインストールを完了してください
記事執筆時の環境
- Node.js v12.9.0
- Truffle v5.5.19
- MetaMask v10.17.0
Truffle
まずは Truffle をインストール。
$ npm install truffle
zshだと、インストール後に truffle を実行しても "zsh: command not found: truffle" になってしまう問題が発生することがある。その場合は このあたりを検索するといろいろと対処法が出てくる。
Truffleには、Dappを作るのに便利なボイラープレートがたくさん用意されている。
Truffle Boxes - Truffle Suite
今回はその中の「React Box」を使うことにする。（Reactの知識があることが望ましい）
適当なディレクトリを作り、React Boxをunboxする。
$ truffle unbox react
すると、次のようなディレクトリ構造が作られる。
truffle/contracts/SimpleStorage.sol が今回重要となるソースコードである。.sol という拡張子の通り、Solidityという言語で書かれている。
pragma solidity >=0.4.22 <0.9.0;
contract SimpleStorage {
uint256 value;
function read() public view returns (uint256) {
return value;
}
function write(uint256 newValue) public {
value = newValue;
}
}
Solidityに関する詳しい解説は省略するが、このSolidityでやっているのは下記の通りである。
SimpleStorage というコントラクトを定義value という uint256 型の状態変数を用意read() でvalue` の値を読み込むwrite() で value 型の値をブロックチェーンに書き込む
状態変数とは、コントラクトの永続ストレージにデータを格納するためのものである。つまり、この例では write() を実行するたびにデータを格納するトランザクションが発生し、同時にガス代も発生する。変数を書き換えるためにお金を払う必要があるというブロックチェーンの仕組みは最初驚くことであろう。
public や view 等のワードも重要な意味を持つので、ぜひ調べてみて欲しい。
deploy
コントラクトをdeployするには truffle migrate --network (NetworkName) コマンドを使う。このコマンドを実行すると内部的にコンパイルも行われる。コンパイルだけしたい場合は truffle compile コマンドを使うと良い。
deployの際は、予めネットワークの設定が必要になる。詳しくは下記記事を参照して欲しい。
Infuraを利用してTruffleからRinkebyに接続してみる - koogawa blog
ここではテストネットであるRinkebyにdeployすることにする。
$ truffle migrate --network rinkeby
deployが成功すると、コントラクトアドレスやガス代などがコンソールに出力される。このログから、スマートコントラクトをdeployするだけでもお金が必要ということがわかる。deployされたスマートコントラクトはetherscanのサイトから参照できる。
https://rinkeby.etherscan.io/address/0x74c7382e11311530757bedb953d7f302cfaef417
実行
deployまでできたので、次はWebブラウザからコントラクトを実行してみる。client ディレクトリに移動して次のコマンドを入力し、Webサーバを起動しよう。
$ npm run start
自動的にブラウザが立ち上がり、localhost:3000 が表示される。
ためしに「write()」ボタンに適当な整数を入力し、マウスでクリックするとMetaMaskが起動する。
ガス代を確認し「確認」をクリックするとトランザクションが開始し、しばらくするとトランザクションが完了した通知が送られてくる。
これで SimpleStorage の value 、すなわちブロックチェーンにデータを書き込むことができたわけである🎉 「read()」をクリックすると、value が書き換わっていることが確認できるはずだ。
フロントエンドからどのようにスマートコントラクトを実行したのか、については client/src 以下をじっくり読んで、ところどころ書き換えてみると理解が深まると思う。
ガス代
今回はテストネットを利用したのでガス代を気にする必要はなかった。しかし、メインネットにコントラクトをdeployする場合はそれなりのEtherが必要になるの。じっくり開発環境でテストを実施してからdeployすることをおすすめする。
