This guide will walk you through quickly setting up crosschain transfers from the Ethereum Goerli Testnet to the Matic Mumbai Testnet in a browser dApp.
The fastest way to set up crosschain transfers is to use the @connext/vector-modal widget, a drop-in React Component that packages up the whole flow for the user.
We assume that you already have nodejs and npm installed, and have a simple react app set up that you can use to test with.
If you don't have an app set up, we recommend forking the spacefold repo to get started.
You can install the widget package through npm:
After installing, import the ConnextModal component from the package and use it in your React app.
Once you've imported the ConnextModal you can drop in the widget component into your UI and pass in props related to the assets/chains you want to swap between.
For this guide, we need to pass in:
You can create the modal and pass in props as follows:
You can find a guide on getting TEST tokens and trying out the widget here.
You can learn more about how to use the widget and possible configuration options in the Widget section.
Upgrading to mainnet networks is as easy as changing the network configurations and switching to a mainnet-capable router such as the Connext Mainnetrouter.
We are maintaining a list of L2 token addresses to make integration easier: https://github.com/connext/vector/blob/main/modules/utils/src/chains.json. We welcome contributions!