<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: zachrosen</title>
    <description>The latest articles on DEV Community by zachrosen (@zachrosen).</description>
    <link>https://dev.to/zachrosen</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F871052%2F87c98435-8324-4eae-b370-637ad0c6274f.png</url>
      <title>DEV Community: zachrosen</title>
      <link>https://dev.to/zachrosen</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/zachrosen"/>
    <language>en</language>
    <item>
      <title>ChatGPT x Crypto</title>
      <dc:creator>zachrosen</dc:creator>
      <pubDate>Mon, 16 Jan 2023 20:39:23 +0000</pubDate>
      <link>https://dev.to/zachrosen/chatgpt-x-crypto-pdb</link>
      <guid>https://dev.to/zachrosen/chatgpt-x-crypto-pdb</guid>
      <description>&lt;p&gt;ChatGPT has become our default coding + research intern at &lt;a href="https://brydge.network" rel="noopener noreferrer"&gt;Brydge&lt;/a&gt;. But, it’s super limited in crypto because it was trained in 2021. Quite a bit has changed since then!&lt;/p&gt;

&lt;p&gt;We’re constantly running into queries we need to run like:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;em&gt;Which blockchains is CRV deployed on?&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;What is SushiSwap’s router address?&lt;/em&gt;&lt;/li&gt;
&lt;li&gt;&lt;em&gt;What’s Optimism’s TVL?&lt;/em&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;ChatGPT has access to some of this data (everything pre mid 2021 aka a lifetime ago), but fails at the rest.&lt;/p&gt;

&lt;p&gt;Good news: all of this info is publicly available (usually with ~5min of Googling).&lt;/p&gt;

&lt;p&gt;Bad news: 5min/question adds up quickly.&lt;/p&gt;

&lt;p&gt;So, we built a chatGPT bot that combines current web data with chatGPT to make it usable in crypto. Our primary production use is for custom token descriptions (&lt;a href="https://www.brydge.network/buy/dai-on-ethereum" rel="noopener noreferrer"&gt;example here&lt;/a&gt;) so we can give our users more insight into the tokens they’re purchasing. But, the bot is infinitely customizable to meet anyone’s needs. We’ll expand it to our inner wiki-bot soon.&lt;/p&gt;

&lt;p&gt;How the description bot works:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Takes in &lt;code&gt;protocolName&lt;/code&gt; and &lt;code&gt;tokenName&lt;/code&gt;
-- Ex) Curve DAO and CRV&lt;/li&gt;
&lt;li&gt;Runs search query “&lt;code&gt;tokenName&lt;/code&gt; crypto description”&lt;/li&gt;
&lt;li&gt;Scrape first 3 search results’ content&lt;/li&gt;
&lt;li&gt;Runs chatGPT query for “write an article on &lt;code&gt;protocolName&lt;/code&gt; and the &lt;code&gt;tokenName&lt;/code&gt; token”&lt;/li&gt;
&lt;li&gt;Returns &lt;code&gt;tokenDescription&lt;/code&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;We’ve open sourced the bot &lt;a href="https://github.com/brydge-network/chat-gpt-website-descriptions" rel="noopener noreferrer"&gt;here&lt;/a&gt; (it’s free to run—you just need an OpenAI session key). Pull requests + feedback are welcome!&lt;/p&gt;

&lt;p&gt;PS—we’re still tuning the descriptions—they’re sometimes a little wonky with niche tokens. Let us know in our &lt;a href="https://discord.gg/QUcbrchsfd" rel="noopener noreferrer"&gt;Discord&lt;/a&gt; if anything looks a little off!&lt;/p&gt;

</description>
      <category>learning</category>
      <category>beginners</category>
      <category>discuss</category>
      <category>career</category>
    </item>
    <item>
      <title>A Beginner's Guide to Creating Your First NFT Minting dApp</title>
      <dc:creator>zachrosen</dc:creator>
      <pubDate>Wed, 01 Jun 2022 14:17:21 +0000</pubDate>
      <link>https://dev.to/zachrosen/a-beginners-guide-to-creating-your-first-nft-minting-dapp-15e0</link>
      <guid>https://dev.to/zachrosen/a-beginners-guide-to-creating-your-first-nft-minting-dapp-15e0</guid>
      <description>&lt;p&gt;Hey there!&lt;/p&gt;

&lt;p&gt;Want to launch your first mintable NFT collection? Sweet, this guide is for you!&lt;br&gt;
Our goal today is to get you up-and-running with a production-ready NFT minting dApp within an hour.&lt;/p&gt;

&lt;p&gt;Formatting here gets janky, so you can view the pretty version &lt;a href="https://www.brydge.network/blog/a-beginners-guide-to-creating-your-first-nft-minting-dapp"&gt;here&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Let’s get started by cloning our starter code. Open a fresh folder and run the following in your terminal:&lt;br&gt;
git clone &lt;a href="https://github.com/brydge-network/full-stack-nft-mint-tutorial.git"&gt;https://github.com/brydge-network/full-stack-nft-mint-tutorial.git&lt;/a&gt;&lt;br&gt;
cd full-stack-nft-mint-tutorial&lt;/p&gt;

&lt;p&gt;Styling isn’t the focus of our tutorial—we’re more interested in building smart contracts and triggering them. The starter code kicks us off with some cool CSS stuff we’ll use later to make our dApp’s UI look pretty.&lt;br&gt;
Now, time for some contracts!&lt;br&gt;
From here on out, we’ll assume that you’re in the full-stack-nft-mint-tutorial folder.&lt;br&gt;
Run the following in terminal:&lt;br&gt;
brownie init&lt;/p&gt;

&lt;p&gt;This scaffolds out our back end structure for us.&lt;br&gt;
Now, create a file called brownie-config.yaml in your root and paste the following:&lt;br&gt;
dotenv: .env&lt;br&gt;
dependencies:&lt;br&gt;
    - smartcontractkit/&lt;a href="mailto:chainlink-brownie-contracts@0.4.0"&gt;chainlink-brownie-contracts@0.4.0&lt;/a&gt;&lt;br&gt;
    - OpenZeppelin/&lt;a href="mailto:openzeppelin-contracts@4.5.0"&gt;openzeppelin-contracts@4.5.0&lt;/a&gt;&lt;br&gt;
compiler:&lt;br&gt;
    solc:&lt;br&gt;
       remappings:&lt;br&gt;
           - '@chainlink=smartcontractkit/&lt;a href="mailto:chainlink-brownie-contracts@0.4.0"&gt;chainlink-brownie-contracts@0.4.0&lt;/a&gt;'&lt;br&gt;
           - '@openzeppelin=OpenZeppelin/&lt;a href="mailto:openzeppelin-contracts@4.5.0"&gt;openzeppelin-contracts@4.5.0&lt;/a&gt;'&lt;br&gt;
wallets:&lt;br&gt;
    from_key: ${PRIVATE_KEY}&lt;/p&gt;

&lt;p&gt;Important parts here are noting our .env file (where we keep sensitive information) and from_key (the wallet we’ll use to deploy our NFTs).&lt;br&gt;
Next, create an .env file in root and paste the following. You can export your private key from MetaMask (use a separate dev wallet!) and get an Infura key for free here. We can leave the rest blank for now&lt;br&gt;
PRIVATE_KEY = ""&lt;br&gt;
WEB3_INFURA_PROJECT_ID=''&lt;br&gt;
ETHERSCAN_CONTRACT_ADDR=''&lt;br&gt;
PINATA_API_KEY=''&lt;br&gt;
PINATA_API_SECRET=''&lt;br&gt;
ETHERSCAN_TOKEN=''&lt;/p&gt;

&lt;p&gt;It’s (finally!) smart contract time. Create a file called BrydgeCollection.sol in /contracts and paste in the following code:&lt;br&gt;
// SPDX-License-Identifier: MIT&lt;br&gt;
pragma solidity ^0.8.0;&lt;br&gt;
import '@openzeppelin/contracts/token/ERC721/extensions/ERC721URIStorage.sol';&lt;br&gt;
import '@openzeppelin/contracts/token/ERC721/ERC721.sol';&lt;/p&gt;

&lt;p&gt;contract BrydgeCollection is ERC721URIStorage {&lt;br&gt;
  uint256 public tokenCounter;&lt;br&gt;
  //set price to 0.001 native&lt;br&gt;
  uint256 price = 1000000000000000;&lt;/p&gt;

&lt;p&gt;constructor() public ERC721('Brydge Tutorial NFTs', 'BRYDGE') {&lt;br&gt;
    tokenCounter = 0;&lt;br&gt;
  }&lt;/p&gt;

&lt;p&gt;function mintBrydgeNFT(string memory tokenURI) public payable returns (bytes32) {&lt;br&gt;
    require(msg.value &amp;gt;= price, "Send more tokens next time!");&lt;br&gt;
    require(tokenCounter &amp;lt; 100, 'Max number of tokens reached');&lt;br&gt;
    uint256 tokenId = tokenCounter;&lt;br&gt;
    _safeMint(msg.sender, tokenId);&lt;br&gt;
    _setTokenURI(tokenId, tokenURI);&lt;br&gt;
    tokenCounter++;&lt;br&gt;
  }&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;Our NFT contract is super simple. We define our collection name (BrydgeCollection) and set a price to mint. We then set tokenCounter to zero at inception, since we haven’t minted any NFTs yet.&lt;br&gt;
We then expose 1 function to the world: mintBrydgeNFT(). This function takes in a tokenURI (we’ll get to this later) and tokens. If too few tokens are paid, or this contract has already minted 100 NFTs, the transaction fails. Otherwise, it mints a fresh NFT and sends it to the buyer.&lt;br&gt;
Next, we need to compile our contract into machine-readable language. Run the following in your root terminal:&lt;br&gt;
brownie compile&lt;/p&gt;

&lt;p&gt;Let’s now deploy our NFTs. Create a file called deploy_nft.py in /scripts and paste in the following:&lt;br&gt;
from brownie import BrydgeCollection, accounts, config&lt;/p&gt;

&lt;p&gt;def main():&lt;br&gt;
    dev = accounts.add(config['wallets']['from_key'])&lt;br&gt;
    BrydgeCollection.deploy(&lt;br&gt;
        {'from': dev}&lt;br&gt;
    )&lt;/p&gt;

&lt;p&gt;This is as simple as can be. We set the “from” wallet to ours. We then deploy BrydgeCollection.&lt;br&gt;
Next, run the following in your root terminal to deploy! We’re deploying on Rinkeby testnet, so head over to the free Rinkeby faucet to get yourself some test ETH to pay deployment gas costs.&lt;br&gt;
brownie run scripts/deploy_nft.py --network rinkeby&lt;/p&gt;

&lt;p&gt;If all goes well, we’ll get the following in our terminal.&lt;br&gt;
published&lt;/p&gt;

&lt;p&gt;Screen Shot 2022-05-31 at 10.34.29 PM&lt;/p&gt;

&lt;p&gt;Copy your deployment address and paste it into search bar in &lt;a href="https://rinkeby.etherscan.io/"&gt;https://rinkeby.etherscan.io/&lt;/a&gt;. Boom! We have liftoff!&lt;br&gt;
Now, create an “images” folder in root and add a few images that you want to immortalize. Call them 1.jpg, 2.jpg, 3.jpg for now to keep things simple. Your file structure will look like this&lt;br&gt;
-build&lt;br&gt;
-images&lt;br&gt;
—---1.jpg&lt;br&gt;
—---2.jpg&lt;br&gt;
—---3.jpg&lt;br&gt;
-.env&lt;br&gt;
-client&lt;br&gt;
...&lt;/p&gt;

&lt;p&gt;Now, let’s fill out more of our .env. Grab a free API key and secret from Pinata, paste into the proper spots.&lt;br&gt;
Next, create a /metadata folder in your root. This will store our precious NFT data temporarily.&lt;br&gt;
Now, create a file called create_collection_data.py in /scripts and paste the following code:&lt;br&gt;
import requests&lt;br&gt;
import os&lt;br&gt;
import json&lt;br&gt;
from brownie import BrydgeCollection&lt;/p&gt;

&lt;p&gt;metadata_template = {&lt;br&gt;
    "name": "",&lt;br&gt;
    "description": "",&lt;br&gt;
    "image": ""&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;def main():&lt;br&gt;
    # gets our most recent NFT deployment&lt;br&gt;
    brydge_collection = BrydgeCollection[-1]&lt;br&gt;
    existing_tokens = brydge_collection.tokenCounter()&lt;br&gt;
    #however many nfts we want to deploy&lt;br&gt;
    meta_data_hashes = write_metadata(3)&lt;/p&gt;

&lt;p&gt;def write_metadata(num_tokens):&lt;br&gt;
    # We'll use this array to store the hashes of the metadata&lt;br&gt;
    meta_data_hashes = []&lt;br&gt;
    for token_id in range(num_tokens):&lt;br&gt;
        collectible_metadata = metadata_template.copy()&lt;br&gt;
        # The filename where we're going to locally store the metadata&lt;br&gt;
        meta_data_filename = f"metadata/{token_id + 1}.json"&lt;br&gt;
        # Name of the collectible set to its token id&lt;br&gt;
        collectible_metadata["name"] = str(token_id)&lt;br&gt;
        # Description of the NFT&lt;br&gt;
        collectible_metadata["description"] = f"Brydge NFT #{token_id}"&lt;br&gt;
        # Path of the artwork to be uploaded to IPFS&lt;br&gt;
        img_path = f"images/{token_id + 1}.jpg"&lt;br&gt;
        with open(img_path, "rb") as f:&lt;br&gt;
            img_binary = f.read()&lt;br&gt;
        # Upload the image to IPFS and get the storage address&lt;br&gt;
        image = upload_to_ipfs(img_binary)&lt;br&gt;
        # Add the image URI to the metadata&lt;br&gt;
        image_path = f"&lt;a href="https://ipfs.io/ipfs/%7Bimage%7D"&gt;https://ipfs.io/ipfs/{image}&lt;/a&gt;"&lt;br&gt;
        collectible_metadata["image"] = image_path&lt;br&gt;
        with open(meta_data_filename, "w") as f:&lt;br&gt;
            # Write the metadata locally&lt;br&gt;
            json.dump(collectible_metadata, f)&lt;br&gt;
        # Upload our metadata to IPFS&lt;br&gt;
        print('collectible', collectible_metadata)&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;    meta_data_hash = upload_to_ipfs(collectible_metadata['image'])
    print('metadata hash', meta_data_hash)
    meta_data_path = f"&amp;lt;https://ipfs.io/ipfs/{meta_data_hash}&amp;gt;"
    # Add the metadata URI to the array
    meta_data_hashes.append(meta_data_path)
with open('metadata/data.json', 'w') as f:
    # Finally, we'll write the array of metadata URIs to a file
    json.dump(meta_data_hashes, f)
return meta_data_hashes
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;def upload_to_ipfs(data):&lt;br&gt;
    # Get our Pinata credentials from our .env file&lt;br&gt;
    pinata_api_key = os.environ["PINATA_API_KEY"]&lt;br&gt;
    pinata_api_secret = os.environ["PINATA_API_SECRET"]&lt;br&gt;
    endpoint = "&lt;a href="https://api.pinata.cloud/pinning/pinFileToIPFS"&gt;https://api.pinata.cloud/pinning/pinFileToIPFS&lt;/a&gt;"&lt;br&gt;
    headers = {&lt;br&gt;
        'pinata_api_key': pinata_api_key,&lt;br&gt;
        'pinata_secret_api_key': pinata_api_secret&lt;br&gt;
    }&lt;br&gt;
    body = {&lt;br&gt;
        'file': data&lt;br&gt;
    }&lt;br&gt;
    # Make the pin request to Pinata&lt;br&gt;
    response = requests.post(endpoint, headers=headers, files=body)&lt;br&gt;
    # Return the IPFS hash where the data is stored&lt;br&gt;
    return response.json()["IpfsHash"]&lt;/p&gt;

&lt;p&gt;We first set a template object called metadata_template to standardize how we want to store each NFT’s metadata.&lt;br&gt;
Our main() function kicks off our script by calling write_metadata() with the number of NFTs we want to deploy passed in. This number corresponds to the number of photos you have in /images.&lt;br&gt;
write_metadata() then fills in the metadata_template for each NFT we’re deploying and calls upload_to_ipfs() to write that object to IPFS (our online file storage system that’s a decentralized version of AWS).&lt;br&gt;
Now, let’s run the following command in our root terminal to pin our NFT images to IPFS:&lt;br&gt;
brownie run scripts/create_collection_data.py --network rinkeby&lt;/p&gt;

&lt;p&gt;This populates /metadata with our image data. Take a quick look to view your work!&lt;br&gt;
We’re now done with the back end, let’s take a look at front end in /client. Shoutout to Abhinav for creating most of the front end scaffolding we’ll use.&lt;br&gt;
Run the following in your root terminal. This enters our separate front end folder (called client) that came with our starter code, installs our dependencies, and spins up a local developer environment.&lt;br&gt;
cd client&lt;br&gt;
npm install&lt;br&gt;
npm run dev&lt;/p&gt;

&lt;p&gt;Remember that NFT deployment address we saved? Drop that into /client/config.js&lt;br&gt;
export const nftContractAddress = 'YourDeployedNFTContractAddress'&lt;/p&gt;

&lt;p&gt;Replace contents of /client/pages/index.js with the following:&lt;br&gt;
import { useState } from 'react'&lt;br&gt;
import { nftContractAddress } from '../config.js'&lt;br&gt;
import { ethers } from 'ethers'&lt;br&gt;
import axios from 'axios'&lt;/p&gt;

&lt;p&gt;import NFT from '../../build/contracts/BrydgeCollection.json'&lt;br&gt;
import uriList from '../../metadata/data.json'&lt;/p&gt;

&lt;p&gt;const MintPage = () =&amp;gt; {&lt;br&gt;
    // Hooks that render data once variables are set&lt;br&gt;
    const [mintedNFT, setMintedNFT] = useState(null)&lt;br&gt;
    const [miningStatus, setMiningStatus] = useState(null)&lt;br&gt;
    const [currentAccount, setCurrentAccount] = useState('')&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// Calls Metamask to connect wallet on clicking Connect Wallet button
const connectWallet = async () =&amp;gt; {
    try {
        const { ethereum } = window

        if (!ethereum) {
            console.log('Metamask not detected')
            return
        }
        let chainId = await ethereum.request({ method: 'eth_chainId' })
        console.log('Connected to chain:' + chainId)

        const rinkebyChainId = '0x4'

        const devChainId = 1337
        const localhostChainId = `0x${Number(devChainId).toString(16)}`

        if (chainId !== rinkebyChainId &amp;amp;&amp;amp; chainId !== localhostChainId) {
            alert('You are not connected to the Rinkeby Testnet!')
            return
        }

        const accounts = await ethereum.request({ method: 'eth_requestAccounts' })

        console.log('Found account', accounts[0])
        setCurrentAccount(accounts[0])
    } catch (error) {
        console.log('Error connecting to metamask', error)
    }
}

// Creates transaction to mint NFT on clicking Mint button
const mintNFT = async () =&amp;gt; {
    try {
        const { ethereum } = window

        if (ethereum) {
            const provider = new ethers.providers.Web3Provider(ethereum)
            const signer = provider.getSigner()
            const nftContract = new ethers.Contract(
                nftContractAddress,
                NFT.abi,
                signer
            )
            // let nftTx = await nftContract.createEternalNFT()
            let nftId = await nftContract.tokenCounter()
            nftId = await nftId.toNumber()
            console.log('about to mint Brydge NFT #', nftId)
            const nftUri = uriList[nftId]
            // const nftUri = uriList[0]
            console.log(nftUri)
            let nftTx = await nftContract.mintBrydgeNFT(nftUri, { value: ethers.utils.parseEther("0.001") })
            console.log('Mining....', nftTx.hash)
            setMiningStatus(0)

            let tx = await nftTx.wait()
            console.log('Mined!', tx)

            console.log(
                `Mined, see transaction: &amp;lt;https://rinkeby.etherscan.io/tx/${nftTx.hash}`&amp;gt;
            )

            getMintedNFT(nftId)
        } else {
            console.log("Ethereum object doesn't exist!")
        }
    } catch (error) {
        console.log('Error minting NFT', error)
    }
}

// Gets the minted NFT data
const getMintedNFT = async (nftId) =&amp;gt; {
    try {
        const { ethereum } = window

        if (ethereum) {
            const provider = new ethers.providers.Web3Provider(ethereum)
            const signer = provider.getSigner()
            const nftContract = new ethers.Contract(
                nftContractAddress,
                NFT.abi,
                signer
            )
        //token uri is a storing of our nft's data in machine-readable format
            let tokenUri = await nftContract.tokenURI(nftId)
            let data = await axios.get(tokenUri)
            let image = data.data

            setMiningStatus(1)
            setMintedNFT(image)
        } else {
            console.log("Ethereum object doesn't exist!")
        }
    } catch (error) {
        console.log(error)
    }
}

return (
    &amp;lt;div className='flex flex-col items-center pt-32 bg-[#0B132B] text-[#d3d3d3] min-h-screen'&amp;gt;
        &amp;lt;div className='trasition hover:rotate-180 hover:scale-105 transition duration-500 ease-in-out'&amp;gt;
            &amp;lt;svg
                xmlns='&amp;lt;http://www.w3.org/2000/svg&amp;gt;'
                width='60'
                height='60'
                fill='currentColor'
                viewBox='0 0 16 16'
            &amp;gt;
                &amp;lt;path d='M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5 8 5.961 14.154 3.5 8.186 1.113zM15 4.239l-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923l6.5 2.6zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0L.63 13.09a1 1 0 0 1-.63-.928V3.5a.5.5 0 0 1 .314-.464L7.443.184z' /&amp;gt;
            &amp;lt;/svg&amp;gt;
        &amp;lt;/div&amp;gt;
        &amp;lt;h2 className='text-3xl font-bold mb-20 mt-12'&amp;gt;
            Mint Brydge NFT
        &amp;lt;/h2&amp;gt;
        {currentAccount === '' ? (
            &amp;lt;button
                className='text-2xl font-bold py-3 px-12 bg-black shadow-lg shadow-[#6FFFE9] rounded-lg mb-10 hover:scale-105 transition duration-500 ease-in-out'
                onClick={connectWallet}
            &amp;gt;
                Connect Wallet
            &amp;lt;/button&amp;gt;
        ) : (
            &amp;lt;button
                className='text-2xl font-bold py-3 px-12 bg-black shadow-lg shadow-[#6FFFE9] rounded-lg mb-10 hover:scale-105 transition duration-500 ease-in-out'
                onClick={mintNFT}
            &amp;gt;
                Mint Brydge NFT for 0.001 ETH
            &amp;lt;/button&amp;gt;
        )}
        {miningStatus === 1 ? (
            &amp;lt;img
            src={mintedNFT}
            alt=''
            className='h-60 w-60 rounded-lg shadow-2xl shadow-[#6FFFE9] hover:scale-105 transition duration-500 ease-in-out'
        /&amp;gt;
        ) : (
            &amp;lt;div&amp;gt;&amp;lt;/div&amp;gt;
        )}
    &amp;lt;/div&amp;gt;
)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;}&lt;/p&gt;

&lt;p&gt;export default MintPage&lt;/p&gt;

&lt;p&gt;Here, we define our React component called MintPage and add a few functions triggered on button click.&lt;br&gt;
We then add some HTML in the return() statement. We’ll see that we check if the user is signed in via Metamask. If not, we’ll show a button for the user to connect their wallet. If so, we’ll allow the user to mint our NFT.&lt;br&gt;
We then have a final check to see if our transaction has been submitted and confirmed on the blockchain (mined). If this is true, we’ll show an image of the NFT we just minted. If not, we’ll show nothing.&lt;br&gt;
Save the file, then head to localhost:3000 in your browser and you’ll see our minting UI.&lt;br&gt;
Click “Connect Wallet” button to connect your MetaMask. Switch to Rinkeby, since that’s where we deployed!&lt;br&gt;
Right click in your browser, click “Inspect”, then click the “Console” tab so we can see some information being logged.&lt;br&gt;
If you’re using the same wallet to mint that you deployed with, you can now click the “Mint” button and watch the magic happen. If not, head back to to &lt;a href="https://rinkebyfaucet.com/"&gt;https://rinkebyfaucet.com/&lt;/a&gt; to get some more Rinkeby ETH.&lt;br&gt;
Once your transaction is confirmed on the Blockchain, you’ll see your NFT-ified image pop up. Mint again and you’ll see the next NFT in your collection. Check your wallet transaction history on the Rinkeby block explorer and you’ll see each action confirmed on the blockchain.&lt;br&gt;
Want to deploy on a live network so real people can buy + mint your work? Add some real MATIC to your wallet via the free Polygon faucet, run the following in your terminal in /client.&lt;br&gt;
cd ..&lt;br&gt;
brownie run scripts/deploy_nft.py --network polygon-mainnet&lt;br&gt;
brownie run scripts/create_collection_data.py --network polygon-mainnet&lt;/p&gt;

&lt;p&gt;And that’s a wrap! You’ve deployed a full-stack NFT minting application on both testnet and mainnet.&lt;br&gt;
This tutorial gets you up-and-running with a collection mintable using the native token on one chain (ETH on Ethereum / Rinkeby and MATIC on Polygon). Each chain brings about pros and cons:&lt;br&gt;
Ethereum&lt;/p&gt;

&lt;p&gt;Pros: largest potential customer base + easiest onboarding&lt;br&gt;
Cons: super expensive to deploy ($200+) and mint ($50+) NFTs&lt;/p&gt;

&lt;p&gt;Polygon&lt;/p&gt;

&lt;p&gt;Pros: &amp;lt;$0.01 transaction fees&lt;br&gt;
Cons: users have to bridge tokens from Ethereum —&amp;gt; Polygon before using your dApp&lt;/p&gt;

&lt;p&gt;Brydge provides the best of both worlds, enabling you to deploy on one chain and instantly accept any token from the rest!&lt;br&gt;
So, you can deploy on Polygon to take advantage of sub-1 cent deployment costs and user transaction fees, while seamlessly accepting payments from users on Ethereum. Plus, you can instantly accept USDC, LINK, DAI, and thousands of other tokens without redeploying your contracts!&lt;br&gt;
Learn more at &lt;a href="http://www.brydge.network"&gt;www.brydge.network&lt;/a&gt; and view SDK documentation here.&lt;br&gt;
We’re always here to help in our Discord!&lt;/p&gt;

</description>
      <category>nft</category>
      <category>tutorial</category>
      <category>python</category>
      <category>react</category>
    </item>
  </channel>
</rss>
