← Back to all products
$10
Prover Monitoring
Monitor prover node performance — proof generation time, hardware metrics, and job completion rates.
TypeScriptJSONMarkdownReact
📁 File Structure 18 files
prover-monitoring/
├── LICENSE
├── README.md
├── package.json
├── security-notes.md
├── src/
│ ├── App.tsx
│ ├── components/
│ │ ├── Dashboard/
│ │ │ ├── EarningsPanel.tsx
│ │ │ ├── MetricsGrid.tsx
│ │ │ ├── ProofChart.tsx
│ │ │ └── ProverTable.tsx
│ │ └── Layout/
│ │ ├── DashboardLayout.tsx
│ │ └── Sidebar.tsx
│ ├── hooks/
│ │ ├── useProverData.ts
│ │ └── useWebSocket.ts
│ ├── services/
│ │ ├── api.ts
│ │ └── formatters.ts
│ └── types/
│ └── index.ts
├── tsconfig.json
└── vite.config.ts
📖 Documentation Preview README excerpt
Prover Monitoring Dashboard
CryptoForge Prover Market — Product #4
Real-time monitoring dashboard for ZK prover operators
Overview
A React/TypeScript monitoring dashboard for ZK prover operators. Track proof generation
performance, job completion rates, gas costs, and earnings across multiple prover nodes.
Features
- Real-time prover node status monitoring
- Proof generation metrics and charts
- Earnings tracking and profitability analysis
- Gas cost analytics
- WebSocket support for live updates
- Dark theme matching CryptoForge brand
Installation
npm install
npm run dev
Configuration
Set environment variables or update src/services/api.ts:
VITE_API_URL=http://localhost:3001/api
VITE_WS_URL=ws://localhost:3001/ws
VITE_API_KEY=your-api-key
Tech Stack
- React 18 + TypeScript
- Vite for bundling
- Recharts for data visualization
- TanStack React Query for data fetching
- Tailwind CSS for styling
- ethers.js for Ethereum data formatting
License
MIT — see [LICENSE](./LICENSE)
📄 Code Sample .ts preview
vite.config.ts
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import path from "path";
export default defineConfig({
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
server: {
port: 5173,
proxy: {
"/api": {
target: "http://localhost:3001",
changeOrigin: true,
},
"/ws": {
target: "ws://localhost:3001",
ws: true,
},
},
},
});