Build, mint, and send around your own ERC721 (NFT) on Mumbai (testnet) and then on Polygon/Matic mainnet!
Required: Node plus Yarn and Git
git clone https://github.com/Polygon-Academy/basicnfts
cd basicnfts
yarn install
First, be sure to check that you're deploying on mumbai
by changing the defaultNetwork
in packages/hardhat/hardhat.config.js
:
๐ We will need to generate a deployer account:
yarn generate
๐ This will create a new mnemonic and you can get this deployer address using the command:
yarn account
Go to https://faucet.matic.network to get some Mumbai-MATIC (testnet currency).
Confirm that your account has the funds needed for the rest of the tutorial: (check on https://mumbai.polygonscan.com)
Compile and deploy your NFT contract:
yarn deploy
To point the frontend at mumbai
we will also need to edit targetNetwork
in packages/react-app/src/App.jsx
:
Start the frontend with:
yarn start
๐ฑ Open http://localhost:3000 to see the app
โ๏ธ Edit the mint script mint.js in packages/hardhat/scripts and update the
toAddress
to your frontend address (wallet address in the top right or localhost:3000).
in a new terminal window run the mint script:
cd basicnfts
yarn mint
๐ You should see your collectibles show up on the frontend if you minted to the correct address:
๐ Open an incognito window and navigate to http://localhost:3000 (You'll notice it has a new wallet address).
๐ Send an NFT to the incognito window address:
๐ต๐ปโโ๏ธ Inspect the Debug Contracts
tab to figure out what address is the owner
of YourCollectible
?
๐ผ Edit your deployment script deploy.js
in packages/hardhat/scripts
๐ Edit your smart contract YourCollectible.sol
in packages/hardhat/contracts
๐ Edit your frontend App.jsx
in packages/react-app/src
โฌ๏ธ Installing a new package to your frontend? You need to cd packages/react-app
and then yarn add PACKAGE
๐ฐ Ready to deploy to MATIC mainnet?
Change the
defaultNetwork
inpackages/hardhat/hardhat.config.js
tomatic
๐ View your deployer address using yarn account
to ensure you have some Matic. (You can exchange for Matic tokens on UniSwap using the bridge: https://wallet.matic.network/bridge).
๐จโ๐ค Deploy your NFT smart contract:
yarn deploy
โ๏ธ Edit your frontend
App.jsx
inpackages/react-app/src
to change thetargetNetwork
toMatic
:
You should see the correct network in the frontend:
๐ซ Ready to mint a batch of "L2" NFTs for reals?
โ๏ธ Edit the mint script mint.js in packages/hardhat/scripts and update the
toAddress
to your MetaMask address (or other secure mainnet wallet).
yarn mint
Once minted, you should be able to see them in your Frontend.
Check out your contract on OpenSea's Matic viewer (Under "My Collections")
Feel free to also check your contract address on Polygonscan (extractible from the terminal where you deployed the contract).
โ๏ธ build and upload your frontend and share the url with your friends...
# build it:
yarn build
# upload it:
yarn surge
yarn s3
yarn ipfs
๐ฉโโค๏ธโ๐จ Share your public url with a friend and ask them for their address to send them a collectible :)
What happens if I run into a chainID error?
Under packages/hardhat/deployments
, make sure that your chainID for your desired chain to deploy to is correct. The chainID file is located under their respective chain folders. For Matic, the correct chainID is 134. For Mumbai, the correct chainID is 80001.
What happens if I run into a gas error?
This can be caused by many things. First check if you do have enough gas to deploy on your various networks. Then, try to raise the gasPrice
as shown below under packages/hardhat/hardhat.config.js
.
For a more in-depth explanation, documentation, quick start guide, tutorials, tips and many more resources, visit our documentation site: docs.scaffoldeth.io
Join the telegram support chat ๐ฌ to ask questions and find others building with ๐ scaffold-eth!