Skip to main content
Technical Docs

Documentation

Complete technical guide for developers and users

Overview

Chainyze is a Next.js 14 application built with TypeScript and Tailwind CSS. It provides multi-chain wallet analytics through a clean, responsive web interface.

Main Features

Multi-chain wallet analysis (15+ chains)
Portfolio value calculation
Token holdings breakdown
NFT preview and collections
Transaction history tracking
Risk scoring algorithms
AI-style insight summaries
Demo mode with mock data

Tech Stack

⚡Framework

Next.js 14 (App Router)

📘Language

TypeScript

🎨Styling

Tailwind CSS

📊Charts

Recharts

📅Date formatting

date-fns

🚀Deployment

Vercel / Cloudflare Pages

Configuration

🔗 Chains Config

Chain definitions are located in lib/config/chains.ts. Each chain includes: id, label, chainId, nativeToken, explorerUrl, and optional RPC URL.

🔑 Environment Variables

✓CHAINYZE_DEMO_MODE - Enable/disable demo mode
✓CHAINYZE_DEFAULT_CHAIN - Default chain (e.g., "ethereum")
✓CHAINYZE_ETH_API_KEY - Ethereum API key
✓CHAINYZE_POLY_API_KEY - Polygon API key
✓CHAINYZE_ARB_API_KEY - Arbitrum API key
✓CHAINYZE_BASE_API_KEY - Base API key
✓CHAINYZE_BSC_API_KEY - BSC API key
✓CHAINYZE_OPTIMISM_API_KEY - Optimism API key
✓CHAINYZE_AVALANCHE_API_KEY - Avalanche API key
✓CHAINYZE_ZKSYNC_API_KEY - zkSync Era API key
✓CHAINYZE_SCROLL_API_KEY - Scroll API key
✓CHAINYZE_LINEA_API_KEY - Linea API key
✓CHAINYZE_BLAST_API_KEY - Blast API key
✓CHAINYZE_MANTLE_API_KEY - Mantle API key
✓CHAINYZE_CELO_API_KEY - Celo API key
✓CHAINYZE_GNOSIS_API_KEY - Gnosis API key
✓CHAINYZE_MOONBEAM_API_KEY - Moonbeam API key
✓CHAINYZE_FANTOM_API_KEY - Fantom API key
✓Pattern: CHAINYZE_{CHAIN}_API_KEY for additional chains

🎮 Demo Mode

Demo mode is automatically enabled if no API keys are configured. It uses deterministic mock data from lib/utils/mockData.ts.

Data Providers

The API layer is structured to support multiple providers. Current implementation uses mock data, but the structure is ready for integration with providers like:

🔌Alchemy
🔌Infura
🔌Moralis
🔌Custom RPC endpoints

To integrate a provider:

  1. Extend the base provider interface in lib/api/providers/base.ts
  2. Update API functions in lib/api/ to use your provider
  3. Add API keys to environment variables

Note: Consider rate limits and implement caching for production use.

Extending the App

🔗Adding a New Chain

  1. Add chain definition to lib/config/chains.ts
  2. API key detection is automatic - no code changes needed
  3. Add API key environment variable following pattern: CHAINYZE_{CHAIN}_API_KEY

📊Adding a New Panel

  1. Create a new component in components/wallet/
  2. Add it to the wallet page layout
  3. Follow the existing pattern of Card-based components

⚠️Modifying Risk Scoring

  1. Edit lib/utils/risk.ts
  2. The computeRiskScore() function contains all heuristics
  3. Adjust thresholds and scoring logic as needed

Monetization

AdSense placeholder divs are included with specific IDs for easy integration:

⬆️ad-hero-top

Top of home page

📌ad-sidebar

Sidebar on home page

⬇️ad-footer

Footer area

Replace AdPlaceholder components with your AdSense script. High-engagement pages (wallet analyzer, docs) are ideal for monetization.