Icon LinkGetting Started

The Fuel Wallet SDK serves as a connection manager between your DApp and other wallets compatible with the Fuel Network. This package ensures that you can connect to the Fuel Wallet as well as any other wallet using a unified API.

If you are using React jump to the React section .

Icon LinkInstallation

To begin integrating the Fuel Wallet SDK into your DApp, you first need to install the packages @fuel-wallet/sdk and fuels.

npm install @fuel-wallet/sdk fuels

The installation also requires the fuels SDK, as it is used to communicate with the Fuel Network and provides a set of utilities required for interacting with contracts on the Fuel Network.

Icon LinkExample

import { Fuel } from '@fuel-wallet/sdk';
 
const fuel = new Fuel();
 
await fuel.connect();

Icon LinkUsing React

Fuel Wallet SDK also provides a set of React hooks and a UI for working with it connectors without, the need for manually create a UI, for it.

Icon LinkInstallation

npm install @fuel-wallet/react fuels

Icon LinkExample

Icon LinkSetup

Wrap your application with the provider FuelConnectProvider.

import { FuelProvider } from '@fuel-wallet/react';
 
ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <FuelProvider>
      <App />
    </FuelProvider>
  </React.StrictMode>
);

Alternatively, you can use just the FuelProvider if you prefer not to use the provided UI.

Icon LinkUsage

import { useConnectUI } from '@fuel-wallet/react';
const { connect, isConnecting } = useConnectUI();
 
<button onClick={connect}>
	{isConnecting ? 'Connecting...' : 'Connect'}
</button>

Check our example application for a quick start Icon Link.