Skip to content

SETUP.md

Latest commit

 

History

History
158 lines (118 loc) · 3.68 KB

SETUP.md

File metadata and controls

158 lines (118 loc) · 3.68 KB

🚀 LavaFlow Setup Guide

Quick Start

1. Install Dependencies

npm install

2. Configure Environment Variables

Create a .env.local file in the root directory:

# Copy the example file
cp .env.example .env.local

Then edit .env.local with your configuration:

# Lava Network
NEXT_PUBLIC_LAVA_REST_API=https://rest.lavenderfive.com:443/lava
NEXT_PUBLIC_LAVA_RPC=https://rpc.lavenderfive.com:443/lava
NEXT_PUBLIC_LAVA_WEBSOCKET=wss://rpc.lavenderfive.com:443/lava/websocket

# Lava SDK (Optional - for advanced features)
NEXT_PUBLIC_LAVA_PROJECT_ID=your_project_id
LAVA_BADGE_SERVER=https://badges.lavanet.xyz

# Database (Optional - for historical data)
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_key

# Optional Services
REDIS_URL=your_redis_url
SENTRY_DSN=your_sentry_dsn

Note: For initial testing, you can use the default Lava Network endpoints. The app will work with mock data if you don't provide a Lava Project ID.

3. Run Development Server

npm run dev

Open http://localhost:3000 in your browser.

4. Build for Production

npm run build
npm start

Project Structure

LavaFlow/
├── app/                    # Next.js App Router pages
│   ├── api/               # API routes
│   ├── calculator/        # Profitability calculator
│   ├── dashboard/         # RPC performance dashboard
│   ├── explorer/          # Block explorer
│   └── generator/         # Template generator
├── components/            # React components
├── lib/                   # Utilities and API clients
├── hooks/                 # Custom React hooks
└── public/               # Static assets

Features Overview

🌋 Block Explorer

  • Real-time blocks with WebSocket updates
  • Transaction search and details
  • Validator information
  • Network statistics

📊 RPC Performance Dashboard

  • Provider metrics (latency, uptime, success rate)
  • Geographic provider map
  • Chain health monitoring
  • Alert system

💰 Profitability Calculator

  • Multi-chain ROI analysis
  • Break-even calculations
  • Earnings projections
  • Chain comparisons

🚀 Template Generator

  • Pre-built dApp templates
  • One-click code generation
  • Multi-chain support
  • Downloadable projects

Troubleshooting

Port Already in Use

If port 3000 is in use:

npm run dev -- -p 3001

Build Errors

Clear Next.js cache:

rm -rf .next
npm run build

TypeScript Errors

Ensure all dependencies are installed:

npm install

Missing Leaflet Styles

If map components don't render correctly, ensure Leaflet CSS is imported. This is already handled in the ProviderMap component.

Next Steps

  1. Get Lava Network Project ID (Optional)

    • Visit Lava Network
    • Create a project to get your Project ID
    • Add it to .env.local

  2. Configure Database (Optional)

    • Set up Supabase for historical data storage
    • Configure Redis for caching (recommended for production)

  3. Deploy to Vercel

    npm i -g vercel
vercel --prod

  4. Customize Styling

    • Edit tailwind.config.ts for custom colors
    • Modify component styles in the components/ directory

Development Tips

  • Use npm run lint to check for code issues
  • The app works with mock data by default
  • Real API integration requires Lava Network credentials
  • WebSocket connections require the correct endpoint URL

Support

For issues or questions: