Pentru a transforma DApp-ul tău de stocare dintr-o „pagină statică atractivă” într-o „aplicație descentralizată funcțională”, trebuie să finalizezi injecția de la UI (înveliș) la logică (suflet).
În ecosistemul ArcBlock, funcționarea unui DApp este de obicei împărțită în următorii patru pași esențiali:
---
## ## Prezentare generală a temei: prin trilogia „acces identitate, interacțiune contract, desfășurare noduri”, activezi UI static într-o aplicație Web3 complet funcțională.
## ## Analiza conținutului: cele patru etape cheie ale funcționării DApp-ului
### 1. Mediu de desfășurare: pentru a face pagina „online”
În primul rând, codul tău HTML are nevoie de o casă.
*Rulare locală**: Folosește `blocklet dev` pe computerul tău, aceasta va porni un server local, permițându-ți să accesezi prin browser.
*Rulare oficială**: Ai nevoie de un nod ArcBlock (ABT Node). Poți împacheta codul într-un Blocklet și apoi să-l instalezi pe nod. Astfel, utilizatorii din întreaga lume pot accesa DApp-ul tău prin URL-ul generat de nod.
### 2. Acces la identitate: Integrarea DID Connect (funcția de autentificare)
Aplicația de staking trebuie să știe „cine este cel care stakează”.
*Operațiune**: Trebuie să introduci componenta `did-connect` de la ArcBlock.
*Efect**: Când utilizatorul face clic pe „Connect Wallet”, pagina va afișa un cod QR. Utilizatorul scanează cu DID Wallet, astfel încât DApp-ul tău să poată obține în siguranță adresa portofelului utilizatorului (DID) fără a necesita un nume de utilizator și o parolă tradițională.
### 3. Logica de bază: Procesarea tranzacțiilor de staking (fluxul de „bani”)
Aceasta este cea mai crucială etapă. Când utilizatorul introduce suma și face clic pe „STAKE NOW”:
*Declanșare front-end**: Codul JS va construi o cerere de tranzacție (Transaction Request).
*Semnătura portofelului**: Portofelul mobil al utilizatorului va primi o fereastră pop-up, întrebând „Ești de acord să stakezi 100 ABT?”.
*Executare pe lanț**: După ce utilizatorul semnează, tranzacția este trimisă pe blockchain (de exemplu, Asset Chain). Contractele inteligente sau mașinile de stare (State Machine) de pe lanț vor deduce automat ABT-ul utilizatorului și îl vor bloca în piscina de staking.
### 4. Feedback de date: Afișarea dinamică a câștigurilor
După ce a fost efectuat cu succes, pagina nu trebuie să fie statică.
*Logică**: Trebuie să scrii un mic cod JS pentru a trage date din lanț periodic prin GraphQL sau API.
*Efect**: Utilizatorii pot vedea în timp real „suma deja staked” și „câștigurile estimate (Rewards)” cum se schimbă.
---
## ## Sugestii pentru începători: Cum să vezi cele mai rapide rezultate?
Dacă vrei să simți imediat „funcționarea”, poți încerca următorul parcurs:
1. Folosește șablonul Blocklet:
Nu începe de la zero să scrii backend. Când rulezi `blocklet create`, alege un șablon care conține Server (de exemplu, Express sau Koa). Acesta a configurat deja codul de bază pentru interacțiunea cu portofelul.
2. Folosind „Asistentul de dezvoltare”:
În nodul ArcBlock, există un instrument Data Builder care te poate ajuta să generezi rapid interfețe pentru a interoga datele de pe lanț, trebuie doar să conectezi aceste interfețe la UI-ul tău.
---
## ## Rezumat:
Esenta rulării unui DApp este „afisare front-end + autorizare portofel + dovadă pe lanț”. UI-ul tău a finalizat deja primul pas, următoarea parte esențială este **integrarea portofelului DID**, astfel încât utilizatorii să-și poată „investi” efectiv activele în pagina ta.