Creación de una dApp móvil

Integración de React Native y Expo con @solana/kit y MWA.

Receta

npx create-solana-dapp@latest my-mobile-dapp
cd my-mobile-dapp && npx expo start --dev-client

Cuándo usar esto:

• Para lanzar aplicaciones de consumidor de Solana orientadas primero a Android.
• Para reutilizar la lógica de negocio de kit de un proyecto web en un monorepo.
• Para lanzamientos del ecosistema Seeker.

Ejemplo funcional

import { useCallback, useState } from "react";
import { Button, Text, View } from "react-native";
import { createSolanaRpc, address } from "@solana/kit";
import { transact } from "@solana-mobile/mobile-wallet-adapter-protocol-web3js";
 
const rpc = createSolanaRpc("https://api.devnet.solana.com");
 
export function App() {
  const [addr, setAddr] = useState<string | null>(null);
 
  const connect = useCallback(async () => {
    await transact(async (wallet) => {
      const auth = await wallet.authorize({
        cluster: "devnet",
        identity: { name: "Demo", uri: "https://example.com", icon: "icon.png" },
      });
      setAddr(auth.accounts[0].address);
    });
  }, []);
 
  return (
    <View>
      <Button title="Conectar" onPress={connect} />
      {addr && <Text>{addr}</Text>}
    </View>
  );
}

Lo que esto demuestra:

• Interfaz de usuario de RN + kit RPC + autorización de MWA en una sola pantalla.
• Se requiere el cliente de desarrollo para el módulo nativo de MWA.
• Compartir tipos con la aplicación web a través de paquetes de monorepo.

Análisis profundo

Cómo funciona

• Expo prebuild genera el proyecto de Android con filtros de intención.
• kit se ejecuta en el motor JS de Hermes; usa bigint consistentemente.
• Los monorepos pueden compartir clientes de Codama entre web y móvil.
• Las actualizaciones OTA a través de Expo no reemplazan las actualizaciones del SDK nativo de la billetera.

Errores comunes

• Expo Go sin cliente de desarrollo - Falta el módulo nativo de MWA. Solución: compilación de cliente de desarrollo personalizado.
• Bloqueo del hilo de la interfaz de usuario durante transact - ANR en Android. Solución: solo patrones asíncronos.
• Gran paquete con todos los clientes de programas - Inicio lento. Solución: importar por separado.
• Almacenamiento seguro para tokens - usa el almacén seguro de la plataforma para tokens de autenticación.
• Suposiciones de iOS - verifica la matriz de soporte de la plataforma antes de comercializar para iOS.

Alternativas

Preguntas frecuentes

Relacionado

• Mobile Wallet Adapter - API de conexión
• Conceptos básicos de integración de dApps - patrones web paralelos
• Conceptos básicos de @solana/kit - núcleo de kit

Versiones de la pila: Esta página se escribió para Agave 4.1.1, Solana CLI 3.0.10, Anchor 0.32.1, anchor-lang 0.32.1, Rust 1.91.1, @solana/kit 7.0.0, Surfpool 0.12.0 y LiteSVM 0.6.x.