AlphaWeft
Pracovní postupy

Vytvořte dApp od prázdné složky po otestovanou obrazovku

03
Vygenerování projektu

Začněme od prázdné složky projektu

Pro vytvoření dApp začněte se složkou, která obsahuje pouze soubor ABI vašeho vlastního kontraktu. Otevřete tuto složku jako pracovní složku nového chatu, zvolte Ask first a popište stránku, kterou chcete: tlačítko pro připojení peněženky, zůstatek a řádek se stavem transakce. Agent mapuje složku, navrhne soubory jako diffy a vytvoří stránku až po vašem schválení každé změny. Rozhodněte se předem, kde bude projekt běžet. Lokální řetězec na vašem PC se hodí pro první pokus, protože mince na něm nemají hodnotu, a veřejná testovací síť je dalším krokem, až stránka bude fungovat. Používejte účely pro jedno použití na obou, nikdy ne účet s reálnými prostředky, a udržujte každé soukromé klíče a seed fráze mimo složku, chat i repozitář. Výsledkem je malá, otestovaná stránka a README, kterému může někdo další následovat.

01

Otevřete složku

Vyberte složku projektu jako pracovní složku nového chatu a zvolte Ask first, aby každá změna, která zapisuje soubor, čekala na vaše rozhodnutí. Před začátkem vložte soubor ABI do této složky.

02

Popište obrazovku

Napište, jaká data stránka zobrazuje a jaké stavy transakcí musí zpracovat, prostými větami. Uveďte funkci kontraktu, kterou volá, a síť, se kterou komunikuje, například váš lokální řetězec.

03

Zkontrolujte každý diff

Přečtěte si každou navrhovanou změnu souboru v chatu, pak ji přijměte nebo zamítněte krátkou poznámkou. Rozbalte kartu, když chcete vidět celý diff, a zamítněte vše, co nemůžete vysvělit jednou větou.

04

Spusťte a zkontrolujte

Nechte Shell spustit příkaz pro sestavení a příkaz pro testování a přečtěte si návratový kód na každé kartě. Otevřete stránku proti lokálnímu řetězci a porovnejte, co zobrazuje, s tím, co očekáváte. Opravte selhání před přidáním další funkce.

Malý soubor ABI, od kterého můžete začít

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

Tento fragment JSON popisuje jednu funkci pouze pro čtení, balanceOf, funkci pro čtení zůstatku, kterou používají tokeny ERC-20. Přijímá adresu pojmenovanou account a vrací uint256. Front-end používá ABI jako toto k volání kontraktu a soubor neobsahuje žádný klíč ani tajemství. Uložte jej jako balance-abi.json ve složce projektu a nahraďte jej plným ABI vašeho vlastního kontraktu, až stránka bude fungovat, protože skutečný kontrakt obvykle má mnohem více funkcí.

Průvodce pro první dApp

Zmapujte složku a přečtěte ABI

Dobrý způsob, jak se učit web3, je přečíst si jeden malý soubor ABI, než začnete cokoliv psát. Požádejte agenta, aby otevřel balance-abi.json. read_file zobrazí soubor, list_dir ukáže, co je ve složce ještě, a grep potvrdí přesný název funkce. Agent pak v chatu vysvětlí, že balanceOf je view funkce: čte data a neposílá transakci, takže její volání nic na řetězci nezmění. Zatím se nic nezapíše. Také vyjmenuje, co stránka bude potřebovat, totiž připojení k uzlu, adresu nasazeného kontraktu a účet, který chcete zkontrolovat. Zkontrolujte každé tvrzení proti JSON na kartě, protože model může špatně přečíst typ nebo pojmenovat funkci, která v souboru není, a požádejte o opravu, než půjdete dál.

Připojte stránku k lokálnímu řetězci

Požádejte o stránku, která čte zůstatek testovacího účelu pro jedno použití. write_file vytvoří app.js s voláním vašeho lokálního řetězce přes JSON-RPC a edit_file přidá řádek skriptu do index.html. Potřebujete nástroje pro více řetězců pro dApp pouze tehdy, když komunikuje s několika řetězci; první projekt na jednom lokálním řetězci žádné nepotřebuje, takže je vynechejte. V režimu Ask first obě změny čekají jako diffy. Přečtěte si je a přijměte je. Shell pak spustí příkaz pro sestavení a karta zobrazí skutečný návratový kód. Otevřete stránku, porovnejte číslo, které zobrazuje, s číslem, které váš lokální řetězec hlásí pro stejný účet, a požádejte agenta o opravu stránky, pokud se liší. Uchovávejte adresu řetězce na jednom místě, takže změna sítě později znamená úpravu jediného řádku.

Zpracujte stavy transakcí

Přechod z web2 na web3 jako vývojář znamená především přidání peněženky, sítě a stavu transakce do obrazovek, které už umíte budovat. Požádejte agenta, aby přidal řádek se stavem se 5 stavy: neposláno, čekání na peněženku, čeká na potvrzení, potvrzeno a selhání. edit_file změní skript a tabulku stylů a grep najde jakékoliv místo, kde stav stále chybí. Peněženka podepíše; váš kód nikdy nepřistoupí k soukromému klíči ani seed frázi. Také požádejte o zprávy pro chybějící peněženku, špatnou síť a odmítnutý podpis, protože skutečný uživatel se s nimi setká dříve nebo později. Spusťte stránku na testovací síti s účelem pro jedno použití, záměrně odmítněte podpis a zkontrolujte, zda se objeví stav selhání s jasnou zprávou.

Testujte, pak dokumentujte projekt

Požádejte agenta, aby napsal test front-endu pro každý stav a krátké README, které vysvětluje, jak projekt spustit. write_file vytvoří oba soubory, Shell spustí příkaz pro testování a karta hlásí skutečný návratový kód. Vývojář dApp, který se k projektu vrátí za měsíc, bude nejprve číst to README, takže zkontrolujte, že uvádí pouze příkazy, které skutečně používáte, a že říká, kterou síť stránka očekává. Nejprve použijte režim Plan only, pokud chcete vidět seznam kroků před vytvořením jakéhokoliv souboru, pak přepněte na Ask first, abyste ho provedli. Přečtěte si každý diff, spusťte testy sami jednou na testovací síti s účely pro jedno použití a udržujte README vedle souboru ABI, aby oba zůstaly v synchronizaci.

AlphaWeft pro Windows

Začněte svůj první projektový adresář

Stáhnout AlphaWeft ↗