Skip to content

Instantly share code, notes, and snippets.

@dmitrymomot
Created December 3, 2021 13:53
Show Gist options
  • Select an option

  • Save dmitrymomot/5655df9fa4b7776f2f87de18ad4d7027 to your computer and use it in GitHub Desktop.

Select an option

Save dmitrymomot/5655df9fa4b7776f2f87de18ad4d7027 to your computer and use it in GitHub Desktop.

Revisions

  1. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -66,6 +66,6 @@ That JSON is the final place for information about your NFT. All the actual user

    ### Step 8: Display your snazzy NFT!

    I hope this was helpful! If you liked this guide, say hey on twitter!
    I hope this was helpful! If you liked this guide, say hey on Twitter!

    https://twitter.com/creativedrewy
  2. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 7 additions and 1 deletion.
    8 changes: 7 additions & 1 deletion MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -62,4 +62,10 @@ https://docs.metaplex.com/nft-standard#json-structure

    ### Step 7: Use the JSON data to disply

    That JSON is the final place for information about your NFT. All the actual user-relevant metadata is there, as well as links to the relevant asset file or files to display or render.
    That JSON is the final place for information about your NFT. All the actual user-relevant metadata is there, as well as links to the relevant asset file or files to display or render.

    ### Step 8: Display your snazzy NFT!

    I hope this was helpful! If you liked this guide, say hey on twitter!

    https://twitter.com/creativedrewy
  3. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,4 @@
    ## Steps for Metaplex NFT Display
    ## So you want to display a Metaplex NFT

    This guide will attempt to give an overview of the technical/coding steps that are required to render a Metaplex NFT with any programming language/platform. I'll attempt to write it a programming language-agnostic manner; you'll need to fill in the particular methods of performing the steps with your coding language of choice.

  4. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 8 additions and 2 deletions.
    10 changes: 8 additions & 2 deletions MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -54,6 +54,12 @@ https://github.com/metaplex-foundation/metaplex/blob/master/js/packages/common/s

    One of the child objects there, `Data`, has the specific property we are looking for: `uri`. That URI is the link to the Arweave JSON metadata file.

    ### Step 6: Parse the ERC1155 data
    ### Step 6: Parse the NFT JSON data

    As noted, the `uri` property points to an Arweave JSON file that is
    As noted, the `uri` property points to an Arweave JSON file that is formatted based on a common NFT JSON standard. I believe it is ERC721/ERC1155 format. The format is documented in detail here:

    https://docs.metaplex.com/nft-standard#json-structure

    ### Step 7: Use the JSON data to disply

    That JSON is the final place for information about your NFT. All the actual user-relevant metadata is there, as well as links to the relevant asset file or files to display or render.
  5. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 47 additions and 2 deletions.
    49 changes: 47 additions & 2 deletions MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -4,11 +4,56 @@ This guide will attempt to give an overview of the technical/coding steps that a

    For the purposes of discussion, we'll call the Solana account that holds the Metaplex NFTs the "NFT-Account."

    ### Step 1: Call getTokenAccountsByOwner, look filter to NFT Accounts
    ### Step 1: Call getTokenAccountsByOwner

    The first thing you need to do is call the ```getTokenAccountsByOwner``` JSON RPC method as documented here:

    https://docs.solana.com/developing/clients/jsonrpc-api#gettokenaccountsbyowner

    The first parameter you'll pass is of course the NFT-Account address. You'll also need to pass a ```programId``` argument with the Solana Token Program ID, which is `TokenkegQfeZyiNwAJbNbGKPFXCWuBvf9Ss623VQ5DA`
    The first parameter you'll pass is of course the NFT-Account address. You'll also need to pass a `programId` argument with the Solana Token Program ID, which is `TokenkegQfeZyiNwAJbNbGKPFXCWuBvf9Ss623VQ5DA`. I also recommend the `jsonParsed` argument at this point.

    Both the NFT-Account and Token program account need to be encoded as Base58.

    ### Step 2: Locate NFT Accounts

    From the list of accounts that you get back from the RPC call, you'll want to find NFT token accounts. For each account, you'll want to look in the `tokenAmount` data object/properties. You're looking for accounts with an `amount` of 1 and a `decimals` value of 0.

    ### Step 3: Derive PDAs for the NFT accounts

    The next step is to derive a Prorgram Derived Address for each NFT account address. PDAs are discussed here:

    https://docs.solana.com/developing/programming-model/calling-between-programs#program-derived-addresses

    The actual technical details of PDA generation is actually still something of a mystery even to me, so I can't explain the nitty gritty details on how or why they are generated. Suffice it to say that you need the PDA that is generated from the NFT token accounts to actually get the on-chain Metaplex NFT metadata. The best way to see how to generate a PDA is in the metaplex source, which you can find here:

    https://github.com/metaplex-foundation/metaplex/blob/master/js/packages/common/src/actions/metadata.ts#L536

    You'll need a few things to generate the PDA. The first is an array of "seeds," which includes:

    1. The Metaplex seed constant: `metadata`
    2. The metadata public key: `metaqbxxUerdq28cj1RbAWkYQm3ybzjb6a8bt518x1s`
    3. The NFT token account mint address, which is also returned from the RPC call.

    With that seed data, you can perform the `findProgramAddress` operation and that will result in a PDA account/address. Both data items 2 and 3 need to be Base58 encoded.

    ### Step 4: Call getAccountInfo for each PDA account

    For each PDA account address, you then need to call the `getAccountInfo` JSON RPC method:

    https://docs.solana.com/developing/clients/jsonrpc-api#getaccountinfo

    ### Step 5: Borsh deserialize the Metaplex meta

    For each account info object that you get back from the previous call, you will need to need to Borsh deserialize the `data` property in the resulting JSON. There are Borsh libraries for most programming languages which are listed here:

    https://github.com/near/borsh

    You will be deserializing the data property into a programming-language specific version of the Metadata object hierarchy. The Javascript version of that data is here:

    https://github.com/metaplex-foundation/metaplex/blob/master/js/packages/common/src/actions/metadata.ts#L224

    One of the child objects there, `Data`, has the specific property we are looking for: `uri`. That URI is the link to the Arweave JSON metadata file.

    ### Step 6: Parse the ERC1155 data

    As noted, the `uri` property points to an Arweave JSON file that is
  6. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 1 addition and 5 deletions.
    6 changes: 1 addition & 5 deletions MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -10,9 +10,5 @@ The first thing you need to do is call the ```getTokenAccountsByOwner``` JSON RP

    https://docs.solana.com/developing/clients/jsonrpc-api#gettokenaccountsbyowner






    The first parameter you'll pass is of course the NFT-Account address. You'll also need to pass a ```programId``` argument with the Solana Token Program ID, which is `TokenkegQfeZyiNwAJbNbGKPFXCWuBvf9Ss623VQ5DA`

  7. @creativedrewy creativedrewy revised this gist Sep 1, 2021. 1 changed file with 3 additions and 1 deletion.
    4 changes: 3 additions & 1 deletion MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -6,7 +6,9 @@ For the purposes of discussion, we'll call the Solana account that holds the Met

    ### Step 1: Call getTokenAccountsByOwner, look filter to NFT Accounts

    The first thing you need to do is call the ```getTokenAccountsByOwner``` JSON RPC method
    The first thing you need to do is call the ```getTokenAccountsByOwner``` JSON RPC method as documented here:

    https://docs.solana.com/developing/clients/jsonrpc-api#gettokenaccountsbyowner



  8. @creativedrewy creativedrewy created this gist Sep 1, 2021.
    16 changes: 16 additions & 0 deletions MetaplexDisplay.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    ## Steps for Metaplex NFT Display

    This guide will attempt to give an overview of the technical/coding steps that are required to render a Metaplex NFT with any programming language/platform. I'll attempt to write it a programming language-agnostic manner; you'll need to fill in the particular methods of performing the steps with your coding language of choice.

    For the purposes of discussion, we'll call the Solana account that holds the Metaplex NFTs the "NFT-Account."

    ### Step 1: Call getTokenAccountsByOwner, look filter to NFT Accounts

    The first thing you need to do is call the ```getTokenAccountsByOwner``` JSON RPC method