< Back to Works
HASH: 0x0024...2025

Beatoz Scan Frontend

Blockchain Explorer

System Description

Solo-built Beatoz blockchain explorer frontend with block/tx/validator/account/token views and Web Worker + Socket.IO based real-time updates.

Technologies

ViteReactTypeScriptReact RouterRecoilAxiosSocket.IOWeb WorkerWeb3
Beatoz Scan Frontend
ROLE: SOLO_DEVELOPERDOMAIN: BLOCKCHAIN
!

PROBLEMThe Challenge

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

✓

SOLVEDThe Solution

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.

Technical Deep Dive

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