CF

NFT Marketplace in React, Typescript & Solidity - Full Guide

16h 20m 55s
English
Paid
Updated September 2026

NFT Marketplace in React, Typescript & Solidity - Full Guide is a 132-lesson 16 hours 20 minutes self-paced course by Udemy. Build a Working NFT Marketplace from Contract to Frontend This course walks through creating a decentralized NFT application built on the ERC721 standard, giving you hands-on experience with the full stack behind an NFT marketplace rather…

Course facts

Lessons
132
Duration
16 hours 20 minutes
Level
All levels
Language
English
Updated
2026-09-11
Instructor
Udemy
Price
Premium

Build a Working NFT Marketplace from Contract to Frontend

This course walks through creating a decentralized NFT application built on the ERC721 standard, giving you hands-on experience with the full stack behind an NFT marketplace rather than just theory. You'll write and deploy ERC721 smart contracts in Solidity, then connect them to a frontend built with React and Next.js and styled with Tailwind CSS.

Connecting Frontend to Blockchain

On the frontend side, you'll integrate Web3 JS for wallet-based blockchain communication and apply React's Provider/Consumer pattern so connection state is available across every page and component. The SWR library handles data fetching and caching, keeping the interface responsive as on-chain data changes.

Smart Contracts and Metadata

The smart contract itself acts as the source of truth for ownership and links each token to its underlying media. To handle that media, the course covers storing NFT metadata on IPFS through Pinata, including how to collect data through forms and submit it so it can be linked back to a minted token.

Result

By the end, you'll have built an interactive marketplace where users can trade NFTs using Ether, with the contract, storage, and interface all built and connected by hand.

Who teaches NFT Marketplace in React, Typescript & Solidity - Full Guide? Udemy

Udemy thumbnail

Udemy is the largest open marketplace for online courses on the internet. Founded in 2010 by Eren Bali, Oktay Caglar, and Gagan Biyani and headquartered in San Francisco, the company went public on the Nasdaq in 2021 under the ticker UDMY. The platform hosts well over two hundred thousand courses across software development, IT and cloud, data science, design, business, marketing, and creative skills, taught by tens of thousands of independent instructors. Roughly seventy million learners use it worldwide, and the corporate arm — Udemy Business — supplies a curated subset of that catalog to enterprise customers.

Because Udemy is a marketplace rather than a single editorial publisher, the catalog is uneven by design. The strongest material lives in the long-form, project-based courses authored by working engineers — full-stack JavaScript, React, Node.js, Python data science, AWS, Docker and Kubernetes, mobile development with Flutter and React Native, and cloud certification preparation. The CourseFlix listing under this source is the slice of that catalog that has been mirrored here for offline-friendly viewing, organized by topic and updated as new releases land. Pricing on Udemy itself swings dramatically with the site's near-permanent sales, which is why the platform is best treated as a deep reference catalog: pick instructors with strong reviews and a track record of updating their material rather than buying on the headline price alone.

What lessons are included in NFT Marketplace in React, Typescript & Solidity - Full Guide?

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 132 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Introduction
All Course Lessons (132)
#Lesson TitleDurationAccess
1
Introduction Demo
06:22
2
Ask For Help
00:35
3
How to resolve issues
05:52
4
Init Project
05:32
5
Tailwind
05:19
6
Navbar
08:34
7
Cleanup
02:00
8
BaseLayout
07:53
9
Listing Page
06:52
10
Nft Components
09:51
11
Nft props
06:05
12
Nft Type
05:37
13
Display nft item values
06:29
14
Links and create page
09:51
15
Profile Link
02:43
16
Active Link
05:34
17
Create Page Layout
06:39
18
Profile Layout
03:54
19
Paths refactor
08:24
20
Web3Provider
09:54
21
Planning
13:12
22
Web3 Types
05:21
23
Web3 State
08:02
24
Window Ethereum
10:13
25
Provider
04:54
26
Ganache Install
06:48
27
Base smart contract
11:00
28
ERC721
08:51
29
Truffle Console
05:36
30
Load Contract
11:59
31
Call name, symbol
07:50
32
Use Account
09:52
33
Hook Types
08:23
34
Generic Types
08:34
35
Setup Hooks
12:05
36
Create web3 state
06:59
37
Use Account Abstraction
05:28
38
Recap
05:00
39
Conditional swr
06:32
40
Account data
09:05
41
Connect button
06:07
42
Connect Type Definition
04:02
43
Handle accounts changed
06:06
44
Mutate account
04:44
45
Is loading and validating
07:48
46
Handle error when no wallet
03:59
47
Walletbar
05:24
48
Wallet conditionals
11:18
49
Use Network
06:20
50
Network Name
05:58
51
Network label
01:36
52
Target network
06:03
53
Handle Network Loading
03:20
54
Reload on network change
09:03
55
Handle Wallet Lock Out
06:23
56
Fix Loading and undefined Ethereum
04:53
57
Mint Token
07:17
58
AI Mint Token
11:43
59
Prepare test
09:20
60
Mint token test
08:55
61
TokenURI test
06:12
62
Check if token uri exists
04:27
63
Duplicate URI Test
07:31
64
Create NFT item
09:50
65
Listing Price Test
07:53
66
NFT item test
06:11
67
Listing price
04:51
68
Buy NFT
10:29
69
Buy NFT test
07:05
70
Add token to all enumeration
09:54
71
AI Add token to all enumerations
08:01
72
Test token transfers
06:33
73
Get all nfts on sale
05:01
74
AI get all nfts on sale
09:20
75
Test get all listed nfts
06:24
76
Add token to owner enums
06:26
77
AI add token to owner enums
06:06
78
Get owned Nfts
07:55
79
Test owned Nfts
04:22
80
Remove token from owned enums
06:05
81
AI Remove token from owned enums
13:49
82
Test Remove token from owned enums
07:45
83
Remove token from all enums
04:48
84
AI Remove token from all enums
06:26
85
Test Burn token
10:14
86
Place nft on sale
09:28
87
Test listing of nfts
09:08
88
Use listed Nfts
10:56
89
Upload Images to Pinata
09:17
90
Mint Token in Truffle
08:23
91
Get Nft Data
05:04
92
Contract Type
09:31
93
Get Complete Nfts
08:04
94
Display Nfts
05:03
95
Sign Contract
04:50
96
Use owned nfts
07:31
97
Active Nft
03:51
98
Set Active Nft
05:02
99
Buy Nft in Hook
11:56
100
List Nft
08:48
101
UI changes active nft
02:46
102
Use Callback
06:43
103
Handle part of form
10:11
104
Handle attribute change
04:41
105
Introduce Verification architecture
15:46
106
With iron session
10:26
107
Create message in server
12:34
108
Fix reload of the browser
04:45
109
Sign message
08:18
110
Verify form data
07:26
111
Get session back
11:31
112
Get contract server side
07:19
113
Verify Signature
11:56
114
Upload Metadata to Pinata
14:50
115
Get image bytes
04:52
116
Get signed data
03:47
117
Image upload endpoint
11:28
118
Fix image select issue
03:29
119
Upload image success
09:27
120
Store image to state
05:38
121
Check Nft Structure
11:14
122
Get Price
03:26
123
Create a Nft
06:08
124
Handle promises
08:34
125
Handle rest of promises
04:31
126
Display wrong network
04:53
127
Course Done!
04:22
128
Ropsten preparation
08:26
129
Deploy to Ropsten
12:11
130
Testing app on Ropsten
09:11
131
Github Repo
09:15
132
Deploy to Vercel
10:18
Unlock unlimited learning

Get instant access to all 131 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

What courses are similar to NFT Marketplace in React, Typescript & Solidity - Full Guide?

More courses by Udemy

Frequently asked questions

What prerequisites should I have before enrolling in this course?
Prospective students should have a foundational understanding of JavaScript and familiarity with React. Knowledge of basic blockchain concepts and Ethereum is recommended, as the course involves interacting with Ethereum's blockchain using Solidity and Web3 JS.
What will I build by the end of the course?
By the end of the course, you will have developed a fully functional decentralized NFT marketplace. This includes implementing ERC721 smart contracts, using React and Next.js for the frontend, and leveraging IPFS for distributed file storage.
Who is the target audience for this course?
This course is designed for developers interested in decentralized applications, blockchain technology, and NFTs. It is suitable for those looking to enhance their skills in React, Solidity, and smart contract development.
How does this course compare to other blockchain courses?
This course focuses specifically on building a decentralized NFT marketplace using the ERC721 standard. It provides hands-on experience with React, Solidity, and Ethereum, offering a practical approach to understanding NFTs and smart contracts, which may differ from other courses with broader blockchain topics.
What tools and platforms will I use in this course?
You will use Next.js for building the frontend with React, Solidity for writing smart contracts, and Web3 JS for blockchain communication. The course also covers Pinata and IPFS for decentralized file storage and Ethereum for deploying smart contracts.
What topics are not covered in this course?
The course does not cover other blockchain platforms outside of Ethereum or NFT standards other than ERC721. It also does not delve into non-technical aspects of NFTs, such as market trends or legal considerations.
What is the expected time commitment for this course?
The course consists of 132 lessons. While the exact runtime is not specified, students should anticipate dedicating a significant amount of time to complete the lessons, particularly if they are new to blockchain or the specific technologies used.