To experience Wormhole's Native Token Transfer (NTT) functionality, we can use the Wormhole Connect React component to easily integrate cross-chain asset transfer capabilities into your web application. Below are the steps for using Wormhole Connect to experience NTT functionality:

Clone the Example Project

Wormhole provides a sample project named demo-ntt-connect, which demonstrates how to integrate Wormhole Connect into a React application. First, clone the project to your local machine:

Install Dependencies

Once inside the project directory, install the required dependencies using the following commands:

Configure Wormhole Connect

In the src directory, locate the App.tsx file where you will need to configure Wormhole Connect to support NTT functionality. Specifically, you'll need to define the supported chains, tokens, and NTT routes.

Here is a completed configuration example:

Modify supported chains and tokens:

Next, modify the NTT token cross-chain routes, ensuring that the manager, token, and transceiver addresses match the NTT contracts you’ve deployed.

Modify token information: If there have been changes to your token address or symbol, update them here.

Run the Application

After the configuration is complete, you can start the application using the following commands:

Once the application is running, it will be hosted on a local server, and you can visit it in your browser to experience Wormhole's NTT functionality.

Example

Here is the App.tsx file from the project: