ブロックチェーンとゼロ知識証明で作るフルスタックサーバーレスアプリケーション

システム構成図

アプリの画面イメージ

動かす時の注意事項

パスワードを変える時はサーキットのコンパイルからやり直すこと！

動かし方

• インストール

  pnpm i

  • circuit側

    • コンパイル

      pnpm circuit run compile

    • Inputデータを生成する。

      pkgs/circuit/scripts/generateInput.js ファイルの7行目の部分は自分の設定したい好きなパスワードを指定すること

      const input = "serverless";

      設定したら以下のコマンドを実行

      pnpm circuit run generateInput

      生成された値のうち、 inputNumber と hash を pkgs/circuit/data/input.jsonに貼り付ける

    • verify 用の solidity ファイルなどを生成する

      pnpm circuit run executeGroth16

    • witness ファイルを生成する

      pnpm circuit run generateWitness

    • Proofの生成と検証のテスト

      pnpm circuit run test

    • verify 用の Solidity ファイルを backend フォルダ配下に移す

      pnpm circuit run cp:verifier

    • zk 用のファイルを backend と frontend フォルダ配下に移す

      pnpm circuit run cp:zk

  • backend側

    • 環境変数のセットアップ

      .envファイルを作成し、以下の値を設定する

      PRIVATE_KEY=""
      ALCHMEY_API_KEY=""
      BASESCAN_API_KEY=""

    • コンパイル

      pnpm backend run compile

    • テスト

      pnpm backend run test

    • スマートコントラクトのデプロイ

      もしすでにデプロイ済みであれば --reset オプションをつけて実行すること

      pnpm backend run deploy:ZKNFT --network base-sepolia

    • スマートコントラクトを verify

      pnpm backend run verify chain-84532 --include-unrelated-contracts

    • 総発行数を取得する

      pnpm backend run totalSupply --network base-sepolia

    • NFT をミントする

      pnpm backend run mint --network base-sepolia

  • frontend側

    • 環境変数のセットアップ

      .env.localファイルを作成し、以下の値を設定する

      # Privy Auth Settings
      NEXT_PUBLIC_PRIVY_APP_ID=
      
      # PASSWORD_HASH Settings
      PASSWORD_HASH=

    • ビルド

      pnpm frontend run build

    • フロントエンド起動

      pnpm frontend run dev

デプロイ済みのコントラクト情報

ZKNFT - baseSepolia

参考文献

• Rarible - Testnet
• GitHub - Biconomy Next.js サンプルリポジトリ