1
New to OnchainKit?
Follow the Getting Started guide to install the package.
2
Already using OnchainKit?
Update to the latest version and choose from the following steps: a React component approach, a React hook, or a pure TypeScript utility function.
React components with <Avatar>
and <Name>
Use the <Avatar>
and <Name>
components to display Basenames associated with Ethereum addresses.
The chain
prop is optional and setting to Base, it’s what makes the components switch from ENS to Basenames.
React hooks with useAvatar
and useName
Use the useAvatar
and useName
hooks to get Basenames associated with Ethereum addresses.
The hooks are incredibly useful for building custom components while leveraging OnchainKit for efficient data fetching.
Typescript utility with getAvatar
and getName
Use the getAvatar
and getName
functions to get Basenames associated with Ethereum addresses.
Being pure functions, it seamlessly integrates into any TypeScript project, including Vue, Angular, Svelte, or Node.js.