Quickstart

Learn how to transfer STX tokens via a web wallet using Stacks Connect.


In this quickstart guide, you will learn how to set up your project, authenticate users with a web wallet, and initiate a STX token transfer.

For a deeper dive into the authentication process, check out the authenticate users guide.


Install package dependencies

Add the necessary packages to your project using your preferred package manager.

Terminal
$
npm install @stacks/connect

Connect to a wallet

The connect function stores the user's address in local storage by default, making it easy to persist the user's session across page reloads and browser sessions.

connect.ts
import { connect } from '@stacks/connect';
const response = await connect();

To access the user's addresses, you can use the getLocalStorage function.

storage.ts
import { getLocalStorage } from '@stacks/connect';
const data = getLocalStorage();

You can manage the connection's state using the following:

connect.ts
import { connect, disconnect, isConnected } from '@stacks/connect';
isConnected(); // false
await connect(); // similar to the `getAddresses` method
isConnected(); // true
disconnect(); // clears local storage and selected wallet
isConnected(); // false

Use request to trigger a transfer

The process of connecting to a wallet gives the web app information about the wallet account, which enables interactions with the Stacks blockchain, like calling smart contracts.

Using the request function, you can trigger wallet interactions using the stx_transferStx method.

connect.tsx
const response = await request('stx_transferStx', {
amount: '1000', // amount in micro-STX (1 STX = 1,000,000 micro-STX)
recipient: 'SP2MF04VAGYHGAZWGTEDW5VYCPDWWSY08Z1QFNDSN', // recipient address
network: 'mainnet', // optional, defaults to mainnet
memo: 'Optional memo', // optional memo field
});

Next steps