skills.rest
cartridge-gg
cartridge-ggOFFICIAL
Explore all skills by this author →
GitHub

controller-react

Integrate Cartridge Controller with React apps using starknet-react hooks.

4|6|Updated Nov 8, 2024
Search Tags:#frontend#integration#react#controller#web3#wallet#starknet-react
One-click install
npx skills add https://github.com/cartridge-gg/docs --skill controller-react
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: controller-react
Source: https://github.com/cartridge-gg/docs/tree/main/skills/controller-react
Command: npx skills add https://github.com/cartridge-gg/docs --skill controller-react

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Integrate Cartridge Controller into React applications to enable wallet connections, provider setup, and on-chain interactions using starknet-react.

Core Features & Use Cases

  • Setup a StarknetConfig provider outside React components and create a ControllerConnector with customizable wallet policies.
  • Use hooks such as useConnect, useAccount, and useDisconnect to manage wallet connections and account state in React/Next.js apps.
  • Execute transactions and manage dynamic auth flows with a reusable provider and connector pattern in frontend web apps.

Quick Start

Install dependencies and configure StarknetProvider with a ControllerConnector to start connecting wallets and sending transactions.

Frequently Asked Questions about controller-react

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

FAQPage Schema
How do I integrate a Cartridge Controller wallet connection in a React app?▼

To integrate Cartridge Controller in a React app, configure a StarknetConfig provider with a ControllerConnector, then use starknet-react hooks like useConnect and useAccount to manage wallet connections and on-chain interactions.

What packages are required for Cartridge Controller integration with starknet-react?▼

Cartridge Controller integration requires installing @cartridge/connector, @cartridge/controller, and @starknet-react packages to set up the ControllerConnector and StarknetConfig provider in your web application.

Does Cartridge Controller work with Next.js for on-chain transactions?▼

Yes, Cartridge Controller works with Next.js and React applications. It enables wallet connections, dynamic auth flows, and transaction execution on Starknet mainnet and testnets using a reusable provider and connector pattern.

How do I set up wallet policies when using ControllerConnector in React?▼

Wallet policies are configured during ControllerConnector creation, which is set up outside React components alongside the StarknetConfig provider to manage customizable connection parameters and transaction policies.

What hooks are available for managing account state with Cartridge Controller?▼

Cartridge Controller uses starknet-react hooks including useConnect, useAccount, and useDisconnect to manage wallet connections, account state, and disconnection flows within React and Next.js applications.

Can I use Cartridge Controller on Starknet testnets and mainnet?▼

Yes, Cartridge Controller supports transaction execution on both Starknet mainnet and testnets. The StarknetConfig provider and ControllerConnector pattern handle network configuration for on-chain interactions across environments.

Related Skills

Explore More Software Engineering Skills→
gounthargounthar

aptos-dapp-integration

Integrate Aptos wallets and transactions into frontend dApps.

Community
Intermediate
MystenLabsMystenLabs
20

sui-frontend

Build browser-based Sui dApps with wallet integration and on-chain transactions.

Official
Advanced
shariqazeemshariqazeem
1

controller-react

Integrate Cartridge Controller into React apps for popup-free Starknet authentication.

Community
Intermediate
cartridge-ggcartridge-gg
4

controller-setup

Integrate Cartridge Controller wallet into Starknet applications for setup and connectors.

Official
Intermediate