Niftory Docs
  • What is Niftory?
  • Get your API Keys
  • 👩‍💻API
    • Niftory Web3 API
    • SDK QuickStart
      • Using the SDK in React
      • Using the SDK from the Server
    • API Quickstart
      • Create your first Wallet
      • API calls with Sample Content
      • Mint your first NFT
    • API Cheat Sheet
    • Niftory Sample App
      • Explore the Sample App
      • Anatomy of a Niftory App
        • Getting Authenticated
        • GraphQL Client Setup
        • API Usage
        • Transfer an NFT
    • 💡Core Concepts
      • Niftory Data Model
      • Authentication
        • Using Your API Key
        • Configuring Your App
        • Privileged Authentication
      • App and AppUser
      • NFTs
        • Creating NFTs
        • Querying NFTs
        • Transferring NFTs
        • Minting NFTs
      • Wallets
        • Create a Niftory Wallet
        • Register External Wallets
        • Query Wallets
      • Contract
      • User Auth (Client-Side)
    • Your Niftory Account
  • 🧑‍💼Admin Portal
    • Niftory Admin Portal
    • 🚀Guides
      • Setting Up Your Org
      • Create Your First NFT
    • 🗺️Explore
      • Org and Apps
      • NFT Collection
        • Sets
        • Collectibles
        • NFTs
    • 💼Use Cases
      • For Engineers
      • For Designers
      • For Business Users
  • 📖Reference
    • GraphQL & Auth Endpoints
    • API Reference
    • SDK API Reference
Powered by GitBook
On this page
  • AppUser
  • NFTs
  • Wallets

Was this helpful?

  1. API
  2. Niftory Sample App
  3. Anatomy of a Niftory App

API Usage

PreviousGraphQL Client SetupNextTransfer an NFT

Last updated 1 year ago

Was this helpful?

Now we've set up the GraphQL client and authentication, let's explore the app and its use of the Niftory API surface to build these core capabilities:

  • User Profile: Get the Profile of the user (name, email, image, and etc). Performed via the . A deep dive on these queries is available in .

  • NFTs: Get all of NFTs that are available through your application, and all of the NFTs that belong to a user using the and queries respectively.

  • Wallets: for a new user, or query the user's wallet via the query.

AppUser

With your GraphQL client set up, every request you make to the Niftory API service will automatically contain the logged-in user's authentication token, and your app's API key. This allows the API service to implicitly infer the context of the caller.

For example, to get the AppUser object representing the currently logged-in user, you simply have to run the query, without any arguments!

const GET_APP_USER = gql`
  query {
    appUser {
      id
      name
      email
      image
      app {
        id
      }
      wallet {
        id
        address
        state
      }
    }
  }
`;

NFTs

Now for the fun part! Let's get some NFTs to display and transfer:

Querying Available NFTs

const GET_NFT_MODELS = gql`
  query {
    nftModels {
      id
      blockchainId
      title
      description
      quantity
      status
      rarity
      content {
        files {
          media {
            url
            contentType
          }
          thumbnail {
            url
            contentType
          }
        }
        poster {
          url
        }
      }
    }
  }
`;

Querying User's NFT Collection

const GET_USER_NFTs = gql`
  query {
    nfts {
      id
      model {
        id
        title
      }
    }
  }
`;

The sample app wraps all these queries in React Hooks; we'd recommend you to do the same to easily use these objects throughout your application.

The queries above don't query the blockchain directly. Instead, they query Niftory's database representation of the blockchain, which helps make them very fast, and allows non-blockchain data (such as not-yet-minted NFTModels) to be retrieved from the same API.

Wallets

Querying a Wallet

const GET_USER_WALLET = gql`
  query {
    wallet {
      id
      address
      state
      verificationCode
    }
  }
`;

Wallet Setup

const REGISTER_WALLET = gql`
  mutation ($address: String!) {
    registerWallet(address: $address) {
      id
      address
      verificationCode
      state
    }
  }
`;
const VERIFY_WALLET = gql`
  mutation ($address: String!, $signedVerificationCode: JSON!) {
    verifyWallet(
      address: $address
      signedVerificationCode: $signedVerificationCode
    ) {
      id
      address
      state
    }
  }
`;
const READY_WALLET = gql`
  mutation ($address: String!) {
    readyWallet(address: $address) {
      id
      address
      state
    }
  }
`;

We recommend wrapping your GraphQL queries in . For example, the above query can be part of a hook, so you can easily get the user context anywhere in your application.

Note that to actually create NFT content, use the -- the same place you got your API keys from. You can create your NFT collection there.

In order to display the NFT content available through your app, use the API. This query returns all the 's that you have marked as Available in the Admin Portal.

Recall that an NFTModel is basically a blueprint for an NFT -- it contains all the content and metadata that would get minted. You can limit the supply of NFTs for an NFTModel by setting its quantity appropriately (using the Admin Portal ).

While the query works without any arguments, you can optionally specify a (e.g. get only NFTs belonging to a particular )

Use the query to get NFT's belonging to the currently logged-in user. Like the nftModels query, you can also this query as needed (by particular NFTModel's, for example).

To get the currently logged-in user's Wallet simply call the query without any arguments:

The guide explains in detail how to setup a user's wallet, but the high level idea is this:

Call mutation to associate a Wallet address with an AppUser.

Call with a signed verification code (the verification code is returned by the registerWallet mutation).

Finally, call to mark the Wallet as initialized for your application.

👩‍💻
React Hooks
useUser
Niftory Admin Portal
nftModels
NFTModel
as follows
filter
Set
nfts
filter
wallet
Wallet Setup
registerWallet
verifyWallet
readyWallet
App and AppUser
appUser
AppUser queries
NFTModels
NFTs
Setup a wallet
Wallets