Getting started


EthosConnect is the simplest way to integrate a connect wallet experience into your React dApp on Sui.


npm install ethos-connect


yarn add ethos-connect


EthosConnect is a React library. For Vue support see EthosConnectVue

Configure and wrap providers

Start by importing Ethos and create an EthosConfiguration and decide what to do when the wallet gets connected. Then wrap your app with the EthosConnectProvider.

import { EthosConnectProvider } from 'ethos-connect';

const App = () => {
  return (
        apiKey: [YOUR API KEY] // Optional. Required for email signin. Please contact [email protected] to acquire an API key.
        chain: [CHAIN IDENTIFIER] // Optional. Defaults to sui:devnet - An enum containing acceptable chain identifier strings can be imported from the ethos-connect package 
        network: [RPC URL] // Optional. Defaults to 
        hideEmailSignIn: true // Optional.  Defaults to false
      <YourApp />

If you would like to switch your dapp from one network to another you need to change both chain and network in the ethosConfiguration.

Interested in customizing the text shown in the sign-in modal? Check out the Customization page.

If you'd like to show the email option to users, please contact us to get an API key.

Add the sign in button

Then, in your app, import and render the SignInButton component.

import { SignInButton } from 'ethos-connect'
export const YourApp = () => {
  return <SignInButton />

Learn how to customize your SignInButton component with Sign in button

Example Vue App