🔴 Let's build NFT Drop Dapp with NEXT.JS! (Thirdweb, ReactJS, TypeScript, Tailwind CSS, MetaMask)

Описание: 🚨 Join the world’s BEST developer community “Zero to Full Stack Hero”: https://www.papareact.com/course

📩 Want coding problems (with solutions!) delivered to your inbox daily? https://www.papareact.com/dailycoding...

❗️ Sign up to Thirdweb today for FREE: https://thirdweb.com/?utm_source=yout...

🗂 NFT Metadata: https://drive.google.com/drive/u/1/fo...

Join me as I build the NFT DROP DAPP with NEXT.JS. You'll learn how to do the following in this build:

👉 How to create and release your first NFT drop collection smart contract with Thirdweb!
👉 How to allow users to MINT a Real NFT which is visible on OpenSea - The largest NFT marketplace to exist!
👉 How to build a Login and Logout Authentication flow with Metamask!
👉 How to implement toaster notifications & silky smooth loading animations!
👉 How to implement Sanity to have a full CMS platform which is customisable even when the website is live!
👉 How to use testnets such as the ETH Rinkeyby test network!
👉 How to finally deploy the final build on Vercel!

So Much More!

🔴 LOOKING FOR THE CODE? 🛠️
https://links.papareact.com/github

👇🏻FOLLOW ME HERE:
Instagram: https://links.papareact.com/instagram
Facebook: https://links.papareact.com/facebook
LinkedIn: https://links.papareact.com/linkedin
Twitter: https://links.papareact.com/twitter
Discord: https://links.papareact.com/discord
Newsletter: https://links.papareact.com/newsletter

💰 WANT TO SUPPORT THE CHANNEL?
Donate here: https://links.papareact.com/donate
Grab some PAPA Merch: https://links.papareact.com/merch

🕐 TIMESTAMPS:
00:00 Introduction
01:19 Build Tech Stack
02:28 Thirdweb Sponsorship
04:23 Build Showcase & Explanation
07:07 Setting up Next.js & Tailwind CSS
08:56 Initialising the Build
15:47 Implementing Routing
18:37 Creating the NFT Drop Page
20:21 Building the Left Side of the NFT Drop Page
32:38 Building the Right Side of the NFT Drop Page
33:50 Building the Header Section of the NFT Drop Page
42:13 Building the Content Section of the NFT Drop Page
47:28 Building the NFT Mint Button (1/2)
49:56 Building the Login Functionality with Thirdweb
58:14 Building the Logout Functionality
1:00:53 Adding the Wallet Address Text
1:04:05 Deploying the Build (1/3)
1:08:13 Setting up Sanity
1:26:46 Modifying Sanity Schemas
1:37:41 Creating and Deploying the NFTs in Thirdweb
1:43:27 Adding Funds to your MetaMask Wallet
1:45:23 Batch Uploading NFTs using Thirdweb
1:50:58 Adding a Claim Phase
1:53:51 Explaining Server Side Rendering in Next.JS
1:54:42 Implementing Server Side Rendering using Next.JS (1/2)
2:02:27 Creating Type Definitions using TypeScript
2:04:45 Building the Home Page
2:15:19 Implementing Server Side Rendering using Next.JS (2/2)
2:19:36 Implementing the Sanity Collection Data
2:25:22 Deploying Sanity & Build (2/3)
2:30:57 Adding the Total Number of NFTs Claimed
2:40:03 Adding a Silky Smooth Loading Animation
2:44:17 Building the NFT Mint Button (2/2)
3:00:31 Implementing Toaster Notifications
3:08:36 Final Build Explanation & Demo
3:10:53 Deploying the Final Build (3/3)
3:12:02 Outro

Let’s get it PAPAFAM 🔥.

#reactjs #web3 #nextjs