> For the complete documentation index, see [llms.txt](https://alephium-name-service.gitbook.io/ans/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://alephium-name-service.gitbook.io/ans/integration.md).

# Integration

## ANS SDK

Use the ANS SDK to integrate in your JS/TS projects.

{% embed url="<https://www.npmjs.com/package/@alph-name-service/ans-sdk>" %}

## Install

```
npm install @alph-name-service/ans-sdk
```

### Usage

```javascript
import { ANS } from "@alph-name-service/ans-sdk";

const ans = new ANS("mainnet");
const profile = await ans.getProfile("<address>");
// returns {name: "...", imgUri: "..."}
// if profile exists, undefined otherwise
const record = await ans.getRecord("<name>");
// returns {owner: ..., manager: ..., ttl: ...}
// if name exists, undefined otherwise
const resolvedAddress = await ans.resolveName("<name>");
// returns the resolved address string
// if name exists, undefined otherwise
```

If you want to integrate within a more involved use-case where you need to batch and get info for multiple addresses per request, feel free to reach out in Discord, Telegram or Twitter.

## React snippet example

```javascript
import { ANS } from "@alph-name-service/ans-sdk";

const [ansName, setAnsName] = useState<string>();
const [ansUri, setAnsUri] = useState<string>();

const fetchAnsProfile = async (address) => {
	try {
		const ans = new ANS('mainnet');
		const profile = await ans.getProfile(address);
		if (profile?.name) {
			setAnsName(profile.name);
		}
		if (profile?.imgUri) {
			setAnsUri(profile.imgUri);
		}
	} catch (error) {
		console.error('Error fetching ANS:', error);
	}
};

useEffect(() => {
	if (wallet?.account?.address) {
		fetchAnsProfile(wallet.account.address);
	}
}, [wallet?.account?.address]);
```