Створення NFT DEX з нуля

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

Огляд NFT

NFT(Невзаємозамінний токен)це невзаємозамінний токен, кожен токен є унікальним і відповідає протоколу ERC-721. Зазвичай кожен NFT у гаманці відображає різні зображення та має унікальний ID для розрізнення. Через особливості NFT, їх не можна оцінювати за допомогою кривої ціни, як токени ERC-20, тому звичайним способом торгівлі є форма книги замовлень.

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

Модель торгівлі на order book

Режим книги замовлень поділяється на два види:

1. Цінова пропозиція: продавець встановлює ціну продажу, покупець може купити, якщо вважає її прийнятною.
2. Запит на купівлю: покупець надсилає запит на купівлю, продавець може продати, якщо вважає ціну прийнятною.

Зазвичай ціна на заявки на покупку буде нижчою за ціну на заявку на продаж. У цій статті головним чином розглядається модель заявки на продаж.

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

Основні функції NFT біржі

Базова біржа NFT повинна містити такі функції:

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

Процес розміщення товарів

1. Фронтент: користувач вибирає NFT та встановлює ціну, натискає на виставлення на продаж
2. Контракт: Користувач уповноважує контракт на операції з NFT

Процес покупки товару

1. Передня частина: користувач вибирає NFT, натискає «Купити»
2. Контракт: передача коштів покупця продавцеві, NFT покупцеві

реалізація NFT біржі

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

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

2. Написання смарт-контракту

Контракт в основному містить такі методи:

2.1 Продавець викладає NFT

Процес:

1. Користувач обирає NFT
2. Встановити ціну
3. Авторизація NFT для контракту
4. Виклик методу розміщення

Метод викладання:

1. Перевірка прав власності на NFT
2. Додати запис про виставлення на продаж
3. Виклик події виставлення на продаж

2.2 Покупка NFT покупцем

Виконання контракту:

1. Зчитування даних NFT
2. Обчислити та утримати комісію
3. Переведення NFT покупцеві
4. Виклик події покупки

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

Встановіть поле isActive для запису на лістинг як false

2.4 Витягування комісії

Витягнути накоплені комісії з контракту

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

Основний інструмент:

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

Передня частина містить 3 сторінки:

• Mint: Створити тестовий NFT
• Buy:NFT біржа
• Портфель: управління користувацькими NFT

3.1 Підключення гаманця

Використання компонентів підключення Ant Design Web3.

3.2 Сторінка Mint

Використовуйте метод useWriteContract від wagmi для виклику методу mint контракту NFT.

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

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

Показує NFT, які має користувач, підтримує операції з виставлення на продаж та зняття з продажу.

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

Показати представлені NFT, підтримує операції з купівлі.

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

За допомогою вищезазначених кроків, було реалізовано базову NFT DEX. Фронтенд можна розгорнути на Vercel для доступу.