ノンジェネ第4回!先に行っておきます……今回の記事は長いです….w
前回アップロードした画像とメタデータをNFT化します
今回使うのは、Remixというブラウザ上でNFT化(デプロイ)を簡単にできるサービス
まだ画像やメタデータアップロードができてないよー!という方は前回の記事を参考にしてください
![](https://jiyuta.com/wp-content/uploads/2023/02/230224generative3-320x180.png)
今回も引き続き、むなかた先生の記事(第4章)を元に進めてます↓
むなかた先生の記事: https://crypto-code.jp/materials/create-generative-nft
Visual Studio Code(VSCode)でソースコードをコピー
ノンジェネ「環境構築編」でダウンロードした「hashlips_nft_contract-1.0.1」をVSCodeで開きます
「contract」>「SimpleNft _flat.sol」を選択し、中身をすべてコピー
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative00-1024x590.jpg)
Remixにソースコードをペースト
下記のRemix公式ページに移動します
Remix公式ページ:https://remix.ethereum.org/
ワークスペースを作成
「WORKSPACES」の右の「+」をクリック、Workspace nameを任意で記入し「OK」をクリック
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative01-1024x382.png)
不要なファイルを削除
「contracts」内の3ファイルを選択して、右クリックし「Delete All」
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative02.png)
新規ファイルを作成し、ソースコードをペースト
次に「contracts」上で右クリック。「New File」で新規ファイルを作成し、任意の名前をつけます
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative03.png)
作成したファイルに、VSCodeでコピーしたソースコードをペースト
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative04-1024x456.png)
Remixでソースコードをカスタマイズ
先ほどペーストしたソースコードを変更します
変更箇所は1235行あたりにあります。「NFTの名前」「値段」「発行総数」「一度にミントできる最大数」「ミントできない状態か?」「リビールされているか?」の6ヶ所です
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative05-1024x486.png)
今回は「NFTの名前」をTestCollection、「価格」を0.001ETH、「発行総数」を20点、「一度にミントできる最大数」2点という設定にします
「ミントできない状態か?」は「false」がミントできる状態なので、リリース前は「true」にします
「リビールされているか?」は後からリビールさせたい場合は「false」にします。今回はリビールなしの「true」で行きます
以下がカスタマイズ後です
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative06.png)
【任意】HashLipsへの自動寄付設定を削除
1344行あたりに、任意ですが修正する箇所があります
こちらのソースコードは提供しているHashLipsに売上の5%を自動で送る設定です
HashLipsを応援したい方はそのままでOKですが、寄付したくない方は// This will …から…contract balance.までの8行を削除します
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative07.png)
以下のようになります
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative08.png)
Remixでコンパイル
カスタマイズが終わったらコンパイルします
コンパイルとは、人間語で書かれたソースコードを機械語にする作業です
難しそうに聞こえますが、Rimixを使えば簡単にできます
まずは左側のアイコンの上から3番目を選択。「COMPILER」のバージョンが指定範囲内にあるか確認します
指定範囲は先ほどカスタマイズしたソースコードの1233行目あたりにあります
pragma solidity >=0.7.0 <0.9.0;
0.7.0以上0.9.0未満ならOKということです
「Advanced Configurations」の中の「Enable optimization」にチェックを入れ「Compile 〈任意のソースコードファイル名〉」をクリック
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative09.png)
左側のアイコンにチェックマークがつき、「CONTRACT」欄が追加されれば無事完了です
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative10.png)
Remixでデプロイ
デプロイとはコンパイルしたソースコードを、ブロックチェーン上に載せる作業です
こちらもRimixが簡単にしてくれてます
MetaMaskをテストネットワークに変更
MetaMaskでGoerliネットワークを選択しておく
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative11.png)
Goerliネットワークを使います。Goerliで使う方法やテスト用ETHをもらう方法は下記を参考にしてください
![](https://jiyuta.com/wp-content/uploads/2023/02/230205_goerli_eth-160x90.png)
Rimixでデプロイ設定
左側のアイコンの上から4番目を選択
ENVIRONMENTで「Injected Provider – MetaMask」を選択。MetaMaskが起動するので「接続」をクリック
「Goerli (5) network」と表示されていればOKです。ACCOUNT欄には自分のウォレットアドレスが表示されます
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative12.png)
CONTRACT(compile by Remix)欄で「〈任意のNFT名〉 – contracts/〈任意のソースコード名〉」を選択(自分の場合は「TestCollection – contracts/TestCollection.sol」)
次に、Deploy欄の右側にある「∨」をクリック
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative13.png)
展開された欄に情報追加します
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative14.png)
上から「NFTの名前」「略称」「メタデータ参照先」「リビール前のメタデータ参照先」です
「メタデータ参照先」は以前メタデータをアップしたPinataからメタデータのCIDコピーします
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative17-1024x247.png)
記載のしかたは「ipfs://〈メタデータのCID〉/」です ※注意:最後は「/」が必要!
今回はリビールはしないので「リビール前のメタデータ参照先」は「test」と記入
全て記入したら「transact」をクリック。MetaMaskが起動するのでガス代を確認して「確認」をクリックしデプロイ完了
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative15.png)
Remixでデプロイしたソースコードを確認&実行
デプロイが終わると、一番下にNFT名のメニューが追加されます
こちらをクリックするとズラッとボタンが出てきます
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative16.png)
青ボタンは設定内容の確認なので、ガス代はかかりません
設定通りの内容が表示されています
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative18.png)
オレンジや赤ボタンはソース変更や実行なので、ガス代がかかります
試しにpauseを「false」に変更し、ミントできる状態にします
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative19.png)
ガス代が表示されるので「確認」をクリック
次にmintに「2」と記入して実行
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative20.png)
こちらもガス代が表示されるので「確認」をクリック
Open Seaで確認……無事ミントできました!
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative21.png)
pauseやmintを実行する際にMetaMaskがクルクルと回転したままになってしまいました
エラーかと思いましたが、EtherscanやOpenSeaを見ると実行結果が反映されていたので問題ないようです
数分間待ってクルクルしているようであれば、実行結果をEtherscanやOpenSeaで確認してみましょう
Etherscan(Goerli Testnet) : https://goerli.etherscan.io/
OpenSea(testnet) : https://testnets.opensea.io/ja
Etherscanでソースコードを変更できるようにする
Rimixは一度閉じてしまうと、デプロイしたソースコードを変更できなくなります(できるかもですが、知らない…)
そのため、後からEtherscanで変更をできるようにしておきます。Verifyというらしい……
Etherscanでコントラクトアドレスを探す
まずはRimixでコントラクトアドレスをコピー
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative22.png)
Ethscanページ(Goerli)の検索窓にペーストして検索
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative23.png)
EtherscanでVerify
表示されたページの「Contract」ボタンを押し、「Verify and Publish」のテキストリンクをクリック
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative26.png)
続いて下記の画像内容を選択。2つ目は、コンパイルした時のバージョンを指定します
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative27-1024x666.png)
次ページでは下記の画像のように記入。Rimixからソースコードと入力フィールド情報をコピぺする必要があります
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative28.png)
ソースコードは下記からコピーできます
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative24-1024x372.png)
入力フィールド情報のコピー方法の手順は2つあります
まずは以下の「Calldata」をコピー
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative25.png)
コピーした内容をテキストエディターなどにペーストし、赤枠の箇所(0が連続し始めた箇所)のみをコピー
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative25-3-1024x337.png)
最後に「Verify and Publish」をクリックし、赤線の「Successfully….」と表示されれば、完了です
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/02/230227generative29.png)
Etherscanでソースコードを変更してみる
ミントをできない状態に変更してみます
現状の設定を確認
元の画面に戻り「Contract」>「Read Contract」>「12 paused」を確認
「false」になっているので、ミントできる状態です
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/03/230301jenarative00.png)
コントラクトを書き換える
今度は「Contract」>「Write Contract」を選択し「Connect to Web3」をクリック
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/03/230301jenarative01.png)
MetaMaskが立ち上がりので、Goerilテストネットワークになっているのを確認して「接続」
「Connected」に変わります
「3 pause」を展開し、「true」と打って「Write」をクリック
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/03/230301jenarative02.png)
MetaMaskが立ち上がるので、ガス代を確認して実行
変更を確認
再び「Read Contract」でに移動
右側の「Reset」をクリックし「12 paused」を展開
「True」に変更されていれば成功です
![ノンエンジニアがジェネラティブforMac](https://jiyuta.com/wp-content/uploads/2023/03/230301jenarative03.png)
これでミントできない状態になりました
戻したい場合は「Write Contract」の「3 pause」に「false」と打って「Write」します
まとめ
以上でNFT化完了です
むなかたさんの記事では「Rinkbeyテストネットワーク」を使用していましたが、今は使えなくなっていたので「Goerilテストネットワーク」を使用しています
次回がいよいよラスト!ユーザーがミントしやすいようにするため、ミントサイトを作ります!
コメント