🏙️ BlockVerse — Web3 dApp on Sepolia

A decentralized application built with Solidity, Ethers.js, and MetaMask.
Five smart contracts. No frameworks. No backend. Fully on-chain.

Live Demo

🔗https://blockverse-web3-dapp.netlify.app/

Connect MetaMask on Sepolia Testnet to interact with the contracts.

---

What This Is

BlockVerse is a Web3 dApp I built to learn how smart contracts work in practice — not just in theory.

It covers the core pillars of Web3 development:

• ERC-20 — mint and track fungible tokens
• ERC-721 — issue verifiable NFT certificates
• DAO Governance — create proposals, vote, execute on-chain
• On-chain Storage — laws stored directly on the blockchain
• Guestbook — anyone can sign with their wallet and leave a permanent message

All contracts are deployed on Sepolia Testnet.

---

Tech Stack

Layer	Technology
Smart Contracts	Solidity ^0.8.20
Frontend	Vanilla JS (ES Modules)
Blockchain Library	Ethers.js v6
Wallet	MetaMask
Network	Sepolia Testnet
Standards	ERC-20, ERC-721, OpenZeppelin

---

Project Structure

BlockVerse/
├── index.html
└── assets/
    ├── css/
    │   └── style.css
    └── js/
        ├── app.js
        ├── canvas.js
        ├── config/
        │   └── contracts.js       ← contract addresses + ABIs
        ├── core/
        │   ├── connect.js         ← wallet connection
        │   ├── helpers.js         ← shared UI utilities
        │   ├── loader.js          ← loads all data after connect
        │   └── state.js           ← global state manager
        └── rooms/
            ├── room1.foundation.js
            ├── room2.treasury.js
            ├── room3.identity.js
            ├── room4.council.js
            └── room5.guestbook.js 

---

Smart Contracts

Room 1 — CityLaw

Stores on-chain laws. Only the owner can add laws. Anyone can read them.
Functions: addLaw, getLaw, setCityName

Room 2 — RewardToken (ERC-20)

A mintable ERC-20 token built with OpenZeppelin.
Functions: mint, balanceOf, totalSupply, transfer

Room 3 — WorkshopCertificateNFT (ERC-721)

Issues NFT certificates with on-chain metadata.
Functions: mintCertificate, ownerOf, getCertificate, totalCertificates

Room 4 — BlockCityVoting (DAO)

On-chain governance. Create proposals, vote YES/NO, execute if passed.
Functions: createProposal, vote, execute, getResults

Room 5 — BlockVerse Guestbook

Anyone with a wallet can sign once and leave a permanent message on-chain.
Functions: sign, getEntry, getRecentEntries, totalEntries

---

Running Locally

Requirements:

• VS Code
• Live Server extension
• MetaMask browser extension
• Sepolia ETH from a faucet

Steps:

1. Clone the repo
2. Open folder in VS Code
3. Add your contract addresses to assets/js/config/contracts.js
4. Right-click index.html → Open with Live Server
5. Connect MetaMask → switch to Sepolia → interact

Do not open via file:// — ES Modules require a local server.

---

What I Learned

• How a frontend actually talks to a smart contract using Ethers.js
• The difference between view functions (free) and state-changing functions (gas)
• How ERC-20 and ERC-721 standards work under the hood
• How DAO voting logic is implemented on-chain
• How to structure a modular JavaScript Web3 project
• Writing and deploying my own original smart contract (Guestbook)

---

Possible Extensions

• Token-gated voting — require BCT balance to cast a vote
• Staking contract — lock tokens and earn yield
• IPFS metadata — store NFT images off-chain
• Event listeners — real-time UI updates on contract events
• Multi-wallet support — switch accounts without refreshing

---