Web3 je termín, který se často používá k označení kolekce technologií a protokolů, které tvoří decentralizovaný web.

To zahrnuje technologii blockchain, řešení distribuovaného úložiště a síťové protokoly typu peer-to-peer.

V tomto článku vás provedeme procesem vytvoření základní aplikace Web3 od začátku.

Krok 1: Vyberte blockchainovou platformu

Prvním krokem při vytváření Web3 aplikace je výběr blockchainové platformy. K dispozici je několik možností, včetně Etherea, Bitcoinu a EOS.

Pro účely tohoto tutoriálu budeme používat Ethereum, což je jedna z nejpopulárnějších blockchainových platforem a podporuje funkci smart contract.

Krok 2: Nastavte vývojové prostředí

Jakmile si vyberete blockchainovou platformu, dalším krokem je nastavení vývojového prostředí. Pro Ethereum budete muset nainstalovat následující:

  • Node.js

  • Lanýžový rámec

  • Ganache

  • Metamaska

Node.js je běhové prostředí JavaScriptu, které umožňuje spouštět JavaScript na straně serveru.

Truffle Framework je vývojový rámec pro Ethereum, který poskytuje nástroje pro kompilaci, testování a nasazení chytrých kontraktů.

Ganache je lokální blockchainová síť, kterou můžete použít k testování své aplikace. Metamask je rozšíření prohlížeče, které umožňuje interakci se sítí Ethereum.

Krok 3: Vytvořte chytrou smlouvu

Dalším krokem je vytvoření chytré smlouvy. Inteligentní smlouva je samostatně vykonávaná smlouva, přičemž podmínky dohody mezi kupujícím a prodávajícím jsou přímo zapsány do řádků kódu.

V Ethereu jsou chytré smlouvy napsány v Solidity, programovacím jazyce speciálně navrženém pro chytré smlouvy. Zde je příklad jednoduché chytré smlouvy, která ukládá řetězec:

pevnost pragma ^0,8,0; contract MyContract { string public myString = "Ahoj světe!"; function setString(paměť řetězce newString) public { myString = newString; } }

Tato smlouva definuje řetězcovou proměnnou nazvanou myString a funkci nazvanou setString, která vám umožňuje aktualizovat hodnotu myString.

Krok 4: Kompilace a nasazení Smart Contract

Jakmile vytvoříte svou chytrou smlouvu, dalším krokem je její kompilace a nasazení do sítě Ethereum. Chcete-li to provést, budete muset v terminálu spustit následující příkazy:

lanýž kompilovat truffle migrovat

Příkaz kompilace truffle zkompiluje vaši inteligentní smlouvu a vygeneruje bytecode, který bude nasazen do sítě Ethereum. Příkaz truffle migrate nasadí bajtový kód do sítě Ethereum.

Krok 5: Vytvořte aplikaci Web3

Posledním krokem je vytvoření aplikace Web3, která spolupracuje s vaší inteligentní smlouvou. Chcete-li to provést, budete muset vytvořit soubor HTML a soubor JavaScript. Zde je příklad souboru HTML:

My Web3 Application Aktuální hodnota myString: Update

Tento soubor HTML definuje jednoduchou webovou stránku, která zobrazuje aktuální hodnotu myString, vstupní pole pro aktualizaci hodnoty myString a tlačítko pro odeslání aktualizované hodnoty.

JavaScriptový soubor app.js je místo, kde napíšeme kód pro interakci se sítí Ethereum a naší inteligentní smlouvou. Zde je příklad kódu JavaScript:

window.addEventListener('load', async () => { if (window.ethereum) { window.web3 = new Web3(window.ethereum); wait window.ethereum.enable(); } else { alert('Nainstalujte prosím MetaMask pro použití této aplikace.'); } const contractAddress = 'vaše_ccontract'; ], "name": "setString", "outputs": [], "payable": false, "stateMutability": "nonpayable", "type": "function" }]; const myContract = new web3.eth.Contract (contractABI, contractAddress = wait myContract.methods.myString().call(); document.getElementById('myString').innerText = myString = async () => { const newString = document.getElementById; ('newString').value; wait myContract.methods.setString(newString).send({from: web3.eth.defaultAccount}); const updatedString = wait myContract.methods.myString().call(); ('myString').innerText = updatedString };

Tento kód inicializuje knihovnu Web3, připojí se k síti Ethereum pomocí Metamask a vytvoří instanci naší chytré smlouvy pomocí adresy smlouvy a ABI.

Poté zobrazí aktuální hodnotu myString na webové stránce a umožní uživateli ji aktualizovat voláním funkce setString na smart kontraktu.

Závěrem v tomto článku jsme vás provedli procesem vytvoření základní aplikace Web3 od začátku.

Začali jsme výběrem blockchainové platformy, nastavením vývojového prostředí, vytvořením smart kontraktu, kompilací a nasazením smart kontraktu do sítě Ethereum a nakonec vytvořením Web3 aplikace, která interaguje s smart kontraktem.

I když se jedná o velmi základní příklad, měl by vám poskytnout dobrý výchozí bod pro objevování vzrušujícího světa vývoje Web3.

Sledujte mě pro další tutoriál, nebo prosím diskutujte v komentářích