Web3小白

Web3小白

玩转Web3,我是Web3小白!

ゼロから始めるWeb3アプリケーションの構築:Ethereum、Metamask、Solidity実践チュートリアル

Web3 アプリを構築することの核心は、ブロックチェーンネットワークに接続し、ユーザーボレットを管理し、スマートコントラクトを作成することです。イーサリアムは現在最も主流なスマートコントラクトプラットフォームであり、Metamask は主流のウォレットツールとして、ユーザーが資産を管理し、取引に署名するのを便利にします。Solidity はイーサリアムスマートコントラクトの主要なプログラミング言語です。以下では、ゼロから始めてシンプルな Web3 アプリを構築する手順を説明します。

イーサリアム イーサ Ethereum ETH

イーサリアムネットワークに接続する#

イーサリアムと対話するには、まずイーサリアムノードに接続する必要があります。一般的な方法は、Web3.js または Ethers.js の 2 つの JavaScript ライブラリを使用することです。ここでは Ethers.js を推奨します。API がシンプルで、使いやすいです。

`import { ethers } from "ethers";

const provider = new ethers.providers.Web3Provider(window.ethereum);`

このコードは、ブラウザにインストールされている Metamask ウォレットを呼び出し、ユーザーが現在選択しているイーサリアムネットワークに自動的に接続します。ユーザーが初めて訪問する際、Metamask は認可リクエストをポップアップし、アプリがウォレットアドレスにアクセスすることを許可します。

Metamask を使用してウォレットを管理する#

Metamask は単なるウォレットではなく、ユーザーのアイデンティティの入り口でもあります。これを通じて、ユーザーは取引に署名し、資産を管理できます。

ユーザーにウォレットアドレスへのアクセスを許可するようリクエストします:

`async function requestAccount() {

await window.ethereum.request({ method: 'eth_requestAccounts' });

}`

この関数を呼び出すと、ユーザーは Metamask のポップアップを見て、認可を確認します。認可が成功した後、provider を通じてユーザーアドレスを取得できます:

`const signer = provider.getSigner();

const userAddress = await signer.getAddress();

console.log ("現在のユーザーアドレス:", userAddress);`

これでウォレットの接続とユーザーアイデンティティの取得が完了しました。

シンプルな Solidity スマートコントラクトを書く#

Solidity はイーサリアムスマートコントラクトの主流言語です。数字を保存するシンプルなコントラクトを書いてみましょう:

`// SPDX-License-Identifier: MIT

pragma solidity ^0.8.0;

contract SimpleStorage {

uint256 private storedData;

function set(uint256 x) public {

    storedData = x;

}

function get() public view returns (uint256) {

    return storedData;

}

}`

このコントラクトには 2 つの関数があります:set は数字を保存するために使用され、get は数字を読み取るために使用されます。

スマートコントラクトをデプロイする#

コントラクトをデプロイするには、Remix IDE などの開発環境が必要です。または、Hardhat や Truffle などのフレームワークを使用することもできます。ここでは Remix を推奨します。操作が簡単です。

  1. Remix IDE を開きます。
  2. 新しいファイルを作成し、上記の Solidity コードを貼り付けます。
  3. 適切なコンパイラバージョンを選択し、コンパイルをクリックします。
  4. Metamask ウォレットに接続し、テストネット(例えば Goerli)を選択します。
  5. デプロイをクリックすると、Metamask が取引確認をポップアップし、確認後にブロックの確認を待ちます。

デプロイが成功すると、コントラクトアドレスが得られます。

フロントエンドからスマートコントラクトを呼び出す#

コントラクトをデプロイした後、フロントエンドはコントラクトアドレスと ABI を使用してコントラクトと対話します。

`const contractAddress =" あなたのコントラクトアドレス ";

const contractABI = [/* Remix コンパイル後生成された ABI */];

const contract = new ethers.Contract(contractAddress, contractABI, signer);

//set 関数を呼び出す

async function setValue(value) {

const tx = await contract.set(value);

await tx.wait();

console.log ("保存成功");

}

//get 関数を呼び出す

async function getValue() {

const value = await contract.get();

console.log ("現在の保存値:", value.toString ());

}`

setValue を呼び出すと取引が開始され、ユーザーは Metamask で確認する必要があります。getValue の呼び出しは読み取り専用操作であり、取引手数料は必要ありません。

国内ユーザー向け取引所の代替ドメイン推奨#

暗号通貨の操作において、取引所の公式ウェブサイトにアクセスすることは一般的です。国内ユーザーは 超リンクナビゲーション が提供する取引所の代替ドメインを使用して、安定したアクセスを確保できます:

これらの代替ドメインは、ユーザーが取引所の最新の公式アドレスに迅速にアクセスできるようにし、ネットワークの変動によるアクセス不能を回避します。

まとめ#

Web3 アプリを構築する上での重要なポイントは、イーサリアムネットワークに接続し、ユーザーボレットを管理し、スマートコントラクトを作成することです。Ethers.js と Metamask を使用することで、フロントエンドは簡単にウォレット接続と取引署名を実現できます。Solidity スマートコントラクトはビジネスロジックを担当し、テストネットにデプロイされた後に呼び出すことができます。国内ユーザーが暗号通貨の操作を行う際には、超リンクナビゲーション が提供する取引所の代替ドメインを使用することで、スムーズなアクセスを確保できます。これらの基礎を習得すれば、Web3 アプリ開発はもはや難しくなく、実践が最良の学習方法です。

読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。