Создание NFT Децентрализованная биржа с нуля

Для NFT, соответствующих протоколу ERC-721, реализация децентрализованной торговли является темой, которая заслуживает обсуждения. В настоящее время основные платформы торговли NFT в основном используют способ размещения заказов для торговли, аналогично тому, как товары выставляются на полках для выбора покупателями. В данной статье будет показано, как реализовать децентрализованную торговлю NFT, написав смарт-контракты и создав простую фронтенд-страницу. Необходимо отметить, что содержание данной статьи предназначено только для учебного использования и не подходит для реальной производственной среды.

! Начальная серия Web3: реализация NFT DEX с нуля

Обзор NFT

NFT это невзаимозаменяемый токен, каждый токен уникален и соответствует протоколу ERC-721. Обычно NFT отображаются в кошельке с разными изображениями, и каждая группа NFT имеет уникальный идентификатор для различения. Из-за особенностей NFT невозможно устанавливать цену, как это делается для токенов ERC-20, используя ценовые кривые. Поэтому в настоящее время распространенный способ торговли - это форма ордерной книги.

! Серия для новичков Web3: реализация NFT DEX с нуля

Режим торговли по ордеру

Модель ордерной книги делится на два типа:

1. Ценовое предложение: Продавец устанавливает продажную цену, и покупатель может купить, если считает её подходящей.
2. Заявка на покупку: покупатель отправляет заявку на покупку, продавец продает, когда считает цену подходящей.

Как правило, цена заявок на покупку будет ниже цены заявок на продажу. В данной статье будет основное внимание уделено торговле по заявкам на продажу.

! Начальная серия Web3: реализация NFT DEX с нуля

Основные функции NFT DEX

Базовый NFT DEX должен включать в себя следующие функции:

1. Выставить товар: разместить NFT по установленной цене
2. Покупка товара: покупка по цене NFT
3. Взимание комиссии: взимается в процентном соотношении к цене сделки

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

1. Frontend: Пользователь выбирает NFT и устанавливает цену, нажимает на размещение
2. Контракт: Пользователь уполномочивает контракт на операции с NFT

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

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

Реализация NFT DEX

1. Создание тестового NFT

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

! Начальная серия Web3: реализация NFT DEX с нуля

2. Написание смарт-контрактов

Основные методы включают в себя следующие:

2.1 Продавец выставляет NFT

Процесс:

1. Пользователь выбирает NFT
2. Установить цену
3. Авторизовать NFT для контракта
4. Вызов метода размещения

Метод размещения требует:

• Проверка прав собственности на NFT
• Добавить запись о размещении
• Запуск события размещения

! Серия для новичков Web3: реализация NFT DEX с нуля

2.2 Покупка NFT покупателем

Шаги выполнения контракта:

1. Чтение данных NFT
2. Рассчитать и вычесть комиссию
3. Перевести NFT покупателю
4. Событие покупки

! Начальная серия Web3: реализация NFT DEX с нуля

2.3 Отмена листинга

Просто установите поле isActive в false для записи о размещении.

! Начальная серия Web3: реализация NFT DEX с нуля

2.4 Извлечение комиссии

Собранные комиссии будут зачислены в контракт или переведены на указанный адрес.

3. Фронтенд-разработка

Используемые основные инструменты:

• Муравьиный дизайн Web3 -WAGMI (МЫ ВСЕ СПРАВИМСЯ)
• Next.js + Версель

Основная страница:

• Mint: Создание тестового NFT
• Купить:NFT биржа
• Портфель: Управление добавлением и удалением NFT

3.1 Подключить кошелек

Реализовать с помощью компонента подключения Ant Design Web3.

! Начальная серия Web3: реализация NFT DEX с нуля

3.2 Страница Mint

Используйте метод useWriteContract от wagmi для вызова контракта mint.

! Начальная серия Web3: реализация NFT DEX с нуля

3.3 Страница Портфолио

Показать NFT пользователя, поддерживать операции по размещению и снятию с продажи.

! Начальная серия Web3: реализация NFT DEX с нуля

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

Показать выставленные на продажу NFT, поддерживает операции покупки.

! Серия для новичков Web3: внедрение NFT DEX с нуля

С помощью вышеуказанных шагов был реализован базовый NFT DEX. Его можно развернуть на Vercel для доступа и использования.