ETH Dapp Browser

An Ethereum Dapp Browser to run your Dapp inside Ledger Live

Full documentation · Report Bug · Request Feature

Installation

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.ts. The page auto-updates as you edit the file.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Usage

This application is mainly used by Ledger Live to display a Dapp and provide a bridge between said Dapp and the Ledger Live client.

As a Dapp developer, you can use this application through a manifest, as specified on our developer portal, to test the correct integration of your Dapp within Ledger Live.

The list of supported rpc calls can be found in the receiveDAPPMessage function in the DAPPBrowser component index file.

Here is an example of a manifest you could use for local test (with the eth-dapp-browser accessible on port 3000 and your Dapp accessible on port 4000):

{
  "id": "test-dapp",
  "name": "Test DApp",
  "url": "http://localhost:3000/v2/",
  "params": {
    "dappUrl": "http://localhost:4000/",
    "nanoApp": "Ethereum",
    "dappName": "Test DApp",
    "networks": [
      {
        "currency": "ethereum",
        "chainID": 1,
        "nodeURL": "wss://eth-mainnet.ws.alchemyapi.io/v2/0fyudoTG94QWC0tEtfJViM9v2ZXJuij2"
      },
      {
        "currency": "bsc",
        "chainID": 56,
        "nodeURL": "https://bsc-dataseed.binance.org/"
      },
      {
        "currency": "polygon",
        "chainID": 137,
        "nodeURL": "https://polygon-mainnet.g.alchemy.com/v2/oPIxZM7kXsPVVY1Sk0kOQwkoIOpSu8PE"
      },
      {
        "currency": "ethereum_goerli",
        "chainID": 5,
        "nodeURL": "https://eth-goerli.g.alchemy.com/v2/vzJoUrfWDBOdwtCL-sybfBzIfNzY0_tk"
      }
    ]
  },
  "homepageUrl": "",
  "supportUrl": "",
  "icon": "",
  "platforms": ["ios", "android", "desktop"],
  "apiVersion": "^2.0.0",
  "manifestVersion": "2",
  "branch": "stable",
  "categories": [],
  "currencies": ["ethereum", "bsc"],
  "content": {
    "shortDescription": {
      "en": "Test DApp"
    },
    "description": {
      "en": "Test DApp"
    }
  },
  "permissions": [
    "account.list",
    "account.request",
    "currency.list",
    "message.sign",
    "transaction.signAndBroadcast"
  ],
  "domains": ["http://", "https://"]
}

Know that your Dapp will always be accessed through the url provided under the dappUrl field.

If you want to handle different logics for opening your Dapp (for example, opening a specific page or start your app in a specific stage based on some parameters), you can use URL query string alongside Ledger Live deeplink.

Here is an example of a deeplink oppening this test Dapp with some query parameters:

ledgerlive://discover/test-dapp/?param1=val1&param2=val2

The query params param1 and param2 will be forwarded by the eth-dapp-browser to your Dapp (i.e: included as query parameters in your Dapp URL).

Your Dapp could also automatically receive extra query params provided by the client application (Ledger Live for example).

⚠️ These query params are reserved, meaning you should not provide them as query params, either in the dappUrl field through the manifest or in a deeplink.

Here is a list of these reserved query params and the information of wether or not they might be forwarded by the eth-dapp-browser to the Dapp:

Query param	Passed to Dapp?
params
accountId
theme	X
backgroundColor	X
textColor	X
loadDate	X
lang	X

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT

---

We are hiring, join us! 🚀

See also:

• Ledger Live
• Live App SDK