Per trasformare il tuo DApp di staking da una "pagina statica accattivante" in un "applicazione decentralizzata funzionante", è necessario completare l'innesto da UI (aspetto esteriore) alla logica (anima).
Nell'ecosistema ArcBlock, eseguire un DApp prevede di solito i seguenti quattro passaggi fondamentali:
---
## ## Panoramica tematica: attraverso la trilogia "accesso all'identità, interazione con i contratti, distribuzione dei nodi", trasforma un'interfaccia statica in un'applicazione Web3 completa e funzionale.
## ## Analisi del contenuto: Quattro fasi chiave per far funzionare un DApp
### 1. Ambienti di distribuzione: rendere la pagina "online"
Innanzitutto, il tuo codice HTML deve avere un punto di partenza.
*Esecuzione locale**：Utilizza `blocklet dev` sul tuo computer. Questo avvierà un server locale, consentendoti di accedere tramite browser.
*Esecuzione ufficiale**：Hai bisogno di un nodo ArcBlock (ABT Node). Puoi incapsulare il codice in un Blocklet e installarlo sul nodo. In questo modo, gli utenti da tutto il mondo potranno accedere al tuo DApp tramite l'URL generato dal nodo.
### 2. Accesso all'identità: integrazione di DID Connect (funzionalità di accesso)
L'applicazione di staking deve sapere "chi sta staking".
*Operazione**：Devi integrare il componente `did-connect` di ArcBlock.
*Effetto**：Quando l'utente clicca su "Connect Wallet", appare un codice QR. L'utente lo scansiona con il suo wallet DID. Il tuo DApp può così ottenere in modo sicuro l'indirizzo del wallet (DID) dell'utente, senza bisogno di nome utente e password tradizionali.
### 3. Logica principale: gestione delle transazioni di staking (flusso di denaro)
Questo è il passaggio più importante. Quando l'utente inserisce l'importo e clicca su "STAKE NOW":
*Attivazione dal frontend**：Il codice JS costruisce una richiesta di transazione (Transaction Request).
*Firma del wallet**：Il wallet sul telefono dell'utente riceve una notifica chiedendo "Confermi di voler staking 100 ABT?".
*Esecuzione sulla blockchain**：Dopo la firma dell'utente, la transazione viene inviata alla blockchain (ad esempio Asset Chain). Il contratto intelligente o la macchina a stati (State Machine) sulla blockchain rimuove automaticamente gli ABT dell'utente e li blocca nel pool di staking.
### 4. Feedback sui dati: visualizzazione dinamica dei guadagni
Dopo il successo della staking, la pagina non deve essere inattiva.
*Logica**：Devi scrivere un breve frammento di codice JS per recuperare periodicamente i dati dalla blockchain tramite GraphQL o API.
*Effetto**：L'utente può vedere in tempo reale il suo importo staked e i guadagni stimati (Rewards) che cambiano dinamicamente.
---
## ## Suggerimenti per l'avvio rapido: come ottenere i risultati più velocemente?
Se vuoi provare immediatamente il senso di "esecuzione", puoi provare il seguente percorso:
1. Usa un modello Blocklet:
Non iniziare da zero a scrivere il backend. Quando esegui `blocklet create`, scegli un modello con un server (ad esempio Express o Koa). Ti ha già configurato automaticamente il codice di basso livello per interagire con il wallet.
2. Utilizza l'"assistente per lo sviluppo":
Nella nodo ArcBlock c'è uno strumento chiamato Data Builder, che ti aiuta a generare rapidamente le interfacce per interrogare i dati sulla blockchain. Devi solo collegare queste interfacce al tuo UI.
---
## ## Riassunto:
L'esecuzione di un DApp è fondamentalmente "presentazione frontend + autorizzazione del wallet + registrazione sulla blockchain". Il tuo UI ha già completato il primo passo. Il prossimo passo fondamentale è **l'integrazione con il wallet DID**, per permettere all'utente di "investire" realmente i propri asset nella tua pagina.