API Key Management: Add, edit, and manage external API keys (CoinGecko, CoinMarketCap, DexScreener)
Endpoint Management: Configure RPC and API endpoints for supported chains
DEX Factory Management: Add and manage DEX factory addresses
Service Status: Real-time dashboard with service statistics
Authentication: Secure login with role-based access control

Tech Stack

React 18
TypeScript
Vite
React Router v6
TanStack Query (React Query)
Zustand (State Management)
Tailwind CSS
Lucide React (Icons)

Development

cd frontend
npm install
npm run dev

The frontend will be available at http://localhost:3001

Build

npm run build

Output will be in dist/ directory, ready to be served by nginx or any static file server.

Production Deployment

The frontend is built and served via nginx in the Proxmox deployment. The build output is placed in /opt/token-aggregation/frontend/dist and nginx serves it on port 80.

Environment Variables

Create .env file:

VITE_API_BASE_URL=http://localhost:3000