controller-react

Name: controller-react
Availability: InStock
Author: cartridge-gg

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

Ready to run

npx skills add https://github.com/cartridge-gg/docs --skill controller-react

💬 Prompt for ChatGPT / Claude Chat▼

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.