Implement NFTs in your React app

If you are developing an application with React, no matter which framework (Next.js, Remix, etc.) you're using, you can start implementing NFTs with our library.

📦 Installation

Add the @center-inc/react client library to your project.

$ yarn add @center-inc/react

⚙️ Set up the `<CenterProvider />` component

You should wrap your application with CenterProvider to be able to use NFT components and hooks as follows:

import { CenterProvider } from '@center-inc/react'

const Application = () => (
  return (
    <CenterProvider>
      {/* your application goes here */}
    </CenterProvider>
  )
)

You can configure the CenterProvider by passing in props, including:

network: The blockchain network on which you'd like to access NFTs.
mode: production or development.
apiKey: Your center API key.

<CenterProvider
  network="ethereum-mainnet"
  mode="production"
  apiKey="your_api_key"
/>

🖼 Access NFTs

Now, you're ready to use our components to render some NFTs! Here is a basic usage of the Asset component:

import { Asset } from '@center-inc/react'

const Page = () => (
  <Asset address="0xF4121a2880c225f90DC3B3466226908c9cB2b085" tokenId="3630" />
)

📦 Installation

⚙️ Set up the <CenterProvider /> component

🖼 Access NFTs

Check out some demos

⚙️ Set up the `<CenterProvider />` component