Skip to content

Commit 2c501bc

Browse files
committed
Add Viem tutorial.
Signed-off-by: bgravenorst <byron.gravenorst@consensys.net>
1 parent 95bef68 commit 2c501bc

File tree

6 files changed

+212
-5
lines changed

6 files changed

+212
-5
lines changed

services/tutorials/ethereum/send-a-transaction/send-a-transaction-ethers.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ Replace the following values in the `.env` file:
9898

9999
- `<NETWORK>` with `sepolia` or the alternative network you are using.
100100
- `<YOUR-API-KEY>` with your API key of the web3 project.
101-
- `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://metamask.zendesk.com/hc/en-us/articles/360015289632-How-to-Export-an-Account-Private-Key). A transaction must be signed with the sender's private key. Make sure that you prefix the `SIGNER_PRIVATE_KEY` value with `0x`. The private key you export from MetaMask isn't prefixed with `0x`.
101+
- `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://support.metamask.io/configure/accounts/how-to-export-an-accounts-private-key/). A transaction must be signed with the sender's private key. Make sure that you prefix the `SIGNER_PRIVATE_KEY` value with `0x`. The private key you export from MetaMask isn't prefixed with `0x`.
102102

103103
:::danger
104104

services/tutorials/ethereum/send-a-transaction/send-a-transaction-go.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,7 @@ func main() {
129129
Replace the following values in the script:
130130

131131
- `<YOUR-API-KEY>` with the Infura API key.
132-
- `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://metamask.zendesk.com/hc/en-us/articles/360015289632-How-to-Export-an-Account-Private-Key).
132+
- `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://support.metamask.io/configure/accounts/how-to-export-an-accounts-private-key/).
133133
- `<ADDRESS-TO>` with the address of the recipient of funds.
134134

135135
If using a different Ethereum network, update the URL in the script.

services/tutorials/ethereum/send-a-transaction/send-a-transaction-py.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ Create a `.env` file in your project directory to store the private key of your
5151
PRIVATE_KEY = <PRIVATE-KEY>
5252
```
5353

54-
Find out how to access the [private key of your Ethereum account](https://metamask.zendesk.com/hc/en-us/articles/360015289632-How-to-Export-an-Account-Private-Key). Make sure that you prefix the `<PRIVATE_KEY>` value with `0x`. The
54+
Find out how to access the [private key of your Ethereum account](https://support.metamask.io/configure/accounts/how-to-export-an-accounts-private-key/). Make sure that you prefix the `<PRIVATE_KEY>` value with `0x`. The
5555
private key you export from MetaMask will not be prefixed with `0x`.
5656

5757
:::danger
Lines changed: 207 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,207 @@
1+
---
2+
description: Send a transaction using Viem.
3+
---
4+
5+
import Tabs from '@theme/Tabs';
6+
import TabItem from '@theme/TabItem';
7+
8+
# Use Viem
9+
10+
In this tutorial, you'll send a transaction of 0.001 ETH from one account to another using the [Viem](https://viem.sh/)
11+
TypeScript library.
12+
13+
Prerequisites
14+
15+
- [Node.js](https://nodejs.org/en/download/)
16+
- [Install TypeScript](https://www.typescriptlang.org/download/)
17+
- [Install `ts-node`](https://www.npmjs.com/package/ts-node)
18+
- An Ethereum account
19+
20+
:::info
21+
Use [MetaMask](https://metamask.io/) or similar to create an Ethereum account for testing.
22+
:::
23+
24+
## Steps
25+
26+
### 1. Select your network and verify funds
27+
28+
- **Sepolia** - To use the Sepolia testnet, ensure that your account has Sepolia ETH.
29+
You can use the [MetaMask faucet](/developer-tools/faucet) to add more funds.
30+
- **Alternative network** - To use an alternative network, ensure that your account has testnet ETH
31+
for that network.
32+
33+
:::note
34+
When using an alternative network, update the chain name in the script (in Step 5) with the
35+
alternative network name from the [Viem supported chains list](https://github.com/wevm/viem/blob/main/src/chains/index.ts).
36+
:::
37+
38+
### 2. Create a project directory
39+
40+
Create a new directory for your project using the command line:
41+
42+
```bash
43+
mkdir infura
44+
```
45+
46+
Change into the new directory:
47+
48+
```bash
49+
cd infura
50+
```
51+
52+
### 3. Install required packages
53+
54+
Install the `viem` package in the project directory.
55+
56+
```bash
57+
npm i viem
58+
```
59+
60+
### 4. Create a `config.ts` file
61+
62+
Create a `config.ts` file in your project directory to store the private key of the sending account:
63+
64+
<Tabs>
65+
<TabItem value="Syntax" label="Syntax" default>
66+
67+
```tsx title="config.ts"
68+
import { privateKeyToAccount } from 'viem/accounts'
69+
export const account = privateKeyToAccount('<PRIVATE-KEY>')
70+
```
71+
</TabItem>
72+
<TabItem value="Example" label="Example" default>
73+
74+
```tsx title="config.ts"
75+
import { privateKeyToAccount } from 'viem/accounts'
76+
export const account = privateKeyToAccount('0x561...x...61df')
77+
```
78+
79+
</TabItem>
80+
</Tabs>
81+
82+
In the `config.ts` file, replace `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://support.metamask.io/configure/accounts/how-to-export-an-accounts-private-key/).
83+
A transaction must be signed with the sender's private key. Make sure that you prefix the `SIGNER_PRIVATE_KEY`
84+
value with `0x`. The private key you export from MetaMask isn't prefixed with `0x`.
85+
86+
:::danger
87+
Never disclose your private key. Anyone with your private keys can steal the assets controlled by those keys.
88+
:::
89+
90+
### 5. Create a `sendTransaction.ts` file
91+
92+
In the project directory, create a `sendTransaction.ts` file, which configures and sends the transaction. For example:
93+
94+
```tsx
95+
import { http, createWalletClient, parseEther } from 'viem'
96+
import { sepolia } from 'viem/chains'
97+
import { account } from './config'
98+
99+
//create a wallet client to interact with Ethereum accounts
100+
const walletClient = createWalletClient({
101+
chain: sepolia,
102+
transport: http("https://sepolia.infura.io/v3/API_KEY")
103+
})
104+
105+
async function sendTx () {
106+
//create and send the transaction object
107+
const hash = await walletClient.sendTransaction({
108+
account,
109+
to: '0xc2CB3fb3924b8DE3A63C1da570a8dBaf2a533eA7',
110+
value : parseEther ('0.001')
111+
})
112+
113+
console.log("Mining transcation... ")
114+
console.log(`Tx mined in https://sepolia.etherscan.io/tx/${hash}`)
115+
}
116+
117+
sendTx()
118+
```
119+
120+
In the `sendTransaction.ts` file:
121+
122+
- Replace `API_KEY` with your Infura API key.
123+
- Update the `to` account in the code if you wish to send test ETH to an account of your choice.
124+
125+
### 6. Execute the transaction
126+
127+
To execute the transaction, run:
128+
129+
```bash
130+
ts-node sendTransaction.ts
131+
```
132+
133+
:::note
134+
`ts-node` is a TypeScript execution engine for Node.js. It allows you to run TypeScript files without
135+
needing to manually compile them into JavaScript first.
136+
:::
137+
138+
An alternative way to execute your transaction using node.js is to compile your `sendTransaction.ts` file to JavaScript
139+
first, and then run the compiled JavaScript file:
140+
141+
```jsx
142+
tsc sendTransaction.ts
143+
node sendTransaction.js
144+
```
145+
146+
Running the typescript file, `sendTransaction.ts`, directly from your code development environment, like
147+
Visual Studio Code, works equally well, without the need to use `ts-node` or pre-compiling first to JavaScript.
148+
Example output:
149+
150+
`Mining transcation...
151+
Tx mined [https://sepolia.etherscan.io/tx/0x310588719e733118f50c0a1608e13b4e8bd5eb5891d546d89795c2041833abb6](https://sepolia.etherscan.io/tx/0x310588719e733118f50c0a1608e13b4e8bd5eb5891d546d89795c2041833abb6)`
152+
153+
You can search for the transaction on a block explorer such as [Sepolia Etherscan](https://sepolia.etherscan.io/).
154+
155+
### 7. (Optional) Fine tune the transaction details
156+
157+
Viem automatically determines the gas limit and fees. If you want to change the default values, update
158+
the `sendTransaction` method to include an `estimateGas` result (`gasLimit`) and the `maxFeePerGas` and
159+
`maxPriorityFeePerGas` parameters.
160+
161+
To do this you will also need to declare an `httpClient` to interface with JSON-RPC methods like `eth_estimateGas`.
162+
163+
Full code overview below:
164+
165+
```tsx
166+
import { http, createWalletClient, createPublicClient, parseEther, parseGwei } from 'viem'
167+
import { sepolia } from 'viem/chains'
168+
import { account } from './config'
169+
170+
//create a wallet client to interact with Ethereum accounts
171+
const walletClient = createWalletClient({
172+
chain: sepolia,
173+
transport: http("https://sepolia.infura.io/v3/API_KEY")
174+
})
175+
176+
//create a public client to interact with JSON-RPC API methods
177+
const httpClient = createPublicClient({
178+
chain: sepolia,
179+
transport: http("https://sepolia.infura.io/v3/API_KEY"),
180+
})
181+
182+
async function sendTx () {
183+
//estimate gas limit
184+
const limit = await httpClient.estimateGas({
185+
account,
186+
to: '0xc2CB3fb3924b8DE3A63C1da570a8dBaf2a533eA7',
187+
value: parseEther('0.001')
188+
})
189+
190+
//create and send the transaction object
191+
const hash = await walletClient.sendTransaction({
192+
account,
193+
to: '0xc2CB3fb3924b8DE3A63C1da570a8dBaf2a533eA7',
194+
value : parseEther ('0.001'),
195+
maxFeePerGas: parseGwei('20'),
196+
maxPriorityFeePerGas: parseGwei ('2'),
197+
gas: limit,
198+
})
199+
200+
console.log("Mining transcation... ")
201+
console.log(`Tx: https://sepolia.etherscan.io/tx/${hash}`)
202+
203+
}
204+
205+
sendTx()
206+
207+
```

services/tutorials/ethereum/send-a-transaction/use-ethers.js-infuraprovider-or-web3provider.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ REACT_APP_PRIVATE_KEY="<Private-Key>"
6666
Ensure you replace the following values in the `.env` file:
6767

6868
- `<YOUR-API-KEY>` with the API key of the Ethereum project.
69-
- `<Private-Key>` with the [private key of your Ethereum account](https://metamask.zendesk.com/hc/en-us/articles/360015289632-How-to-Export-an-Account-Private-Key).
69+
- `<Private-Key>` with the [private key of your Ethereum account](https://support.metamask.io/configure/accounts/how-to-export-an-accounts-private-key/).
7070

7171
:::danger
7272

services/tutorials/ethereum/send-a-transaction/use-web3.js.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ Replace the following values in the `.env` file:
100100

101101
- `<NETWORK>` with `sepolia` or the alternative network you are using.
102102
- `<YOUR-API-KEY>` with your API key of the web3 project.
103-
- `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://metamask.zendesk.com/hc/en-us/articles/360015289632-How-to-Export-an-Account-Private-Key). A transaction must be signed with the sender's private key. Make sure that you prefix the `SIGNER_PRIVATE_KEY` value with `0x`. The private key you export from MetaMask isn't prefixed with `0x`.
103+
- `<PRIVATE-KEY>` with the [private key of your Ethereum account](https://support.metamask.io/configure/accounts/how-to-export-an-accounts-private-key/). A transaction must be signed with the sender's private key. Make sure that you prefix the `SIGNER_PRIVATE_KEY` value with `0x`. The private key you export from MetaMask isn't prefixed with `0x`.
104104

105105
:::danger
106106

0 commit comments

Comments
 (0)