Namada Interface
Front end development with Namada
The namada-interface repository (opens in a new tab) is a monorepo that contains the Namada Keychain browser extension and associated Namadillo web app. It's a great resource for developers wishing to understand how to incorporate the Namada SDK into their front-end applications.
Installing from source (for development and experiment purposes)
Connect to a testnet or run a local node
- Follow the instructions for the testnets to connect to a testnet or set up a local node.
- Figure out where the base directory is stored and save its location in an environment variable with something like
export BASE_DIR=<path/to/base/dir>
. You can follow these docs to save this variable. Consider saving the chain ID as an environment variable as well. You can find the chain ID by runningcat $BASE_DIR/global-config.toml
. Save this chain-id to the environment variableexport CHAIN_ID=<CHAIN_ID>
. - You will need to edit the CometBFT config in order to allow Namadillo to connect to your node.
The CometBFT config will be located in
$BASE_DIR/$CHAIN_ID//config.toml
. You will need to change thecors_allowed_origins
field to["*"]
. You can do this by runningsed -i 's/cors_allowed_origins = \[\]/cors_allowed_origins = ["*"]/' \ $BASE_DIR/$CHAIN_ID/config.toml
Setting up the Namada Keychain extension
- Clone the namada-interface repository (opens in a new tab).
- Follow the installation instructions in
README.md
. cd
into thenamada-interface/apps/extension
directory and runyarn start:chrome
. This will build the Namada Keychain extension and place it innamada-interface/apps/extension/build/chrome
. It also starts the dev server which will watch for changes.cd
into thenamada-interface/apps/namadillo
directory and runyarn dev
in order to launch a local instance of Namadillo.- Add the extension to the browser. For example, in Chrome, you can go to
chrome://extensions/
and clickLoad unpacked
and select thenamada-interface/apps/extension/build/chrome/
folder.
Receiving tokens
You can show the address of the current account by hovering over the account name in the top right corner. Clicking it will copy it to the clipboard. You can copy the address by clicking the copy icon next to the address. This will also display a QR code that can be scanned by a mobile wallet.