Thank you for reading this. kaichen.dev is primarily a personal site, but bug fixes, documentation improvements, and small, focused enhancements are welcome.
Before you contribute:
- Read CODE_OF_CONDUCT.md.
- Read SECURITY.md — never file public issues with exploit details.
- Skim the README for architecture, scripts, and environment variables.
| Audience | Also read |
|---|---|
| Human contributors | This file + README |
| AI coding agents (Cursor, Claude Code, etc.) | AGENTS.md — branch + PR workflow and commit conventions are mandatory |
All changes go through pull requests to main; do not push directly to main, even when permissions allow.
- Node.js 20 (matches CI and
@types/nodeinpackage.json). - npm — the repo uses
package-lock.json. For reproducible installs usenpm ci(as CI does).
git clone https://github.com/kaiiiichen/kaichen.dev.git
cd kaichen.dev
npm install
cp .env.example .env.localEdit .env.local as needed. You do not need every integration to run the app locally:
- Missing Spotify / GitHub keys usually degrade specific widgets.
- Supabase is optional for
/api/spotify/now-playingonly;next buildsucceeds without Supabase env (see README — Environment variables, subsection CI builds without live Supabase).
Never commit .env.local, .env.vercel.check, tokens, or SENTRY_AUTH_TOKEN.
package.json runs postinstall to set git config core.hooksPath .githooks. The prepare-commit-msg hook appends a Co-authored-by trailer for Claude on each commit (see AGENTS.md). If your environment skips hooks (e.g. some UIs), add the trailer manually when required by project policy.
Before opening or updating a PR, run:
npm run lint
npm run typecheck
npm run test
npm run build.github/workflows/ci.yml runs these steps on push and pull_request to main. Keep CI green.
-
Branch from up-to-date
main:git checkout main && git pull --ff-only git checkout -b <type>/<short-description>
Prefix examples:
fix/,feat/,chore/,docs/,refactor/. -
Commit with clear messages (conventional style is appreciated:
type: summary). -
Push and open a PR against
main. GitHub will suggest the pull request template. -
Describe what changed and why. Link issues with
Fixes #123when applicable. -
Update README.md and/or
.env.exampleif you change user-visible behavior, new routes, or required/optional environment variables.
- Next.js 16 App Router, React 19, TypeScript, Tailwind CSS 4, Vitest 4 for unit tests.
devandbuilduse Next.js' default Turbopack bundler (no MDX in this repo).- Fonts: Geist Sans/Mono provide the base type system; Nunito is used across the editorial UI (nav, headings, cards, lists, and controls). See
app/globals.css,app/layout.tsx, andapp/fonts.ts.
- Match existing component patterns, naming, and Tailwind usage.
- Preserve the shared interaction palette: structural/link blue (
--link-color), yellow hover/focus (--link-hover-color), and the layered blue.mag-cardborder/shadow hierarchy. - Keep
PageTocdiscovery intact when restructuring pages: prefer explicitTocSectiontargets or existing.mag-labelsections, and exclude fullscreen routes such as/music-for-life/map. - Prefer small, reviewable diffs over large refactors unless discussed in an issue first.
- Dark mode: new UI should work in light and dark (
dark:variants and existing theme patterns).
- Add variable names (and short comments) to
.env.examplewhen introducing new configuration — never real secrets. - Do not add production keys, personal tokens, or Sentry auth tokens to the repository.
If you touch OAuth callbacks, API routes, or Supabase policies, coordinate with the maintainer and document behavior in README or SECURITY as appropriate.
See the Forking this project section in README.md for a checklist of files to replace (Spotify app, GitHub repos, Supabase, etc.).
Use issue templates for bugs and features. For security issues, follow SECURITY.md instead of posting exploit details in public issues.
For small questions, open a GitHub Issue or Discussion. This is a side project; response time may vary.