Mercurial
annotate .claude/skills/zenbu-personal-site/SKILL.md @ 259:667156fcd3e3
Add dev-only cyberpunk JRPG page
| author | MrJuneJune <me@mrjunejune.com> |
|---|---|
| date | Wed, 05 Aug 2026 09:19:41 -0700 |
| parents | 60a876c4587a |
| children | 1f9877b637e9 |
| rev | line source |
|---|---|
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
1 --- |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
2 name: zenbu-personal-site |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
3 description: Use this skill when updating the mrjunejune personal website, blog, resume, tools, notes/editor APIs, uploads, PWA assets, or deployment bundle. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
4 --- |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
5 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
6 # Mrjunejune Personal Site |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
7 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
8 Use this skill for `mrjunejune/`, the personal website served by a C backend. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
9 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
10 ## Structure |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
11 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
12 - `mrjunejune/main.c`: C web server, routes, APIs, S3 upload URL generation, editor persistence, media conversion, WebSocket chat. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
13 - `mrjunejune/src/`: static site source files and HTML templates. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
14 - `mrjunejune/src/parts/`: shared HTML includes used by `{{...}}` template placeholders. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
15 - `mrjunejune/src/public/`: public assets, PWA files, media, generated JS, icons, resume PDF. |
|
256
30c2196d03d4
[site] Integrate Zenbu themes and components
MrJuneJune <me@mrjunejune.com>
parents:
248
diff
changeset
|
16 - Zenbu UI assets are copied from `//design_system:components` and |
|
30c2196d03d4
[site] Integrate Zenbu themes and components
MrJuneJune <me@mrjunejune.com>
parents:
248
diff
changeset
|
17 `//design_system:styles` into `src/public/design-system/` by Bazel. Do not |
|
30c2196d03d4
[site] Integrate Zenbu themes and components
MrJuneJune <me@mrjunejune.com>
parents:
248
diff
changeset
|
18 hand-copy or fork shared component files. |
|
258
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
19 - Preserve the site's established transparent content and plain header/icon |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
20 presentation. Use `appearance="plain"` when shared behavior is useful, and |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
21 do not introduce cards, shadows, borders, or surfaces without a concrete UX |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
22 reason. |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
23 - Every site-owned `zen-button` declares an `xs` / `sm` / `md` / `lg` / `xl` |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
24 size. Site CSS must consume inherited `--zenbu-control-*` aliases plus |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
25 `--zenbu-sys-padding-*` and typography roles instead of hardcoding control |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
26 padding or height. |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
27 - New site CSS uses `--zenbu-sys-*` semantic roles. Do not consume |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
28 `--zenbu-ref-color-*` or add new `--zen-*` compatibility-token usage. |
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
29 - `mrjunejune/test/`: integration tests and snapshots. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
30 - `mrjunejune/BUILD`: Bazel build, bundle, asset movement, and test-visible filegroups. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
31 - `mrjunejune/.config` and `.config.development`: server configuration. Do not commit secrets. |
|
259
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
32 - Experimental pages use the `MRJUNEJUNE_ENABLE_DEV_PAGES` compile-time gate. |
|
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
33 Their static files belong in `src_files_development`; production |
|
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
34 `src_files`, `mrjunejune_server`, and `mrjunejune_server_bundle` must exclude |
|
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
35 them. |
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
36 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
37 ## How rendering works |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
38 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
39 Handlers allocate a response body from `Dowa_Arena`, render an HTML file with `Seobeo_Render_Html_FilePath`, and return a response map: |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
40 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
41 ```c |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
42 Seobeo_Request_Entry *resp = NULL; |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
43 char *final_body = Dowa_Arena_Allocate(arena, 50 * 1024); |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
44 Seobeo_Render_Html_FilePath(final_body, "/tools/index.html", arena); |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
45 Dowa_HashMap_Push_Arena(resp, "body", final_body, arena); |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
46 return resp; |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
47 ``` |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
48 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
49 The simple template renderer replaces `{{...}}` tokens with file contents loaded through `Seobeo_Web_LoadFile`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
50 |
|
258
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
51 Before adding or changing HTML controls, read |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
52 `design_system/wiki/HTML_AUTHORING.md` and `PRIMITIVE_MAP.md`. Every authored |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
53 interactive control must have exactly one appropriate Zenbu owner while |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
54 retaining its native element underneath. |
|
60a876c4587a
[ui] Add semantic primitive ownership
MrJuneJune <me@mrjunejune.com>
parents:
256
diff
changeset
|
55 |
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
56 ## Routes and features |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
57 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
58 Existing route areas include: |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
59 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
60 - Home, resume, tools, markdown-to-HTML, file converter, blog, talk/chat, notes, and editor pages. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
61 - Redirect helpers built with `CREATE_REDIRECT_HANDLER`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
62 - File/media conversion APIs using `ffmpeg` and temporary files under `/tmp`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
63 - S3 presigned upload URL API using `Authorization: Bearer <token>`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
64 - Editor save/load APIs backed by `deita` SQLite. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
65 - WebSocket chat broadcasting through seobeo WebSocket server APIs. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
66 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
67 When adding pages, add the HTML/CSS/JS under `src/`, register a route in `main.c`, and update tests/snapshots if the route should be covered. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
68 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
69 ## Build and test |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
70 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
71 ```bash |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
72 bazel build //mrjunejune:mrjunejune_server |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
73 bazel build //mrjunejune:mrjunejune_server_bundle |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
74 bazel test //mrjunejune/test:integration_test |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
75 ``` |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
76 |
|
259
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
77 Use the development server for experimental pages and debug networking: |
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
78 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
79 ```bash |
|
259
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
80 bazel run //mrjunejune:mrjunejune_server_dev -c dbg |
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
81 ``` |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
82 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
83 ## Production-minded checklist |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
84 |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
85 - Use Dowa's fixed-width aliases and `boolean`/`TRUE`/`FALSE` in first-party C |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
86 instead of introducing `<stdint.h>` `_t` types or `<stdbool.h>` `bool`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
87 - Keep auth-protected APIs strict: missing auth should be `401`, invalid token `403`, malformed JSON/input `400`, unavailable DB/S3/ffmpeg `500`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
88 - Never hardcode secrets. Read configuration from `.config` or environment wiring already used by the Bazel target. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
89 - For uploads and downloads, validate filenames and content lengths before touching `/tmp`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
90 - For binary responses, set `content-length` and avoid string-only operations on body bytes. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
91 - If a route is part of the public website, add or update snapshot coverage in `mrjunejune/test`. |
|
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
92 - Keep PWA changes consistent across `manifest.json`, `sw.js`, icons, and `PWA_SETUP.md`. |
|
259
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
93 - Site themes use `data-zen-theme` with Auto, Paper, Ink, Playful, and |
|
667156fcd3e3
Add dev-only cyberpunk JRPG page
MrJuneJune <me@mrjunejune.com>
parents:
258
diff
changeset
|
94 Cyberpunk states. |
|
256
30c2196d03d4
[site] Integrate Zenbu themes and components
MrJuneJune <me@mrjunejune.com>
parents:
248
diff
changeset
|
95 Preserve the More Sugar font aliases and keep theme-specific values in shared |
|
30c2196d03d4
[site] Integrate Zenbu themes and components
MrJuneJune <me@mrjunejune.com>
parents:
248
diff
changeset
|
96 design-system tokens rather than branching inside components. |
|
248
b8b6e726964a
[style] Use Dowa type aliases in C
MrJuneJune <me@mrjunejune.com>
parents:
diff
changeset
|
97 - Reuse `seobeo`, `dowa`, `deita`, `s3`, and `markdown_converter` instead of adding parallel implementations. |