How to Build a Full Stack NFT Marketplace on Ethereum with Polygon and Next.js – [2021 Tutorial]
🚨 Update – Be sure to install ipfs-http-client@50.1.2 instead of ipfs-http-client for this to work properly
🙂 Subscribe to my channel:
🔵 Follow me on Twitter:
🔗 Step by step article:
🔗 Source code
In this video, you’ll learn how to build a full stack NFT marketplace on Ethereum with Solidity, Polygon, IPFS, Next.js, Ethers.js, and Hardhat.
We’ll start from scratch, creating a new project and installing the dependencies. We’ll then write and test out the smart contracts. Once the tests have passed, we’ll write the front end code to connect the smart contracts.
After testing on a local network, we’ll deploy to the Matic / Polygon network using a custom RPC provider (Infura).
0:00 – Introduction
3:00 – Project initialization and configuration
17:40 – Creating an Ethereum wallet
21:20 – Coding the NFT smart contract
28:19 – Coding the Market smart contract
58:50 – Testing the contracts
1:10:57 – Updating _app.js
1:14:35 – Updating the home page
1:35:24 – Deploying to a local node
1:39:47 – Coding the create-item page
1:58:00 – Coding the my-assets page
2:03:10 – Coding the creator-dashboard page
2:09:25 – Deploying to Matic Mumbai Testnet
2:20:40 – Conclusion
source
Nader single handily changing my life with his content.
Shouldn't the smart contracts comply with ERC standards
What vscode theme are you using? I could not find it
Which editor are you using
Hey, I've got a question that I can't seem to find an answer to. Why would I use Counters library instead of having a simple uint256 private field and use that as a counter instead? I can do uint256 itemId = ++counter; instead of doint counter.increment(); uint256 itemId = counter.current();
Is it considered a good practice to use this library instead of a simple uints? Does it presents some kind of a threat? I'm talking about solidity version 0.8 or higher, where we don't have the int overflow problem anymore.
Excellent Sir!
Why is nobody talking about how these tests are not actually testing anything?
Epic!!! That was awesome work. Thanks for sharing your knowledge.
got error when npx hardhat test — > all the .sol file that we imported it says asre "File outside of allowed directories"
When I compiled the contacts NFT and NFTMarket they compile fine without erros. Just with "npx hardhat test" that we do at at 01:06:00 in the video I get the error. Fixed the error by moving node_modules/@openzeppelin inside contracts directory. Never had this issue. I am wondering what is causing it
can you make a video on creating a Binance NFT Marketplace?
this is a freakin awesome tutorial. I'm blown away by Hardhat, thanks for the introduction
Hi Nader..if i am correct we deploy same contract on ethereum and polygon network. Then token id counters are seperate for both networks..i mean same contract will work in silo on their reapective network..also one can mint same image on both networks..still item sold on polygon will not mark same item sold on ethereum …bcz cntrct address is dfrnt..is my understnding crrct..thanks.
When Minting – I'm getting an error of "let value = event.args[2]" Anyone else able to offer a solution here?
I am facing problem when i run npx hardhat test the error comes" Error: too many arguments: in Contract constructor (count=1, expectedCount=0, code=UNEXPECTED_ARGUMENT, version=contracts/5.5.0"… Do anyone knows where is the problem ?
Hello sir I'm having an error on the code invalid contract address on index.js file const market contract
Hey Nader, Is the idToMarketItem[i+1] correct logic? Because you're just looping through a length of unsoldItemCount, but that does not guarantee that the index is going to equal an index of an unsold item right?
Hi man you are great, could you make a video about a staking platfom for our nfts … nowadays the staking feature is very appreciated in NFTS … thanks a lot
Is this suitable for someone who know nothing about web3?
Hey Nader, great content as always. I'm interested in what extensions you use in VSCode for Solidity development, would you mind sharing?
Thanks. But got a question, how u stock all the element transactions in a database ? And if it possible, what kind of data base do you use ?
Awesome video. Just subscribed
Nader Dabit? More like Nader Da-Boss.
Wow Dalal Street Mumbai Is Growing Faster than Wall Street
Great video! was so excited to try it out. I'm a complete noob so it was really difficult for me to get any of it going. Like the resources you used. I don't know how to get any of them
hello Nader i am using visual studio code and Tailwind is not working….on macbook
Hey great video man! I’m curious, would you want to team up? I’m working on a massive unique and original NFT collection. If not then maybe you’d like to be an influencer and get some of the giveaways. Would like your thoughts.
Your video is really really helpful for beginners like me.
Thank you so much!
Hi, thanks for the Awesome Tutorial, i have question, i have developed my own market place, how i will charge a comission when i buy any Nft, means how amount is shared with the market place owner ?
Thank you!!!! 👍🏼
Hey help me there is a error saying that
Type error : cannot read the property of undefined (reading '2')
When am making nft through matic
Btw in network localhost everything going well
I know that some people first code the marketplace and then inside of it store NFT's addresses. In your case you coded a little different: you store a marketplace address inside a NFT. My question is, why do we have to store marketplace's address inside an NFT? Are there any advantages in your approach? Or any other reason why you choose to do so?
we also design and combine NFT ART. We sold them on fiverr and earned a good income. We have uploaded the nft collections we sell to our page.
Why is my tailwind not configuring properly? OS : ubuntu
Thanks for putting together this great tutorial. It takes tons of resources to put out quality content like this so I really appreciate you putting in the time. I want to see your channel blow up so my only suggestion would be to follow the flow of real world development rather then going down the page directly from your notes. As an example in real life, the work flow would look something like this 1) create the page under the pages folder in next.js and actually go to the page 2) create the compents and see if anything shows up on the screen 3) write the handlers to interact with the backend and click the buttons to make sure things are working. This would trully help us understand how you think about these things and get feedback more immediately (in alternative to coding for 45 minutes to then see what is working). Other than that you're well on your way to be the next Brad Traversy 😉
Hi sir, may i know why do we need to store the currentItem into storage? MarketToken storage currentItem = idToMarketItem[currentId];
Can I compile this contract with solana? Btw great video!
After seeing your video I am will be entrepreneur
When im installing things nothing works. I tried looking into installing yarn, tried different ways. Cant get it to work. Im opening terminal in visual studio. Any idea what im doing wrong?
Do you have something that demonstrate how to pay for a NFT using a ERC20?
Salam Nader. Thanks for the video, and I personally thank you for sharing such useful knowledge.
But hey, before hopping into the content I just wanted to make sure that I'm in a right place.
Is this video going to teach us how to create an NFT marketplace like for example Opensea?
Hey, great video, thank you for sharing all of this ! I have a question still.. do we need 1 only nftadress ? even if an other creator wants to list a new nft ?
The IDE plugin that keeps recommending the new line of code is really confusing actually
https://youtu.be/HzU23o-L4aY
At 50:49 Line No. 103 we can also check for the sold property of the MarketItem, right?
Thank you so much! I love this tutorial