2025-11-02 01:08:12 -06:00

96 lines
3.2 KiB
Markdown

# CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
## Project Overview
This is a Next.js 15 website for a Minecraft server (BiohazardVFX) deployed on Cloudflare Workers via OpenNext. The site displays real-time server status, player statistics, and server information by integrating with the Plan server analytics API.
## Development Commands
```bash
# Development server with Turbopack
npm run dev
# Build for production
npm run build
# Start production server locally
npm start
# Lint code
npm run lint
# Deploy to Cloudflare
npm run deploy
# Preview deployment locally
npm run preview
# Generate Cloudflare types
npm run cf-typegen
```
## Architecture
### Deployment Stack
- **Framework**: Next.js 15 (App Router)
- **Runtime**: Cloudflare Workers (Edge runtime)
- **Adapter**: `@opennextjs/cloudflare` - converts Next.js to Cloudflare Workers format
- **Domain**: Routes configured for `minecraft.biohazardvfx.com`
### Key Integration Points
**Plan Analytics API**
- Base URL: `https://stats.biohazardvfx.com`
- Server name: `BiohazardVFX`
- The `/api/server-status` route (src/app/api/server-status/route.ts:24) fetches from `/v1/serverOverview` endpoint
- Data refreshes every 30 seconds (both API cache and client polling)
- Returns: online players, uptime, total players, unique players (7d), average TPS
**Edge Runtime**
- All API routes use `export const runtime = 'edge'` (src/app/api/server-status/route.ts:3)
- Static assets served from `.open-next/assets` directory
- Worker entry point: `.open-next/worker.js`
### Component Architecture
**Client Components** (use 'use client' directive)
- `ServerStatus` (src/components/server-status.tsx) - Polls `/api/server-status` every 30s
- `PlayerActivityChart` (src/components/player-activity-chart.tsx) - Uses Recharts for visualization (currently mock data)
- `Hero` - Main landing section
**UI System**
- Uses shadcn/ui components (New York style)
- Path aliases configured: `@/*``./src/*`
- Components in `src/components/ui/` (Button, Card, Chart, FloatingPanel)
- Tailwind CSS v4 with CSS variables for theming
- Geist font family (Sans + Mono) loaded via `next/font/google`
**Page Structure**
- `src/app/page.tsx` - Main landing page with background image overlay
- `src/app/layout.tsx` - Root layout with fonts and Sonner toast notifications
- Background image: `/backgroundimg.avif` with gradient overlays
### Data Flow
1. Client component mounts → `useEffect` triggers initial fetch
2. Fetch → `/api/server-status` (Edge runtime)
3. API route → Plan Analytics `/v1/serverOverview`
4. Response cached for 30s via Next.js `revalidate`
5. Client polls every 30s via `setInterval`
### Important Files
- `wrangler.jsonc` - Cloudflare Workers configuration
- `open-next.config.ts` - OpenNext adapter settings (R2 cache disabled)
- `components.json` - shadcn/ui configuration
- `.dev.vars` - Environment variables for local development
## Notes
- TypeScript strict mode enabled
- Player list is currently unavailable via Plan's JSON API (only websockets/HTML parsing)
- PlayerActivityChart uses mock data - needs integration with Plan's graph API endpoints
- The site uses Cloudflare's `nodejs_compat` flag for Node.js APIs in Workers