AlphaWeft
Fluxuri de lucru

De la un folder gol la un ecran testat: creează un dApp

03
Structurarea proiectului

Începe dintr-un folder de proiect gol

Pentru a crea un dApp, începe cu un folder care conține doar fișierul ABI al contractului tău. Deschide acel folder ca folder de lucru pentru un chat nou, alege Ask first și descrie pagina pe care o vrei: un buton de conectare a portofelului, afișarea soldului și o linie de stare pentru tranzacții. Agentul scanează folderul, propune fișierele sub formă de diferențe și creează pagina doar după ce accepți fiecare modificare. Decide dinainte de început unde va rula proiectul. O rețea locală pe propriul PC se potrivește bine pentru o primă încercare, deoarece monedele de pe ea nu au valoare, iar o rețea publică de testare este următorul pas odată ce pagina funcționează. Folosește conturi de unică folosință pe ambele, niciodată un cont care deține fonduri reale, și păstrează fiecare cheie privată și frază seed în afara folderului, chatului și depozitului. Rezultatul este o pagină mică, testată și un README pe care o altă persoană l-ar putea urma.

01

Deschide folderul

Alege folderul proiectului ca folder de lucru pentru un chat nou și selectează Ask first, astfel încât fiecare modificare care scrie un fișier să aștepte decizia ta. Pune fișierul ABI în acel folder înainte de a începe.

02

Descrie ecranul

Scrie ce date afișează pagina și în ce stări de tranzacție trebuie să gestioneze, în propoziții simple. Numește funcția contractului pe care o apelează și rețeaua cu care comunică, de exemplu rețeaua ta locală.

03

Revizuiește fiecare diferență

Citește fiecare modificare propusă a fișierului în chat, apoi accept-o sau respinge-o cu un scurt comentariu. Extinde un card când vrei să vezi diferența completă și respinge orice nu poți explica într-o singură propoziție.

04

Rulează și verifică

Lasă Shell să execute comanda de build și comanda de testare, și citește codul de ieșire pe fiecare card. Deschide pagina conectată la rețeaua locală și compară ceea ce afișează cu ceea ce te aștepți. Rezolvă erorile înainte de a adăuga următoarea funcționalitate.

Un fișier ABI mic de la care să începi

balance-abi.json
[
 {
  "type": "function",
  "name": "balanceOf",
  "stateMutability": "view",
  "inputs": [{ "type": "address", "name": "account" }],
  "outputs": [{ "type": "uint256" }]
 }
]

Acest fragment JSON descrie o singură funcție doar pentru citire, balanceOf, funcția de citire a soldului pe care o folosesc tokenurile ERC-20. Primește un parametru de tip address numit account și returnează un uint256. Un front-end folosește un ABI ca acesta pentru a apela contractul, iar fișierul nu conține nicio cheie și niciun secret. Salvează-l ca balance-abi.json în folderul proiectului și înlocuiește-l cu ABI-ul complet al propriului contract odată ce pagina funcționează, deoarece un contract real are de obicei multe funcții.

Ghiduri pas cu pas pentru un prim dApp

Mapează folderul și citește ABI-ul

Un mod bun de a începe învățarea web3 este să citești un singur fișier ABI mic înainte de a scrie ceva. Cere agentului să deschidă balance-abi.json. read_file afișează fișierul, list_dir arată ce altceva este în folder și grep confirmă numele exact al funcției. Agentul explică apoi în chat că balanceOf este o funcție view: citește date și nu trimite o tranzacție, așa că apelarea ei nu schimbă nimic pe lanț. Nimic nu este scris încă. De asemenea, listează ce va avea nevoie pagina, și anume o conexiune la un nod, adresa contractului implementat și un cont de verificat. Verifică fiecare afirmație împotriva JSON-ului de pe card, deoarece un model poate citi greșit un tip sau poate numi o funcție pe care fișierul nu o conține, și cere o corectură înainte de a continua.

Conectează pagina la o rețea locală

Cere o pagină care citește soldul unui cont de testare de unică folosință. write_file creează app.js cu o apelare către rețeaua ta locală prin JSON-RPC, iar edit_file adaugă o linie de script în index.html. Ai nevoie de instrumente cross chain pentru un dApp doar când comunică cu mai multe lanțuri; un prim proiect pe un singur lanț local nu are nevoie de niciunul, așa că lasă-le deoparte. În modul Ask first ambele modificări așteaptă ca diferențe. Citește-le și acceptă-le. Shell apoi execută comanda ta de build, iar cardul arată codul real de ieșire. Deschide pagina, compară numărul pe care îl afișează cu numărul pe care rețeaua ta locală îl raportează pentru același cont și cere agentului să remedieze pagina dacă cele două diferă. Păstrează adresa lanțului într-un singur loc, astfel încât schimbarea rețelei mai târziu înseamnă editarea unei singure linii.

Gestionează stările tranzacțiilor

Trecerea de la web2 la web3 ca dezvoltator înseamnă în mare parte adăugarea unui portofel, o rețea și o stare de tranzacție la ecrane pe care deja știi să le construiești. Cere agentului să adauge o linie de stare cu 5 stări: ne trimis, așteptând portofelul, în așteptare, confirmat și eșuat. edit_file modifică scriptul și foaia de stil, iar grep găsește orice loc unde o stare lipsește încă. Portofelul semnează; codul tău nu atinge niciodată o cheie privată sau o frază seed. Cere de asemenea mesaje pentru un portofel lipsă, rețeaua greșită și o semnătură respinsă, deoarece un utilizator real le va întâlni mai devreme sau mai târziu. Rulează pagina pe o rețea de testare cu un cont de unică folosință, respinge o semnătură în mod intenționat și verifică că starea eșuată apare cu un mesaj clar.

Testează, apoi documentează proiectul

Cere agentului să scrie un test front-end pentru fiecare stare și un README scurt care explică cum să rulezi proiectul. write_file creează ambele fișiere, Shell execută comanda ta de testare, iar cardul raportează codul real de ieșire. Un dezvoltator de dApp care se întoarce la proiect peste o lună va citi acel README primul, așa că verifică că numește doar comenzi pe care le folosești de fapt și că specifică ce rețea așteaptă pagina. Folosește modul Plan only mai întâi dacă vrei să vezi lista de pași înainte ca orice fișier să fie creat, apoi comută la Ask first pentru a-l executa. Citește fiecare diferență, rulează testele singur o dată pe o rețea de testare cu conturi de unică folosință și păstrează README-ul lângă fișierul ABI astfel încât ambele să rămână sincronizate.

AlphaWeft pentru Windows

Începe primul tău folder de proiect

Descarcă AlphaWeft ↗