Web3 и JS: пишем смарт-контракты на Solidity и взаимодействуем через Ethers.js

Последние несколько лет я активно погружаюсь в мир блокчейна и децентрализованных приложений (dApps). В этой статье я поделюсь своим опытом интеграции блокчейна в веб-приложения: от написания смарт-контрактов на Solidity до их подключения к фронтенду через библиотеку Ethers.js. Вы получите готовые примеры кода, сравнение инструментов и практические рекомендации.

Почему Web3 это будущее веб-разработки?

Web3 это новое поколение интернета, где пользователи владеют своими данными, а приложения работают на блокчейне. В отличие от традиционных веб-приложений, dApps не зависят от централизованных серверов. Это открывает возможности для:

• Прозрачных финансовых операций (DeFi).
• Цифрового права собственности (NFT).
• Децентрализованного управления (DAO).

Пример: За последний год количество активных кошельков в Ethereum выросло на 300%. Это сигнал: веб-разработчикам пора осваивать Web3.

Создаем свой первый смарт-контракт на Solidity

Установка инструментов

1. Node.js (v22+): официальный сайт.
2. Hardhat — фреймворк для разработки:

npm install --save-dev hardhat
npx hardhat init

3. Solidity Compiler:

npm install @nomicfoundation/hardhat-toolbox

Пишем контракт для токена

Создаем файл contracts/MyToken.sol:

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;

contract MyToken {
    string public name = "MyToken";
    string public symbol = "MTK";
    uint256 public totalSupply = 1000000;

    mapping(address => uint256) public balanceOf;

    constructor() {
        balanceOf[msg.sender] = totalSupply;
    }

    function transfer(address to, uint256 amount) external {
        require(balanceOf[msg.sender] >= amount, "Not enough balance");
        balanceOf[msg.sender] -= amount;
        balanceOf[to] += amount;
    }
}

Компиляция и деплой:

npx hardhat compile
npx hardhat node # Запуск локальной сети
npx hardhat run scripts/deploy.js --network localhost

Интеграция блокчейна в веб-приложение через Ethers.js

Настройка проекта

Установите Ethers.js:

npm install ethers

Подключаемся к кошельку MetaMask

Добавьте в ваш JavaScript-код:

import { ethers } from 'ethers';

async function connectWallet() {
    if (window.ethereum) {
        const provider = new ethers.providers.Web3Provider(window.ethereum);
        await provider.send("eth_requestAccounts", []);
        const signer = provider.getSigner();
        const address = await signer.getAddress();
        console.log("Connected:", address);
        return signer;
    } else {
        alert("Установите MetaMask!");
    }
}

Взаимодействие с контрактом

1. Получите ABI контракта после компиляции (файл artifacts/contracts/MyToken.json).
2. Инициализация контракта:

const contractAddress = "0x..."; // Адрес вашего контракта
const abi = [...]; // Вставьте ABI из JSON

async function transferTokens(to, amount) {
    const signer = await connectWallet();
    const contract = new ethers.Contract(contractAddress, abi, signer);
    const tx = await contract.transfer(to, amount);
    await tx.wait();
    console.log("Transfer completed!");
}

Ethers.js или Web3.js: что выбрать?

Сравнительная таблица популярных библиотек:

Рекомендация: Ethers.js лучше подходит для новичков и проектов с упором на фронтенд. Web3.js стоит использовать для сложных взаимодействий с нодами (например, в инфраструктурных решениях).

Советы для веб-разработчиков в Web3

1. Тестируйте на тестовых сетях. Используйте Sepolia или Goerli вместо Mainnet, чтобы избежать потерь средств.
2. Оптимизируйте газ. Сокращайте сложность логики контрактов — это снижает комиссии.
3. Храните секреты в .env. Никогда не коммитьте приватные ключи в Git!
4. Используйте готовые решения. Интегрируйте OpenZeppelin для безопасных контрактов.
5. Мониторьте события. Следите за транзакциями через provider.on("block", callback).

Интеграция блокчейна в веб-приложения это новая реальность. Solidity и Ethers.js предоставляют все необходимые инструменты для старта. Web3-разработка требует понимания не только кода, но и философии децентрализации. Учитесь, экспериментируйте и через год вы сможете называть себя Senior Web3 Developer!