Наконец-то он здесь! Приложение торговой площадки NFT, созданное с помощью Meteor. Это приложение предназначено только для демонстрационных целей и основано на учебнике Надера Дабита по созданию торговой площадки NFT. Идея заключалась в том, чтобы воспроизвести его последнее приложение, используя Meteor вместо Next.js в качестве основы, добавив при этом новые функции. Мы добавили страницу сведений для каждого элемента и параметры сортировки/фильтрации для списка элементов. Мы хотели разработать что-то, что поможет новым разработчикам, которые хотят изучать Meteor в увлекательной игровой форме, попутно создавая что-то классное.

Обзор

Приложение позволяет выставлять NFT на продажу, покупать и даже перепродавать, если хотите. Мы делаем это с помощью Polygon, который построен на основе Ethereum. Тем не менее, пользователям быстрее и дешевле взаимодействовать с ним. Это также помогает разработчикам создавать приложения, которые в противном случае были бы более сложными, если бы они были построены непосредственно на Ethereum.

Кроме того, это все, что мы использовали для создания приложения:

  • Фреймворк для веб-приложений — Meteor (конечно)
  • Среда разработки Solidity — Каска
  • Файловое хранилище — IPFS
  • Библиотека веб-клиента Ethereum — Ethers.js

Что вы найдете в приложении

Если вы хотите проверить это вживую, вы должны сначала убедиться, что у вас установлено расширение браузера Metamask и что вы создали учетную запись Metamask. Затем вы можете перейти на https://meteor-nft-marketplace.meteorapp.com и поиграть с ним. Или, если вы хотите увидеть его в действии локально, вы можете клонировать проект с https://github.com/meteor/examples. Для обоих вариантов есть инструкции в файле README.md в корневой папке приложения.

Первый экран, который вы видите при входе в приложение, — это список всех NFT для продажи. Например, вы также можете отсортировать товары по цене или дате добавления.

Подключение к приложению осуществляется с помощью Metamask, когда вы переходите на экран подключения.

Вы также можете создать предмет для продажи, если хотите. На экране создания вы добавляете изображение, цену и другую информацию о товаре, который продаете. Мы используем IPFS для загрузки и сохранения изображений.

Мы создали страницу сведений, где вы можете проверить всю информацию о выбранном вами элементе. Чтобы это работало, нам пришлось добавить небольшую функцию, которой не было в исходном контракте Marketplace, под названием fetchMarketItem.

У пользователя также есть собственная страница, где вы можете фильтровать по предметам, принадлежащим или выставленным на продажу, а также с опцией сортировки, как на домашней странице. Чтобы эта страница заработала, нам также пришлось внести небольшие изменения в исходный контракт, создав функцию для получения всех элементов от пользователя.

Заключение

Пожалуйста, найдите время, чтобы посмотреть на код и поиграть с ним. Создайте свою собственную версию торговой площадки, настройте контракт и добавьте дополнительные функции, так как это было сделано для вас, ребята, вступающих в мир web3. И не забудьте посмотреть оригинальный туториал от Nader Dabit по этой ссылке. Мы надеемся, что вам понравится это приложение, и нам не терпится увидеть, что вы сделаете с Meteor + web3 в будущем.