lesson-2_Vercelを使ってアプリをデプロイしよう
🙉 GitHub に 関する注意点
GitHub にコントラクト(contract
)のコードをアップロードする際は、秘密鍵を含むハードハット構成ファイルをリポジトリにアップロードしないよう注意しましょう。
秘密鍵などの ファイルを隠すためにdotenv
というパッケージを追加します。ターミナル上で、プロジェクトのルートから下記を実行してください。
yarn workspace contract add dotenv@^16.3.1
dotenv
モジュールに関する詳しい説明は、こちらを参照してください。
dotenv
をインストールしたら、.env
ファイルを更新します。
ファイルの先頭に.
がついているファイルは、「不可視ファイル」です。
.
がついているファイルやフォルダはその名の通り、見ることができないので、「隠しファイル」「隠しフォルダ」とも呼ばれます。
操作されては困るファイルについては、このように「不可視」の属性を持たせて、一般の人が触 れられないようにします。
ターミナル上でpackages/contract
ディレクトリにいることを確認し、下記を実行しましょう。VS Codeから.env
ファイルを開きます。
code .env
そして、.env
ファイルを下記のように更新します。
PRIVATE_KEY = hardhat.config.jsにある秘密鍵(accounts)を貼り付ける
STAGING_ALCHEMY_KEY = hardhat.config.js内にあるAlchemyのURLを貼り付ける
PROD_ALCHEMY_KEY = イーサリアムメインネットにデプロイする際に使用するAlchemyのURLを貼り付ける(今は何も貼り付ける必要はありません)
私の.env
は、下記のようになります。
PRIVATE_KEY=0x...
STAGING_ALCHEMY_KEY=https://...
.env
を更新したら、 hardhat.config.js
ファイルを次のように更新してください。
require("@nomicfoundation/hardhat-toolbox");
require("dotenv").config();
module.exports = {
solidity: "0.8.17",
networks: {
sepolia: {
url: process.env.STAGING_ALCHEMY_KEY,
accounts: [process.env.PRIVATE_KEY],
},
},
};
最後に .gitignore
に.env
が含まれていることを確認しましょう。
cat .gitignore
をターミナル上で実行します。
下記のような結果が表示されていれば成功です。
node_modules
.env
coverage
coverage.json
typechain
typechain-types
#Hardhat files
cache
artifacts
これで、GitHubにあなたの秘密鍵をアップロードせずに、GitHubにコントラクトのコードをアップロードできます。
🔮 プロジェクトを拡張する
このプロジェクトで学んだことは、web3への旅の始まりに過ぎません。
NFTとスマートコントラクトできることはたくさんあります。
あなたのプロジェクトに拡張性を与えるインサイトをいくつか共有します。
🧞♂️: NFT を販売する
-
NFTをユーザーがMintする際に、あなたにETHを支払うしくみを実装しましょう。
-
コントラクトに
payable
を追加したり、require
を使用すれば、ユーザーがNFTを購入する際の最小金額を設定できます。
🍁: ロイヤリティを追加する
-
スマートコントラクトにロイヤリティを追加して、NFTが転売されるごとに、あなたに、一定の資金が振り込まれるしくみを作りましょう。
-
詳細については、こちらをご覧ください: EIP-2981:NFT Royally Standard
🤟 Vercel に Web アプリケーションをデプロイする
最後に、Vercel にWebアプリケーションをホストする方法を学びます。
Vercelはサーバーレス機能のホスティングを提供するクラウドプラットフォームです。
スケーリングやサーバーの監視はVercelが行うため、開発者はVercelへデプロイするだけでアプリケーションを公開・運用できます。
Vercelに関する詳しい説明は、こちらをご覧ください。
まず、GitHubのETH-NFT-Maker
にローカルファイルをアップロードしていきます。
ターミナル上でETH-NFT-Maker
に移動して、下記を実行しましょう。
git add .
git commit -m "upload to github"
git push