@kentcdodds/package-app-kit
Design tokens, PWA install/update, About/version, cache helpers, and optional realtime notes sync for Kody package apps.
starter-tanstack/README.template.md
57 lines · 2.7 KB · MarkdownAPP_TITLE
Intent
Desktop + mobile friendly Kody package app scaffolded from @kentcdodds/package-app-kit starter-tanstack/.
Replace this Intent with the product goal before the first real publish.
Stack
- TanStack Router + React under the framework-agnostic host —
app/router.tsremounts +export default { fetch }(nokody.app.runtime) - Root
tsconfig.jsonwith"jsx": "react-jsx"+"jsxImportSource": "react"(standard React — not remix/component) @tanstack/react-routerroute tree (app/routeTree.tsx) with Workers SSR viareact-dom/server.edgerenderToReadableStream(no TanStack Start / Vite)- Mount-prefixed routes (
basepath+ remount) andcreateRoutes(appBasePath)href helpers - Controllers + notes POST with
packageStorage(); JSONAcceptfor client loaders - Browser
hydrateRootentry (app/assets/entry.ts) +RouterProvider - Static assets (
public/styles.css,public/sw.jsvia__version.json) - Kit: design tokens CSS, record-version / About, install CTA + update banner, Notes form + double-check
List mark
Identity/list icon: .kody/icon.png (scaffold ships .kody/icon.svg). Replace with your logo. PWA icons stay under /icons/ via the kit — not in .kody/.
After scaffolding
See After scaffolding in AGENTS.md: brand the list mark + PWA icons, fill titles/description, keep local record-version, confirm the TanStack recipe, and match manifest theme colors to the mark.
Develop locally
You need Node 24+ and git.
git clone https://kody.codes/__PACKAGE_NAME__.git
cd __PACKAGE_ID__
npm install
npm run setup # first time only: kody login + git access
npm run dev # local app with mock data and fake credentialsCommon scripts:
npm run dev: run the app locally on mock data (npm run dev:produses your real data)npm run fetch -- /health: request one path without opening a browsernpm run job -- <name>,npm run webhook -- <name> --body fixtures/webhook.example.json,npm run emit -- <event> --body fixtures/event.example.json: trigger jobs, webhooks, and events oncenpm run check,npm run typecheck,npm test: catch problems before you shipnpm run publish:kody: run tests and the pre-publish check, then publish what you pushed
Ship changes with git push, then npm run publish:kody. No terminal? Ask your Kody agent to make and publish changes instead; AGENTS.md has the full workflow.
After publish
Call this package's ./record-version (local packageStorage), not the kit's:
import recordVersion from 'kody:__PACKAGE_NAME__/record-version'
await recordVersion({ sha: '<published_commit>', message: '<commit message>' })