CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Project Overview

Splatoon3.ink displays Splatoon 3 map rotations, Salmon Run schedules, SplatNet gear, and more. It has a Vue 3 frontend (src/) and a Node.js backend (app/) in a single repository. The backend fetches data from Nintendo's SplatNet3 GraphQL API via nxapi and publishes updates to social media (Mastodon, Bluesky, Threads).

Commands

npm run dev            # Vite dev server with HMR
npm run build          # Production frontend build to dist/
npm run lint           # ESLint check
npm run lint-fix       # ESLint auto-fix
npm test               # Run Vitest once
npm run test:watch     # Vitest in watch mode

Backend commands (require .env configuration):

npm run splatnet:quick # Quick data update (skip localizations, X-Rank, fest rankings)
npm run splatnet       # Default data update
npm run splatnet:all   # Full data update (all regions, all features)
npm run social         # Post status updates to social media
npm run social:test    # Test social posting (writes to files)
npm start              # Full production: sync → splatnet → social → cron

Architecture

Frontend (src/): Vue 3 + Vue Router + Pinia + Tailwind CSS + vue-i18n (14 languages). Path alias @/ maps to src/. Pinia stores in src/stores/ fetch from /data/*.json endpoints. The useDataStore orchestrates loading schedules, gear, coop, and festival data.

Backend (app/): Node.js CLI dispatched through app/index.mjs. Commands map to actions (splatnet, social, sync, cron, etc.).

Data pipeline: NsoClient (Nintendo auth) → SplatNet3Client (GraphQL queries) → DataUpdaters (app/data/updaters/) → JSON files in dist/data/ → Frontend Pinia stores → Vue components. Images are processed via sharp. Data is optionally archived and synced to S3.

Social media: StatusGenerators (app/social/generators/) create content from data. Clients (app/social/clients/) post to each platform. Screenshots are generated via puppeteer-core + a browserless service.

Scheduling: Cron jobs (app/cron.mjs) run data updates and social posting at intervals.

Code Style

ESLint flat config with Vue, JSDoc, and import-alias plugins
2-space indentation, single quotes, semicolons, trailing commas on multiline
In src/ files, use @/ import alias (e.g., import Foo from '@/components/Foo.vue')
Vue: multi-word component names not required, up to 4 attributes per single line, self-closing void HTML elements
Node.js 22, ESM modules throughout (.mjs extension for backend files, .js/.vue for frontend)

Testing

Tests use Vitest. Test files live alongside source: app/**/*.test.mjs and src/**/*.test.{js,mjs}.

Deployment

Frontend: built to dist/ and deployed to AWS S3 (static hosting)
Backend: Docker container (docker/app/Dockerfile) pushed to GitHub Container Registry
dist/ is not emptied on build (preserves generated dist/data/ from backend)
Browserless runs as a separate Docker service for screenshot generation

3.1 KiB Raw Blame History