skills.rest
first-mover-tw
first-mover-twOFFICIAL
Explore all skills by this author →
GitHub

sui-frontend

Integrate SUI SDK and dapp-kit for wallet connections and transactions.

7|2|Updated Feb 11, 2026
Search Tags:#typescript#frontend#react#sdk#wallet#dapp#sui
One-click install
npx skills add https://github.com/first-mover-tw/sui-dev-agents --skill sui-frontend
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: sui-frontend
Source: https://github.com/first-mover-tw/sui-dev-agents/tree/main/skills/sui-frontend
Command: npx skills add https://github.com/first-mover-tw/sui-dev-agents --skill sui-frontend

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the development of SUI decentralized applications (dApps) by providing tools and guidance for frontend integration, wallet connectivity, and transaction management.

Core Features & Use Cases

  • Project Setup: Guides through initializing React, Next.js, Vue, or Svelte projects with SUI SDK integration.
  • Wallet Integration: Simplifies connecting to various SUI wallets using @mysten/dapp-kit.
  • Transaction Management: Provides patterns for building, signing, and executing transactions using the SUI SDK.
  • State & Event Handling: Demonstrates best practices for querying on-chain data, listening to real-time events, and managing application state.
  • Use Case: A developer needs to build a user interface for an NFT marketplace on SUI. This Skill will help them set up their React project, integrate a wallet connection button, display NFTs, and allow users to list or purchase them by constructing and signing transactions.

Quick Start

Initialize a new SUI React frontend project using Vite and install necessary SUI dependencies.

Frequently Asked Questions about sui-frontend

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I connect a SUI wallet to my React dApp frontend?▼

You can connect a SUI wallet to your React dApp by utilizing the `@mysten/dapp-kit` library, which simplifies wallet connectivity, transaction signing, and user authentication directly within your frontend application.

Can I use the SUI SDK with Vue or Svelte for dApp development?▼

Yes, you can use the SUI SDK with Vue and Svelte. The Skill supports project initialization and dApp integration across React, Next.js, Vue, and Svelte frameworks using TypeScript for typed frontend development.

What is the best way to handle SUI on-chain events and state management?▼

The best way to handle SUI on-chain events and state management is by applying the provided patterns to query on-chain data, listen to real-time events, and manage application state using the SUI SDK and dapp-kit in your frontend.

How do I build and sign SUI transactions in a Next.js application?▼

You can build and sign SUI transactions in a Next.js application by following the transaction management patterns provided, which guide you through constructing, signing, and executing transactions using the SUI SDK and dapp-kit.

Do I need TypeScript to set up a SUI dApp frontend project?▼

TypeScript is highly recommended and explicitly supported for setting up a SUI dApp frontend project. The Skill guides you through initializing projects with Vite and integrating SUI dependencies using TypeScript.

Related Skills

Explore More Software Engineering Skills→
GemachDAOGemachDAO
4

gdex-ui-install-setup

Scaffold a React or Next.js project with a GDEX SDK provider.

Official
Intermediate
widnyanawidnyana
4

sui-dev

Route Sui development tasks to Move, TypeScript SDK, frontend, Seal, and Walrus sub-skills.

Community
Intermediate
MystenLabsMystenLabs
10

frontend-apps

Build Sui frontend dApps with dApp Kit v2 for wallet connections and transactions.

Official
Advanced
multiversxmultiversx
12

multiversx-dapp-frontend

Integrate React frontends with MultiversX blockchain for wallet and transaction handling.

Official
Intermediate