Build an NFT Staking Smart Contract + Web Application 🚀 Solidity, thirdweb deploy, Next.JS Tutorial

Learn How To Create An NFT Staking Smart Contract Using Solidity & Deploy It Using thirdweb deploy! We'll use the smart contract to create a full stack web application using Next.JS, TypeScript, and the thirdweb SDK. Disclaimer and more resources below 👇.
In this video, you will learn how to create and deploy your own ERC-721 NFT Drop smart contract, ERC-20 token smart contract, and create an NFT Staking Smart contract using Solidity and thirdweb deploy. We also create a full-stack web application that allows users to mint NFTs from the NFT Drop, stake their NFTs, and claim the rewards from the NFT Staking smart contract we deployed.
Access the full code here: github.com/thirdweb-example/n...
Ask questions by joining the thirdweb Discord: / discord
Original contract (not the version used in this video): github.com/andreitoma8/ERC721...
Disclaimer: The code in this video has not been audited and should not be used in production environments. This video is intended for education only, and should not be used for financial purposes. Always do your own research!
Timestamps
0:00 Introduction
1:03 Creating NFT Drop Contract
6:33 Creating Token Contract
8:15 Writing NFT Staking Contract
30:35 Deploying Contract with thirdweb deploy
34:12 Creating the NFT Minting Page
40:20 Creating the NFT Staking Page
56:10 Demo Of the Application
Follow me:
Twitter 👉 / jarrodwattsdev
GitHub 👉 jarrodwatts.com
Blog 👉blog.jarrodwatts.com
Donate 👉 www.buymeacoffee.com/jarrodwatts

[@eyeroniqstrategicbranding7934]

Thank you friend, from 0% knowledge of this languages to getting my contract and staking successful

[@migom6]

Missed your videos for 6 months! I like your project based video style. Keep it up

[@JarrodWatts]

Thank you Madhurjya! Glad to be back making videos :)

[@honusensei]

Thanks for your tutorial!🥰

[@jopadjr]

460th...Thanks Jarrod. You are great teacher... Cheers

[@cherobeam1181]

Found the solution! Top Vid!!!

[@hafidnurfirmansyah2839]

Wow amazing

[@BossDTvOfficial]

done subscribe sir. i really like the style. thank you so much

[@jamaicaigot9335]

Hey, thanks for sharing! Do you have your audio version of this in Audea?

[@jasonyang7655]

Hi Jarrod! Thanks for your video. I wonde why we don't need implement ERC721TokenReceiver in staking contract?

[@rkoncal]

Awesome video. keep it up! Btw what's the best media/way to connect with you?

[@gnarlykill6373]

this is a great video, what if for example i wanted to pay out the rewards in an already existing token, e.g stake said NFT get paid in, matic, eth, avax, instead of having my own token?

[@jozmat2268]

Do you have a video where you explain how to implement usdt using the smartchain pod in a contract by doing it thirdweb to?

[@mikeepr5369]

Is there a way to add a Stake all and Unstake all function in the contract / button on the dapp?

[@user-so2qz6hv2r]

Thank you for the wonderful video. I learned a lot. I want to perform token issuance and staking on my NFT project, but I don't have the skills like you. Is it possible to request coding etc.?

[@Arceus201]

Hello my friend. I have just a small question. Using signatureDrop gives me an error in loading the nfts, so I can't proceed in seeing my NFTS in the dapp! How should I fix it to use this with a signature drop contract? Keep up the good work!

[@MXNCLER]

what if a smart contract is ready on the etherscan and its fully deployed , will this tutorial be of any use in creating a staking page? cause from what i watched it seems that a erc20 can also be made?

[@mohammedhejjam5506]

Thank you for the wonderful video. I learned a lot. i faced a problem as long as i paste your code exactly but faced in issue " Argument of type 'TokenImpl | undefined' is not assignable to parameter of type 'RequiredParam'. Type 'TokenImpl' is missing the following properties from type 'Erc20': featureName, mintable, burnable, droppable, and 10 more. " i wish some help

[@drdev_blog]

Thank you, is there anyway to create erc20 token gate for some pages of the website? For example you need to have 100 tokens to get access? Second question - how to implement multiwallet connection? And final one - is there any chance to set level system for holders of #nfts or #tokens?

[@mattcrumley6598]

How do you import contracts that were already deployed outside of third web into the sdk kit? I imported them into third web but when I use npm run dev I get an error that no contract files are found. I seen that you deployed them from vs code but I did not. Please help

[@thelov3potion]

I am using custom chain, chainid = elastos. Any idea?

[@laughteroludu475]

Thanks for this tutorial, but sir I have a question, I have a WordPress website where I deploy my nft collection and I will like to add staking utility to it but I don't know how to go about it any advice i

[@RichTamm]

Any chance for update on this video? My thirdweb didn't have the installation section at start. Unsure how to proceed if site has changed.

[@raylove707]

I have a question what type of laptop does this coding work on because it won’t work on my chrome book

[@PurpleEarB]

If I use the yarn dev, it's not working, any suggestion?

[@whenwelookinthemirror3834]

Is this close to being out of the beta release and audited?

[@NoNonsenseDEFI]

When running "npx thirdweb deploy" I get "error: object expected" windows pop up. Any ideas?

[@zuldadubinary3776]

how is Staking_Contract.sol deploy? I don't see the .env file or anything else in the project

[@cherobeam1181]

GM, everything is now working but with staking i have a problem. The stake side on the localhost shows the token and the balance but not my the unstaked nfts and not the staked nfts!!! I minted 3 for testing! What can be the problem? Would be nice if i can get any help from you... :)

[@uyamadaniel6030]

Same probs here

[@rubibeats]

can you add staking to an existing contract?

[@NachoWeb3Master]

How I deploy token to Mainet and make it tradeable on uniswap?

[@tomypurnomosidi]

Can i add navbar into it?

[@naberalov4711]

Thank, thats wonderfull video i learn a lot.. can i create avalance NFT Staking platform with that?

[@JarrodWatts]

Yeah AVAX is supported!

[@helloworld_123]

@@JarrodWatts What do we need to do to make a staking site in a different network?

[@uyiedos]

I am getting this after everything loads and the stake page is opening - Application error: a client-side exception has occurred (see the browser console for more information). anyone has an idea.....Console shows bignumber error

[@ramezbaslious3030]

does this work on solana?

[@Kasperwtrcolor]

If my main collection is on the ethereum chain, can my staking contract and tokens be on polygon mainnet?

[@JarrodWatts]

Unfortunately not, as the contract will need to be on the same network in order for it to transfer the tokens

[@ImKurtzy]

@@JarrodWatts but you could just select the eth or sol network instead of polygon when setting this up correct?

[@kindofcrazy2886]

I have run yarn dev and everything works on the local host but how can deploy it to my web host ? With yarn build ? Or what i have to do now ?

[@JarrodWatts]

I’d recommend using Vercel to deploy

[@kindofcrazy2886]

@@JarrodWatts can you make a video how to use the hashlips minting dapp with a thridweb smart contract ?:)

[@danieldil6198]

This vid was made 8 months ago, ever since then have you added staking to your Deploy feature

[@Prom1ks]

I can't get it right at the beginning. What should I download to make it work?

[@Loriba]

Make sure you instal react and javascript sdk first. That is a must before doing anything else.

[@Yolpoker]

How to deploy app to our domain? Cpanel

[@chickenman1004]

I can't find Installation category in thirdweb portal T_T. also CMD is not working with npx. I am so newbie Jarrod. how can I follow you from 09:02 ? T_T

[@JarrodWatts]

The command is now npx thirdweb create

[@hurric4n3ike]

Could this be done with ERC-1155s as well?

[@JarrodWatts]

Yes! Just requires some small changes to the contract code

[@jswizzle_tv9898]

@@JarrodWatts What would these changes be? Been trying to figure this out for hours now

[@jswizzle_tv9898]

Any luck on this? I am running into the same issue

[@Neo-ew2pt]

Please make for solana

[@necromancerundead1201]

jarrod do you have a point of contact.. for personal assistance

[@user-bq2xe3jp4c]

can i do the same for eth chain?

[@JarrodWatts]

Yes!

[@mrtuff3540]

Where are from please 👍

[@mazumaiproductions8359]

I cant see what r u typing.

[@jacob6333]

this is on shit matic lmao do one on eth or binance

[@JarrodWatts]

This works for any EVM compatible chain

[@danieldil6198]

Is your stake721 safe from block.timestamp attacks?

[@kevinwolfe371]

pr໐๓໐Ş๓

[@raulzoce]

whre is the problem? Server Error SyntaxError: Unexpected token '?' This error happened while generating the page. Any console logs will be displayed in the terminal window. Call Stack file:///D:/welxstakingdapp/node_modules/%20(thirdweb-dev/react/dist/index-44e60bee.cjs.dev.js (5364)

[@teodorionescu3490]

The contract is deployed but it can’t gather the nft data from opensea 🥲

[@teodorionescu3490]

I am trying to see if there will be a difference when I upload it to worldpress or vercel