next.js 以及hardhat 创建一个nft项目

参考官网：https://nextjs.org/learn/basics/create-nextjs-app/setup
涉及软件：

软件	版本	官网链接
ethers	6.4.0	https://docs.ethers.org/v6/
hardhat	2.19.4	https://hardhat.org/tutorial/creating-a-new-hardhat-project
react		https://react.docschina.org/learn/start-a-new-react-project
matrial UI		https://mui.com/material-ui/getting-started/installation/

hardhat常用命令：

npx hardhat help
npx hardhat test
npx hardhat node
npx hardhat run script/deploy.js
npx hardhat complile

创建next.js

npx create-next-app@latest nextjs-blog --use-npm --example "https://github.com/vercel/next-learn/tree/main/basics/learn-starter"

在next.js基础上 ，添加 hardhat

npx hardhat init

运行该命令，最后会提示你下一步npm安装命令，如：

 npm install --save-dev "hardhat@^2.17.4" "@nomicfoundation/hardhat-toolbox@^3.0.0"

启动项目：

npm run dev

遇到问题：

• 问题一： rying to send a raw transaction with an invalid chainId. The expected chainId is 31337
  解决办法：参考官网：https://hardhat.org/hardhat-network/docs/metamask-issue
  在hardhat.config.js中配置如下：

networks: {
  hardhat: {
    chainId: 1337,
    blockConfirmations: 1,  //这句必须加上，不然deploy 合约部成功， 提示Hardhat was set to use chain id 1337, but connected to a chain with id 31337.
  },
}

然后清楚缓存

npx hardhat clean

后运行:

npx hardhat node

再启动另外一个命令窗口，先compile，后run部署合约到 刚启动的node上,得到合约的地址。

npx hardhat compile
npx hardhat run ./scripts/deploy.js --network localhost

部署截图

安装material UI

npm install @mui/material @emotion/react @emotion/styled
npm install @emotion/react 
npm install @emotion/styled

安装 ethers 6

 npm install ethers

代码地址：https://gitee.com/rasen/learning/tree/master/hardhat