React Contract Event Log Block

A React and Next.js smart contract event log viewer built with shadcn/ui and Tailwind CSS for decoded events.

A React and Next.js smart contract event log viewer built with TypeScript, shadcn/ui, and Tailwind CSS. Uses shadcn/ui Badge and Button components to display decoded event parameters, block numbers, and transaction links with real-time filtering for Transfer, Approval, and Swap events. Perfect for protocol dashboards, blockchain analytics tools, and Web3 developer consoles.

React Contract Event Log Block preview

Scroll to load preview

Installation

Install

Pro block

npx shadcn@latest add https://www.shadcn.io/r/web3-contract-events.json

npx shadcn@latest add https://www.shadcn.io/r/web3-contract-events.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/web3-contract-events.json

bunx shadcn@latest add https://www.shadcn.io/r/web3-contract-events.json

ABI Decoder

Decode transaction calldata

Function Call

Execute smart contract functions

Block Explorer

Browse blockchain data

Smart Contract

Interact with smart contracts

Activity Feed

Real-time blockchain activity

Mempool Viewer

See pending transactions

FAQ

Last updated on March 24, 2026

Was this page helpful?

React Contract Deploy Wizard Block

A React and Next.js smart contract deploy wizard built with shadcn/ui and Tailwind CSS for guided deployment.

React Contributor Rewards Block

A React and Next.js DAO contributor rewards tracker built with shadcn/ui and Tailwind CSS for token claims.

React Contract Event Log Block