Skip to content

Commit

Permalink
link
Browse files Browse the repository at this point in the history
  • Loading branch information
@qbzzt
qbzzt committed Feb 18, 2025
1 parent bb942bb commit aa203bc
Show file tree
Hide file tree
Showing 2 changed files with 115 additions and 122 deletions.
236 changes: 114 additions & 122 deletions pages/stack/interop/tutorials/bridge-crosschain-eth.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,200 +27,192 @@ Note that if the source chain uses native ETH as their gas token, but the destin

### What you'll build

* A TypeScript application to transfer ETH chains
* A TypeScript application to transfer ETH chains

### What you'll learn

* How to send ETH on the blockchain and between blockchains
* How to relay messages between chains
* How to send ETH on the blockchain and between blockchains
* How to relay messages between chains

## Prerequisites

Before starting this tutorial, ensure your development environment meets the following requirements:

### Technical knowledge

* Intermediate TypeScript knowledge
* Understanding of smart contract development
* Familiarity with blockchain concepts
* Intermediate TypeScript knowledge
* Understanding of smart contract development
* Familiarity with blockchain concepts

### Development environment

* Unix-like operating system (Linux, macOS, or WSL for Windows)
* Node.js version 16 or higher
* Git for version control
* Unix-like operating system (Linux, macOS, or WSL for Windows)
* Node.js version 16 or higher
* Git for version control

### Required tools

The tutorial uses these primary tools:

* Foundry: For smart contract development
* Supersim: For local blockchain simulation
* TypeScript: For implementation
* Viem: For blockchain interaction
* Foundry: For smart contract development
* Supersim: For local blockchain simulation
* TypeScript: For implementation
* Viem: For blockchain interaction

<Steps>
### Configure the network

### Configure the network
1. Install [Foundry](https://book.getfoundry.sh/getting-started/installation).

1. Install [Foundry](https://book.getfoundry.sh/getting-started/installation).
<Tabs items={['Supersim', 'Interop devnet']}>
<Tabs.Tab>
2. Follow the [Installation Guide](/app-developers/tutorials/supersim/getting-started/installation) to install [Supersim](../tools/supersim) for running blockchains with Interop.

<Tabs items={['Supersim', 'Interop devnet']}>
<Tabs.Tab>
2. Follow the [Installation Guide](/app-developers/tutorials/supersim/getting-started/installation) to install [Supersim](../tools/supersim) for running blockchains with Interop.
3. Supersim uses Foundry's `anvil` blockchains, which start with ten prefunded accounts.
Set these environment variables to access one of those accounts on the L2 blockchains.

3. Supersim uses Foundry's `anvil` blockchains, which start with ten prefunded accounts.
Set these environment variables to access one of those accounts on the L2 blockchains.

```sh
export PRIV_KEY=0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80
```
```sh
export PRIV_KEY=0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80
```

<details>

<summary>Sanity check</summary>

```sh
cast balance --ether `cast wallet address $PRIV_KEY` --rpc-url http://localhost:9545
cast balance --ether `cast wallet address $PRIV_KEY` --rpc-url http://localhost:9546
```

</details>
</Tabs.Tab>
<Tabs.Tab>
2. Set `PRIV_KEY` to the private key of an address that has [Sepolia ETH](https://cloud.google.com/application/web3/faucet/ethereum/sepolia).

```sh
export PRIV_KEY=0x<private key here>
```

3. Send ETH to the two L2 blockchains.

```sh
cast send --rpc-url https://endpoints.omniatech.io/v1/eth/sepolia/public --private-key $PRIV_KEY --value 0.02ether 0x7385d89d38ab79984e7c84fab9ce5e6f4815468a
cast send --rpc-url https://endpoints.omniatech.io/v1/eth/sepolia/public --private-key $PRIV_KEY --value 0.02ether 0x55f5c4653dbcde7d1254f9c690a5d761b315500c
```
</Tabs.Tab>

4. Wait a few minutes until you can see the ETH [on the block explorer](https://sid.testnet.routescan.io/) for your address.
<Tabs.Tab>
2. Set `PRIV_KEY` to the private key of an address that has [Sepolia ETH](https://cloud.google.com/application/web3/faucet/ethereum/sepolia).

<details>
```sh
export PRIV_KEY=0x<private key here>
```

<summary>Sanity check</summary>

```sh
cast balance --ether `cast wallet address $PRIV_KEY` --rpc-url https://interop-alpha-0.optimism.io/
cast balance --ether `cast wallet address $PRIV_KEY` --rpc-url https://interop-alpha-1.optimism.io/
```

</details>
3. Send ETH to the two L2 blockchains.

</Tabs.Tab>
</Tabs>
```sh
cast send --rpc-url https://endpoints.omniatech.io/v1/eth/sepolia/public --private-key $PRIV_KEY --value 0.02ether 0x7385d89d38ab79984e7c84fab9ce5e6f4815468a
cast send --rpc-url https://endpoints.omniatech.io/v1/eth/sepolia/public --private-key $PRIV_KEY --value 0.02ether 0x55f5c4653dbcde7d1254f9c690a5d761b315500c
```

### Create the TypeScript project
4. Wait a few minutes until you can see the ETH [on the block explorer](https://sid.testnet.routescan.io/) for your address.

We need to create an executing message on the destination chain, and for that we use [the `@eth-optimism/viem` package](https://www.npmjs.com/package/@eth-optimism/viem).
<details>
<summary>Sanity check</summary>

1. Create a new TypeScript project.
```sh
cast balance --ether `cast wallet address $PRIV_KEY` --rpc-url https://interop-alpha-0.optimism.io/
cast balance --ether `cast wallet address $PRIV_KEY` --rpc-url https://interop-alpha-1.optimism.io/
```
</details>
</Tabs.Tab>
</Tabs>

```sh
mkdir transfer-eth
cd transfer-eth
npm init -y
npm install --save-dev -y viem tsx @types/node @eth-optimism/viem typescript
mkdir src
```
### Create the TypeScript project

1. Download the ABI for `SuperchainWETH`.
We need to create an executing message on the destination chain, and for that we use [the `@eth-optimism/viem` package](https://www.npmjs.com/package/@eth-optimism/viem).

```sh
wget https://raw.githubusercontent.com/ethereum-optimism/optimism/refs/heads/develop/packages/contracts-bedrock/snapshots/abi/SuperchainWETH.json
mv SuperchainWETH.json src/SuperchainWETH.abi.json
```
1. Create a new TypeScript project.

1. Place this in `src/transfer-eth.mts`:
```sh
mkdir transfer-eth
cd transfer-eth
npm init -y
npm install --save-dev -y viem tsx @types/node @eth-optimism/viem typescript
mkdir src
```

```typescript file=<rootDir>/public/tutorials/transfer-eth.mts hash=41c1d559ac010d3407a3c056f2f49405
```
2. Download the ABI for `SuperchainWETH`.

<details>
```sh
wget https://raw.githubusercontent.com/ethereum-optimism/optimism/refs/heads/develop/packages/contracts-bedrock/snapshots/abi/SuperchainWETH.json
mv SuperchainWETH.json src/SuperchainWETH.abi.json
```

<summary>Explanation</summary>
3. Place this in `src/transfer-eth.mts`:

```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L13-L18 hash=5312f4634ac8762504935cd52d18c8ab
```
```typescript file=<rootDir>/public/tutorials/transfer-eth.mts hash=41c1d559ac010d3407a3c056f2f49405
```

Import all chain definitions from `@eth-optimism/viem`.
<details>
<summary>Explanation</summary>

```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L29-L32 hash=56873f8d2eebe5975a0c0b9ac7eecfe7
```
```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L13-L18 hash=5312f4634ac8762504935cd52d18c8ab
```

If the address we use is `0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266`, one of the prefunded addresses on `anvil`, assume we're using Supersim.
Otherwise, use Interop devnet.
Import all chain definitions from `@eth-optimism/viem`.

```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L78-L80 hash=4933c70a9078c2369ef90bfe163f5fd7
```
```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L29-L32 hash=56873f8d2eebe5975a0c0b9ac7eecfe7
```

To relay a message we need the information in the receipt.
Also, we need to wait until the transaction with the relayed message is actually part of a block.
If the address we use is `0xf39Fd6e51aad88F6F4ce6aB8827279cffFb92266`, one of the prefunded addresses on `anvil`, assume we're using Supersim.
Otherwise, use Interop devnet.

```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L87-L89 hash=573f22b2b21415ff51c59c713fda07d1
```
```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L78-L80 hash=4933c70a9078c2369ef90bfe163f5fd7
```

A single transaction can send multiple messages.
But here we know we sent just one, so we look for the first one in the list.
To relay a message we need the information in the receipt.
Also, we need to wait until the transaction with the relayed message is actually part of a block.

```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L90-L96 hash=4b26775b46c116262af4c7299d6f1127
```
```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L87-L89 hash=573f22b2b21415ff51c59c713fda07d1
```

This is how you use `@eth-optimism/viem` to create an executing message.
A single transaction can send multiple messages.
But here we know we sent just one, so we look for the first one in the list.

</details>
```typescript file=<rootDir>/public/tutorials/transfer-eth.mts#L90-L96 hash=4b26775b46c116262af4c7299d6f1127
```

### Run the example
This is how you use `@eth-optimism/viem` to create an executing message.
</details>

1. Run the example.
### Run the example

```sh
npx tsx src/transfer-eth.mts
```
1. Run the example.

1. Read the results.
```sh
npx tsx src/transfer-eth.mts
```

```
Before transfer
2. Read the results.

Address: 0x7ED53BfaA58B79Dd655B2f229258C093b6C09A8C
Balance on source chain: 0.020999799151902245
Balance on destination chain: 0.026999459226731331
```
```
Before transfer
The initial state.
Address: 0x7ED53BfaA58B79Dd655B2f229258C093b6C09A8C
Balance on source chain: 0.020999799151902245
Balance on destination chain: 0.026999459226731331
```

```
After transfer on source chain
The initial state.

Address: 0x7ED53BfaA58B79Dd655B2f229258C093b6C09A8C
Balance on source chain: 0.019999732176717961
Balance on destination chain: 0.026999459226731331
```
```
After transfer on source chain
After the initiating message the balance on the source chain is immediately reduced.
Notice that even though we are sending 0.001 ETH, the balance on the source chain is reduced by a bit more (here, approximately 67 gwei).
This is the cost of the initiating transaction on the source chain.
Of course, as there has been no transaction on the destination chain, that balance is unchanged.
Address: 0x7ED53BfaA58B79Dd655B2f229258C093b6C09A8C
Balance on source chain: 0.019999732176717961
Balance on destination chain: 0.026999459226731331
```

```
After relaying message to destination chain
After the initiating message the balance on the source chain is immediately reduced.
Notice that even though we are sending 0.001 ETH, the balance on the source chain is reduced by a bit more (here, approximately 67 gwei).
This is the cost of the initiating transaction on the source chain.
Of course, as there has been no transaction on the destination chain, that balance is unchanged.

Address: 0x7ED53BfaA58B79Dd655B2f229258C093b6C09A8C
Balance on source chain: 0.019999732176717961
Balance on destination chain: 0.027999278943880868
```
```
After relaying message to destination chain
Now the balance on the destination chain increases, by slightly less than 0.001 ETH.
The executing message also has a transaction cost (in this case, about 180gwei).
Address: 0x7ED53BfaA58B79Dd655B2f229258C093b6C09A8C
Balance on source chain: 0.019999732176717961
Balance on destination chain: 0.027999278943880868
```

Now the balance on the destination chain increases, by slightly less than 0.001 ETH.
The executing message also has a transaction cost (in this case, about 180gwei).
</Steps>

## Next steps
Expand Down
1 change: 1 addition & 0 deletions words.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -299,6 +299,7 @@ Predeployed
predeployed
Predeploys
predeploys
prefunded
Preimage
preimage
PREIMAGES
Expand Down

0 comments on commit aa203bc

Please sign in to comment.