Complete NFT tutorial based on React, Typescript and Solidity

Complete NFT tutorial based on React, Typescript and Solidity

Learn how to create an NFT marketplace on Ethereum using React / Next JS, Solidity and Pinata (IPFS)

English name of the course: NFT Marketplace in React, Typescript & Solidity - Full Guide

This video tutorial is 5.0 hours in total, with Chinese and English subtitles, clear picture quality and no watermark, and full source code attachments

download link

课程编号:300Baidu network disk address: https://pan.baidu.com/s/1gDdZ0VL5NEd-SdSszDGO6w?pwd=52f0

Course content

what you will learn

  • Create a real NFT marketplace!

  • Understand complex topics in a practical and entertaining way

  • Get a complete toolkit for use with any [blockchain]

  • Develop a real application on the blockchain

Require

  • Knowledge of React JS

  • Basic knowledge of Solidity

  • Familiar with blockchain

illustrate

Next.js gives you the best developer experience with all the features you need for production: hybrid static and server rendering, TypeScript support, smart bundling, route prefetching, and more. No configuration is required.

Ethereum is a technology that lets you send cryptocurrency to anyone, but above all, it also powers applications that everyone can use and no one can delete. This is the most programmable blockchain in the world.

Solidity is an object-oriented high-level language for implementing smart contracts. Smart contracts are programs that govern the behavior of accounts within the Ethereum state.

Pinata is a pinning service that allows users to host files on the IPFS network. The Interplanetary File System ( IPFS ) is a protocol and peer-to-peer network for storing and sharing data in a distributed file system.

What is covered in this course?

The course covers everything needed for decentralized NFT applications according to the ERC721 standard. Students in this course will learn about NFTs by creating real-world applications.

Students will learn what an ERC721 smart contract is and how to create one.

The dApp frontends covered in the course are created using the React JS library and the Next JS framework. CSS and design are built using Tailwind framework.

NFT market applications:

The core part of the course covers the creation of interactive NFT marketplaces. Customers of the platform will be able to purchase NFTs using the ether digital currency.

The application was created in the Next JS framework, built on top of React JS.

The first part of the course covers setting up the page layout, creating the home page and components. The Tailwind CSS framework covers the styling part of the application.

Students will explore how to feed the Web3 JS code into the application, the code responsible for communicating with the crypto wallet and thus the blockchain.

We'll use the Provider/Consumer concept to provide this layer, which is common in React JS. This will guarantee that all components and pages have access to the functions responsible for communicating with the blockchain.

Application state and data management is handled through the SWR (stale while revalidate) library. This will give the application a reactive feel and provide reactive rendering of components when new data is received.

After all, having achieved the necessary communication with the blockchain, students will start working on the implementation of smart contracts.

The class follows the accepted ERC721 token standard.

Smart contracts are an important part of the project. It acts as a blockchain "storage" for NFTs and provides functionality to verify NFT ownership and link with media storage.

The final part of the course covers preparing and storing NFT-related data. So-called NFT metadata.

NFT metadata data will be stored in Pinata (IPFS) based storage. Students will learn to collect data from forms and then submit it to Pinata storage. The next important part is to link this metadata and create the NFT.

The most noteworthy topics in this application are:

  • Next JS Integration with Web3 and Blockchain

  • Reactivity with Hooks and SWR

  • Create NFT (ERC721) smart contract

  • NFT data manipulation and storage on Pinata

  • typescript

Who is this course for:

  • Beginner to mid-level developers interested in blockchain technology

  • People are looking for practical Solidity/Ethereum/[NextJS] development guides.

  • This course is for anyone eager to learn how to build an app from scratch

     

Guess you like

Origin blog.csdn.net/duoshehuan6005/article/details/127516942