home/CLAUDE.md

CLAUDE.md

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

Commands

npm start          # Dev server (production mode)
npm run build      # Production build
npm run build:staging  # Staging build
npm run fmt        # Format with Prettier (*.js, style.css, index.html)

No test suite exists. Prettier is the only code quality tool.

Architecture

This is a static IoT learning portal — a single-page app built with vanilla JS and Vite. No framework.

Module responsibilities:

• main.js — entry point, calls initApp()
• app.js — application lifecycle: reads localStorage, wires event listeners, orchestrates everything
• data.js — registry of external learning platform links (OJ, code runners, books, etc.)
• render.js — generates HTML for site cards and pins from data.js entries
• i18n.js — translation system with a t() function; supports 11 language variants (Chinese variants, EN, JA, KO, plus joke languages: wenyan, mars, garbled, binary, meow, emoji)
• theme.js — manages 4 design themes (Fluent, Material You, Terminal, Cyberpunk) and dark/light toggle

Data flow: app.js → reads prefs from localStorage → calls render.js to build the card grid from data.js → applies theme via theme.js → uses i18n.js for all UI strings.

State persistence: language, design theme, and dark/light preference are all stored in localStorage.

Site URLs are injected at build time via import.meta.env.VITE_* environment variables.

Themes: Terminal and Cyberpunk force dark mode; the light/dark toggle is disabled for those themes.