Побудова NFT децентралізованої платформи для торгівлі з нуля

Для NFT, які дотримуються протоколу ERC-721, як реалізувати децентралізовану торгівлю? Наразі основним способом торгівлі NFT є використання книги замовлень, що схоже на викладення товарів на полицях, покупець може придбати їх, якщо вважає ціну прийнятною. У цій статті ми реалізуємо базову платформу децентралізованої торгівлі NFT шляхом написання смарт-контракту та простого фронтального інтерфейсу.

! Стартова серія Web3: впровадження NFT DEX з нуля

Основні функції платформи NFT

Базова платформа для торгівлі NFT повинна мати такі функції:

1. Виставлення NFT: продавці можуть встановлювати ціну для виставлення NFT на платформу
2. Купівля NFT: покупці можуть купувати виставлені на продаж NFT за встановленою ціною.
3. Сплата комісії: платформа може стягувати певний відсоток комісії від ціни угоди

Виставлення NFT

Процес виставлення NFT виглядає наступним чином:

1. Продавець обирає NFT для розміщення та встановлює ціну
2. Продавець уповноважує торговий контракт виконувати операції з цим NFT
3. Викликати метод виставлення контракту, зафіксувати інформацію про виставлення

Купити NFT

Процес купівлі NFT виглядає так:

1. Покупець обирає NFT, який хоче придбати
2. Виклик методу покупки контракту
3. Контракт передає кошти покупця продавцеві, одночасно передаючи NFT покупцеві.

Реалізація торгової платформи

1. Створити тестовий NFT

Можна швидко розгорнути смарт-контракт NFT за протоколом ERC-721 для тестування за допомогою Remix.

2. Написання торгового контракту

Договори торгівлі повинні реалізувати такі основні методи:

2.1 Виставлення NFT

солідність функція listNFT(адреса nftAddress, uint256 tokenId, uint256 price) публічна { // Перевірка прав власності на NFT // Записати інформацію про викладення
// Виклик події додавання на платформу }

2.2 Купівля NFT

солідність function purchaseNFT(address nftAddress, uint256 tokenId) public payable { // Отримати інформацію про виставлення NFT // Обчислити та вирахувати комісію // Перемістити NFT покупцеві // виклик події покупки
}

2.3 Скасувати виставлення на продаж

солідність функція cancelListing(адреса nftAddress, uint256 tokenId) публічна { // Перевірка прав на виконання операцій // Встановити статус виставлення на продаж як недійсний // Виклик події скасування }

2.4 Витягнення комісії

солідність function withdrawFees() public onlyOwner { // Переміщення комісії в контракті }

3. Розробка інтерфейсу

Використовуйте наступні інструменти для розробки фронтенду:

• Ant Design Web3: для підключення гаманця та展示NFT
• Wagmi: використовується для взаємодії з гаманцем
• Next.js + Vercel: розгортання проекту

Фронтальна частина містить такі основні сторінки:

• Mint: використовується для створення тестових NFT
• Купити:NFT торговий майданчик, можна купити виставлені NFT
• Портфель: управляти NFT користувача, можна виставляти на продаж і знімати з продажу

3.1 Підключити гаманець

Використовуйте компонент підключення Ant Design Web3 для реалізації функції підключення гаманця.

3.2 Сторінка Mint

Викликати метод mint контракту NFT для створення тестового NFT.

3.3 Сторінка портфоліо

• Отримати NFT, що належать користувачу
• Визначте, чи NFT вже виставлено на платформі
• Реалізація функції розміщення та зняття NFT

3.4 Сторінка покупки

• Показати всі виставлені на платформі NFT
• Реалізація функції покупки

! Стартова серія Web3: впровадження NFT DEX з нуля

Отже, базова платформа NFT Децентралізація завершена. Її можна розгорнути на Vercel для тестування.

! Стартова серія Web3: впровадження NFT DEX з нуля

! Стартова серія Web3: впровадження NFT DEX з нуля