Beatoz Scan Frontend

A React-based blockchain explorer for blocks, transactions, validators, accounts, and tokens. Real-time Socket.IO updates run through a Web Worker to keep heavy list and detail views responsive.

Role: Solo builder · architecture, implementation, and operations
Period: 2025
Organization: Beatoz Labs

01 / Overview

A React-based blockchain explorer for blocks, transactions, validators, accounts, and tokens. Real-time Socket.IO updates run through a Web Worker to keep heavy list and detail views responsive.

DECISION / AThe problem

What made this system difficult?

Needed real-time updates without blocking the UI, plus clean separation of API/Socket/RPC endpoints across environments.

DECISION / BThe response

How did the design respond?

Built a Vite + React + TS app with React Router v6 and Recoil state. Implemented Axios API clients and Web3/RPC modules, and offloaded Socket.IO realtime updates to a Web Worker. Managed environment switching via env files.

03 / Technology

01Vite02React03TypeScript04React Router05Recoil06Axios07Socket.IO08Web Worker09Web3

04 / Technical record

Overview

Solo-built blockchain explorer frontend for Beatoz.

Key Components

Vite build and React entry points (src/main.tsx, src/app-entry.tsx)
React Router v6 routing for explorer domains (blocks/tx/validators/accounts/tokens/assets)
Recoil global state and Web3/RPC integration modules
Web Worker + Socket.IO for real-time block/tx updates
Environment separation via env files for API/Socket/RPC endpoints

05 / Project evidence

PROJECT VISUAL / CONCEPT IMAGE