Code

DistroToken - NFT Minter In React

DistroToken - NFT Minter In React

Cart 132 sales

Introduction

This react web app and template is perfect for anyone looking to quickly set-up a system to mint NFTs with their desired metadata. Included in this purchase is the web template of the DistroToken website and the React NFT Minter app. Our NFT Minter uses web3 technologies in order to interact with MetaMask and call smart contract options from our frontend. This Minter creates a Non-fungible token with specified metadata.

IMPORTANT NOTE

This purchase uses our custom DistroToken (DTKN) smart contract. It’s a simple contract with one function , to mint an NFT. We use the ERC721 token standard. You can publish your own with whichever other functions you would like and have this web-app interact with it. The DistroToken smart contract is published on the Ethereum main net so you will not need incur any gas fees deploying the contract.

  1. Key Features
  • Ready To Go Landing Pages
  • Customisable NFT Minter ( Our documentation walks you through using your own metadata )
  • Integration With Thee Piñata IPFS System For Decentralised Asset Hosting
  • Firebase Integration For File Hosting

  1. 1.) Mint Token Page
  • Button To Connect To MetaMask
  • Form Setup To Capture Metadata
  • Button To Mint A NFT On Our DistroToken Smart Contract Using Metadata From Our Form

  1. 2.) Upload Artwork Page
  • Part Of Your Metadata May Be A Form Of Media , as non-fungible tokens can only contain text/numbers you require a hosting service.
  • As NFTs Are Decentralised We Would Also Want Our Media Hosted In a Decentralised Manner. This is why we use Piñata.
  • You Can Select A File To Upload And Have It Hosted On The Decentralised Interplanetary File System Of Piñata
  • You Receive The Link As Well

  1. 2.) Upload Audio Page
  • As The Piñata IPFS System Can Only Handle Graphical Media Such As Photos And Videos , We Require Another Hosting Service For All Else.
  • I Use Firebase
  • Simple Firebase Hosting Setup To Allow A User To Upload A Media File And Receive A Direct Link In Return.
  • Select A File , See The Upload Progress And Once Completed , Receive The Link Automatically
  1. WHAT YOU RECEIVE
  • The Full Landing Page Web App Of DistroToken
  • The Full Source Code To The Entire React NFT Minter App
  • Extremely Intricate Documentation Showing You How Re-purpose The Entire App

QUICK & EASY DEPLOY FOR FIREBASE IF YOU WANT TO USE FIREBASE (AFTER READING INCLUDED INSTRUCTIONS , YOU CAN FOLLOW THIS GUIDE TO DEPLOY )

https://dzone.com/articles/react-apps-firebase

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey