Getting started

The full source code of this example is available on Github: https://github.com/mangrovedao/mgv-example

To interact with Mangrove in JavaScript, we recommend using viem with the @mangrovedao/mgv SDK, which is built on top of it.

Project Setup

To get started (using Bun) initialize a new project:

bun init

Then add Viem and mgv as dependencies:

bun add viem @mangrovedao/mgv

Configuration

Next, define your Mangrove configuration, which includes the contract addresses for your target chain. Below is an example of the config for Mangrove on Base:

src/config.ts

import type { MangroveActionsDefaultParams } from "@mangrovedao/mgv";

export const mangroveConfig = {
  mgv: "0x22613524f5905Cb17cbD785b956e9238Bf725FAa",
  mgvOrder: "0xA3c363Ca0EA3603faEe9FAcffD65E777122adF36",
  mgvReader: "0xe5B118Ea1ffBC502EA7A666376d448209BFB50d3",
  smartRouter: "0x1424D7428dc11623100df1A3D06088C2d87fBE32",
  routerProxyFactory: "0x2926Cc3977F93a51465f9742c548e67220Af54e9",
} satisfies MangroveActionsDefaultParams;

Note: You can find the full list of contract addresses in the Mangrove documentation or by contacting the Mangrove team.

The Client

Now set up your client. You’ll need:

• A PRIVATE_KEY environment variable (required)

• An optional RPC_URL environment variable for your node provider

src/client.ts

import { mangroveActions } from "@mangrovedao/mgv";
import { createWalletClient, http, publicActions, type Hex } from "viem";
import { privateKeyToAccount } from "viem/accounts";
import { base } from "viem/chains";
import { mangroveConfig } from "./config";

export const client = createWalletClient({
  chain: base,
  transport: http(process.env.RPC_URL),
  account: privateKeyToAccount(process.env.PRIVATE_KEY as Hex),
})
  .extend(publicActions)
  .extend(mangroveActions(mangroveConfig));

With the configuration and client set up, you’re ready to interact with the Mangrove protocol. Learn how to query Mangrove in the next section.