turinglabsorg / universal-mint-button

Sign in with Ethereum button allows web² website to use web³ functionalities with a simple and intuitive Javascript module.
3 stars 3 forks source link

Universal Mint Button

This is a super-simple method to add a minting interface in plain web2 websites (PHP, pure HTML etc). Don't worry if you don't have any skill, the script will do the magic for you.

How to use it

Add an input and a button as showed below:

<input type="number" id="amount-input" value="1">
<button id="um-button" network="polygon" method="buyNFT" price="50" amount="amount-input" infura="INFURA_KEY" contract="0x324ecF8184D84AD7b8687b2130eC82ac0D3af3ab">CONNECT WALLET</button>

Here you can see what's needed to fit into your contract (ask your web3 dev):

Then add you ABI (ask your web3 dev) inserting it in a constant like:

const ABI = [
    {
      "inputs": [],
      "name": "buyNFT",
      "outputs": [],
      "stateMutability": "payable",
      "type": "function",
      "payable": true
    }
]

And, at the end include the magic:

<script src="https://github.com/turinglabsorg/universal-mint-button/raw/master/umb.min.js"></script>

That's it! You can now interact with your smart contract!

Contribute

Want to understand how it works on background? Simply run:

npm run dev

or, if you want to build again:

npm run build

At the end of the process will be needed to fix some undefined issues, you can add trailing ? to be sure the code will not crash.