Build on FLOW | Learn FCL - 4. How to Resolve .find Identity Name to an Address
Tags: javascript, tutorial, flow, fcl
Published: 2022-05-31 20:33:02

## Overview

In this article, we will learn how we can use an existing deployed contract and interact with it. Interacting with existing contracts on-chain is an essential part of what makes Web3 special. 

In this specific tutorial, we will:

- Resolve a `.find` identity name to a corresponding Flow `0x` address (**.find** → **0x**)
- Lookup `.find` name(s) for a Flow `0x` address (**0x0 → .find**)

## Previously on “Learn FCL”

If you worked through one of our [previous posts ](https://dev.to/onflow/build-on-flow-learn-fcl-2-pass-arguments-to-scripts-393f)you should know how to pass arguments to Cadence scripts. We will need this knowledge as in this tutorial we will need to pass `String` and `Address` values.

Let’s begin! 💪

## Preparation

Whenever you want to interact with some deployed contract, you need to discover where it’s deployed first 😅. In our specific example, .find is a known service and with help of it’s creator [Bjarte](https://github.com/bjartek) we were able to lookup the address to GitHub repository at [https://github.com/findonflow/find](https://github.com/findonflow/find).

> 💡 **Pro Tip**: you can look up any contract you want, as long as you have a transaction hash or an account address that has interacted with a contract in the past. Just go through its history on [flowscan.org](https://flowscan.org/)!
> 

Back to .find! Digging through, you can find all the information you need inside of the [integration.md](https://github.com/findonflow/find/blob/main/integrating.md) file. Specifically, two blocks of Cadence code which we will use as our resolvers. This one for name to address lookup method:

```jsx
import FIND from 0x097bafa4e0b48eef

pub fun main(name: String): Address?{
  return FIND.lookupAddress(name)
}
```

And another one for a reverse process:

```jsx
import FIND from 0x097bafa4e0b48eef

pub fun main(address: Address) : String?{
  return FIND.reverseLookup(address)
}
```

### Step 1 - Installation

Add `"@onflow/fcl": "1.0.0"` as your dependency

### Step 2 - Setup

Just like the last time we will import necessary methods and setup FCL:

```jsx
// Import methods from FCL
import { query, config } from "@onflow/fcl";

// Specify the API endpoint - this time we will use Mainnet
const api = "https://rest-mainnet.onflow.org";

// Configure FCL to use testnet as the access node
config().put("accessNode.api", api);
```

### Step 3 - Resolve Identity Name to Address

Now let’s create a function called `resolveName` . This function will accept a string, pass it to the network alongside our resolver code and then print out the result:

```jsx
const resolveName = async (name) => {
  // The Cadence code we can get from "resolve.cdc" script:
  // https://github.com/findonflow/find/blob/main/scripts/resolve.cdc
  // .find contract deployed on Flow Mainnet at "0x097bafa4e0b48eef"
  // we will use this address in the import statement
  const cadence = `
    import FIND from 0x097bafa4e0b48eef

    pub fun main(name: String): Address?{
      return FIND.lookupAddress(name) // we'll use .find's native lookupAddress method.
    }
  `;

  const args = (arg, t) => [arg(name, t.String)];

  // "query" is used for read-only operations on chain.
  // read more about the "query" method on Flow Docs Site:
  // https://docs.onflow.org/fcl/reference/api/#query
  const address = await query({ cadence, args });

  console.log(
    `${name} identity has address %c${address}`,
    "color: #36ad68; font-weight: bold"
  );
};
```

### Step 4 - Resolve Address to an Identity Alias

Let’s do something similar to reverse the process. We’ll create a function named `resolveAddress` that accepts the address passed as a string.

```jsx
const resolveAddress = async (address) => {
  // The Cadence code to resolve address to an Address we can get from "name.cdc" script:
  // https://github.com/findonflow/find/blob/main/scripts/name.cdc
  // .find contract deployed on Flow Mainnet at "0x097bafa4e0b48eef" - we will use that address in import statement
  const cadence = `
    import FIND from 0x097bafa4e0b48eef

    pub fun main(address: Address) : String?{
      return FIND.reverseLookup(address) // notice the new function
    }
  `;

  const args = (arg, t) => [arg(address, t.Address)];

  // "query" will pass Cadence code to access node for execution and return us a result:
  // read more about "query" method on Flow Docs Site:
  // https://docs.onflow.org/fcl/reference/api/#query
  const name = await query({ cadence, args });

  console.log(
    `${address} address is aliased to %c${name}`,
    "color: #36ad68; font-weight: bold"
  );
};
```

### Finally

Let's call the functions we created at the end of the file using some test parameters. 

> ❕**Note:** *We are calling those methods inside of an [IIFE](https://developer.mozilla.org/en-US/docs/Glossary/IIFE) for simplicity. One can imagine running those on a button click or as a part of more complex procedure.*
> 

```jsx
(async () => {
  console.clear();
	// Bjarte S. Karlsen is of the original creators of .find and one of the best pillars of Flow Community - https://github.com/bjartek
  await resolveName("bjartek");
	await resovleAddress("0x886f3aeaf848c535");
})();
```

Running this code should result in the following output to the console:

```jsx
bjartek identity has address 0x886f3aeaf848c535
0x886f3aeaf848c535 address is aliased to bjartek
```

The full code could be found on Codesandbox here:
[https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e](https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e?file=/src/index.js)

Until next time! 👋

## Resources

- **Example code**: [https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e](https://codesandbox.io/s/dev-to-fcl-resolve-find-name-9tbo8e?file=/src/index.js)
- **Cadence Imports** - [https://docs.onflow.org/cadence/language/imports/](https://docs.onflow.org/cadence/language/imports/) - docs for import declarations in Cadence
- **.find GitHub Repository** - [https://github.com/findonflow/find](https://github.com/findonflow/find) - full source code and documentation for .find platform

Other resources you might find useful:

- **Flow Docs Site** - [https://docs.onflow.org/](https://docs.onflow.org/) - More detailed information about Flow blockchain and how to interact with it
- **Flow Portal** - [https://flow.com/](https://flow.com/) - your entry point to Flow
- **FCL JS** - [https://github.com/onflow/fcl-js](https://github.com/onflow/fcl-js) - Source code and ability to contribute to the FCL JS library
- **Cadence** - [https://docs.onflow.org/cadence/](https://docs.onflow.org/cadence/) - Introduction to Cadence
- **Codesandbox** - [https://codesandbox.io](https://codesandbox.io/) - An amazing in-browser IDE enabling quick prototyping