ノンジェネ第3回！勝手に略しましたw
今回は作成したジェネラティブ画像を「安心して保存できる場所」に移していきます
「安心して保存できる場所」とはIPFS（InterPlanetaryFileSystem）です
みんなで分散してデータを管理する仕組みなので、仮にどこかのPCがダウンしても他のPCから取得できるから安心！というわけです
そもそも画像ができてないよー！という方は前回の記事を参考にしてください
今回も引き続き、むなかた先生の記事（第3章）を元に進めてます↓
むなかた先生の記事： https://crypto-code.jp/materials/create-generative-nft
PintaからIPFSに画像をアップロード
IPFSに画像をアップするためにはPintaというサービスを使います
Pintaは1GBまで無料！
Pintaのアカウントを作成
まずは公式サイトにアクセスしてアカウントを作成します
Pinta公式サイト：https://www.pinata.cloud/
右上の「Start building」をクリック
Sing upのウィンドウにEmailを入力し「Creator」を選択、「Next」をクリック
登録したEmailに届いたコードを入力し「Verify code」をクリック
以上でアカウント作成完了です
画像をアップロード
ホーム画面右上の「Add Files」＞「Folder」を選択
開いたウィンドウで「Select」をクリック
前回作成したジャネラティブ画像が入った「images」フォルダを選択 ※注意：メタデータ（「json」フォルダ）はまだです。後ほどアップします
フォルダ名をつけて「Upload」をクリック。フォルダ名は後でアップするメタデータ（json）と見分けやすいように_imagesを最後につけます
アップロードが完了すると、ホーム画面にフォルダ名とContent Identifier(CID)が表示されます
これで画像のアップロードは終了！
このCIDをメタデータに記録することで、画像を表示できるようになります
メタデータに記録させるためCIDをコピーしておきます
PintaからIPFSにメタデータをアップロード
次はメタデータをIPFSにアップロードしますが、その前に下準備
先ほどコピーしたCIDをメタデータに記録させます
メタデータにCIDを記録
まずはVSCodeにもどり、config.jsを開きます
10行目のipfs://の後ろに先ほどコピーしたCIDをペースト。⌘ + S で保存します
続いてVSCodeのターミナルで下記のコマンドを実行します
node utils/update_info.jsこのコマンドを実行することで全てのメタデータに、先ほどのCIDをまとめて反映できます
実行前は赤枠部分が下記の状態でしたが……
実行後は、下記のようにCIDが反映されています！ｽｺﾞｲ
メタデータをアップロード
CIDを記録できたら、再びPinataに戻ります
画像をアップした時と同じ要領で「Add Files」＞「Folder」で開いたウィンドウの「Select」をクリックし、先ほどCIDを反映した「json」フォルダを選択
フォルダ名を設定し「Upload」をクリック。フォルダ名はmetadataと分かるようにしておきましょう
アップロードが完了すると、ホーム画面にフォルダ名とContent Identifier(CID)が表示されます
まとめ
以上でジェネラティブ画像を「安心して保存できる場所」へアップロード完了！
Pinataの画面が変わっていたので少し迷いましたが、特につまづくことありませんでした
次回はついに、ブロックチェーンにジェラティブ画像をのせちゃいます！
コメント