All authors
Claude Skills by lukedj78
github.com/lukedj7856 skills0 installs0 views
- Animated IconsAdd a Motion-animated icon to a Next.js app from a shadcn registry instead of hand-animating an SVG. Two registries, picked from the project''s icon set: **heroicons-animated** (316 icons, `shadcn add @heroicons-animated/<name>`) and **hugeicons-animated** (165 icons, `shadcn add @hugeicons-animated/<name>`, which also installs a shared `lib/use-icon-animation.ts`). Both MIT, both on the `motion` runtime, both copied into your repo as source. This skill owns the install plus the two things th...Votes: 0GitHub stars: 6
- App SecurityCheck whether an app''s own code can be attacked before it ships — vulnerable dependencies, secrets in the code and in git history, Next.js authorization gaps (Server Actions and route handlers without a session check, queries by id with no owner filter — IDOR), data over-exposure, secrets in public env vars, raw SQL — then read the flagged code against an OWASP checklist, with an opt-in dynamic level (Strix) that proves exploits against the app running locally. The fifth pre-deploy gate, bes...Votes: 0GitHub stars: 6
- App VerificationGive a project a manual for proving its features on the real app, written once and kept true: `.claude/skills/verify-<app>/` with how to launch it until it is usable, a read-only doctor check, how to drive it with the repo''s real selectors, what counts as proof and where it goes, how to stop only what it started — plus one feature file per PRD story, seeded from the wireframe screen inventory, and a headless-Chrome render probe (overflow, wrapped headings, text hidden under reduced motion). ...Votes: 0GitHub stars: 6
- Compliance AuditRun a GDPR + EU AI Act compliance audit on an existing dev-flow project (web / mobile / eve agent) and remediate what it finds. Two modes: Audit (scan the codebase and `meta.json#stack` against a 11-point risk register — DSAR, consent/cookies, EU data residency, retention and PII-scrubbing, AI-transparency Art.50, high-risk Annex III, sub-processors — into a report with severity, evidence and article mapping) and Remediate (apply the safe mechanical mitigations, flag the ones needing a legal ...Votes: 0GitHub stars: 6
- Composition Patterns GuideUse when refactoring React or React Native components that suffer from boolean prop proliferation, missing compound structure, prop drilling, or unclear ownership of state. Codifies the 7 Vercel composition-patterns rules for our web + RN stack — composition or explicit variants over boolean props, compound components with shared context, state lifted into providers, children over render props, React 19 (no forwardRef) — plus our colocation rules (Rule of Three, L0/L1/L2, `_components/`). Tri...Votes: 0GitHub stars: 6
- Coss UiSet up or extend a Next.js web app with Coss/UI — the official Cal.com design system, built on Base UI + Tailwind CSS v4 and installed through the shadcn CLI via the namespaced `@coss/*` registry. Two modes: Init (`shadcn init @coss/style` on a new project) and Add (pull `@coss/ui` primitives, single `@coss/<name>` components, or particles into an existing one). Sets `meta.json#stack.ui = "coss"`. Triggers: "usa Coss/UI", "coss.com/ui", "Cal.com design system", "aggiungi un componente Coss", ...Votes: 0GitHub stars: 6
- Data FetchingRead data in a Next.js 16 App Router app the canonical way — async Server Components first, URL `searchParams` for filter state, `use()` + `<Suspense>` when a Client Component needs server data, Route Handlers + SWR/React Query only as a last resort. Server Actions are for mutations, never reads. Use when the user is about to load data via a Server Action, about to add `useEffect` to fetch, about to convert a page to `"use client"` for filter state, or pastes `useState + useEffect + fetch` in...Votes: 0GitHub stars: 6
- Design Md To AppGenerate or customize a frontend app from a DESIGN.md (Google design.md spec): reads its tokens and produces a working React app pre-styled to match. Next.js 16 + App Router only; pre-16 refused. Four UI libraries — shadcn/ui, Base UI, MUI, Coss/UI (via `coss-ui`) — and TanStack Form + Zod (default) or react-hook-form. Bumps phase to `scaffolded`. Use when the user has a DESIGN.md and wants to scaffold an app, set up a theme, or customize shadcn / Base UI / MUI from its tokens: "use this DESI...Votes: 0GitHub stars: 6
- Dev FlowOrchestrate an end-to-end product-development workflow built on atomic skills. Reads `.workflow/meta.json` in a project directory, works out which phase the user is in (idea → PRD → tasks → design → scaffolded → pages → modules → tests → pre-deploy gates → deployed), and delegates to whichever specialist skill owns the next move — across the web, mobile, monorepo and eve-agent families. Use when the user wants to "start a new project end-to-end", "advance my project to the next stage", "what ...Votes: 0GitHub stars: 6
- Plans> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking. > Also consult **superpowers:writing-skills** for the repo's skill-authoring conventions (frontmatter, description triggers, references) while doing the doc-heavy tasks. **Goal:** Add a new dev-flow skill `linear-scrum` that pushes a project into Linear (via the connected L...Votes: 0GitHub stars: 6
- Eve AgentScaffold and manage an eve agent (Vercel's filesystem-first agent framework) — inside a Next.js app, as `apps/agent` in a monorepo, or alone at the repo root when the product has no UI. Use whenever the user wants to create, set up or initialize an eve agent; add a tool, skill, channel, connection, schedule, subagent or hook to one; or wire a frontend to consume one. Trigger for ANY mention of "eve", "the agent engine", "agent tools", "agent backend", or building the agentic core of an app — ...Votes: 0GitHub stars: 6
- Eve Registry PortingPort a tool, connection or skill from a public eve/Flue agent registry — atomeve.dev, evex.sh, agentcn, eveagents.dev, the "shadcn for agents" registries — into a multi-tenant eve app WITHOUT adopting the registry's standalone-agent runtime model. Its core is the conformance checklist that makes third-party eve code tenant-safe. Use when the user wants to "install / use / borrow an agent from atomeve (or evex / agentcn / eveagents)", "add a Stripe/PostHog/Sentry/GitHub tool or connection from...Votes: 0GitHub stars: 6
- Figma To Design MdUse when the user provides a Figma URL and wants to export/extract/generate design tokens, colors, typography, or system documentation into DESIGN.md format—a portable, AI-readable design standard. Includes requests like "crea il design.md", "estrai i token", "portare il design fuori da figma", "design system documentation". Not for converting Figma to code, reviewing production websites, or design brainstorming before Figma work.Votes: 0GitHub stars: 6
- FormsBuild or edit any form in a Next.js 16 App Router app through one shared toolkit in `lib/forms/`, with dirty + valid Save gating — on TanStack Form + Zod (default) or react-hook-form (auto-detected). Use when the user says "form", "edit panel", "create dialog", "settings page", "save button", "dirty state", or reaches for `useState` to hold field values, raw `useForm`, hand-rolled dirty tracking, or inline `toast.success/error` on submit. Also owns multi-step question flows — "questionnaire",...Votes: 0GitHub stars: 6
- Founder IntelligenceThe full check of a commercial idea before dev-flow builds it: research, founder interview, competitors, customer-discovery kit and synthesis of real interviews, business model, MVP boundaries, feasibility and reuse, go-to-market, validation roadmap, in an evidence-tagged `.workflow/founder/founder-playbook.md` the founder approves. The alternative door to dev-flow''s inventory step for a product whose market is not settled; dev-flow asks which door on every new idea. Also invocable later on ...Votes: 0GitHub stars: 6
- Iframe CanvasDecide and build a pan/zoom canvas whose artboards are live `<iframe>` previews — the architecture behind AI site/app builders (Reweb, Sleek, Plasmic, Builder.io, Onlook), not the one behind Figma. Owns the decisions that fail late: how many live frames the tab can afford, same-origin vs cross-origin isolation, snapshot-vs-live per artboard, the interaction mode that gates pointer events, the camera and its two coordinate spaces, and the `postMessage` contract across the boundary. Use when th...Votes: 0GitHub stars: 6
- Image To Design MdGenerate a DESIGN.md (Google design.md spec) from 1+ raster images — PNG / JPG screenshots, mockups, Pinterest pins, Dribbble shots, competitor app captures. Extracts palette via k-means, identifies typography + components via vision-LLM, infers layout / radius / spacing, synthesizes a spec-compliant DESIGN.md + copies images to `screenshots/`. Use whenever the user provides 1+ images and asks to generate / extract / build a DESIGN.md / design system / design tokens — even phrased loosely lik...Votes: 0GitHub stars: 6
- Launch AuditOne of the five pre-deploy gates. `shadscan` asks whether the code is good, `compliance-audit` whether the data handling is lawful, `vercel-doctor` what it costs — this one asks **can a stranger find this, trust it, and buy from it?** Three surfaces nobody owns: **findable** (title + description on every route, robots, sitemap, favicon, social preview), **trustworthy** (privacy, terms, and the provider-identity block EU law requires on a commercial site), **convertible** (a CTA above the fold...Votes: 0GitHub stars: 6
- Module AddWire a backend or infrastructure module (auth, database, payments, email, file storage, PDF/document generation, content CMS, deploy config) into an already-scaffolded app. Reads `.workflow/meta.json#stack` for the chosen tech (better-auth, drizzle+neon, stripe, resend, vercel, etc.) and modifies the codebase at the project root to install + configure the module end-to-end. Always idempotent — running twice does not duplicate config. Use when the user says "add auth", "wire up the database", ...Votes: 0GitHub stars: 6
- Monorepo Add Python ServiceAdd a Python service (FastAPI, managed by uv) as an app of a turborepo scaffolded by `monorepo-bootstrap`, wired into pnpm workspaces and the turbo task graph, with a generated TypeScript client so `apps/web` never hand-writes a `fetch`. Two variants: `generic` (any HTTP service) and `ml` (vision/OCR models — one model resident at a time, `model_version` on every response, Metal locally and CUDA in production). Requires `stack.framework="monorepo"` and `phase` in {scaffolded, page_generated, ...Votes: 0GitHub stars: 6
- Monorepo Add Shared PackageExtract logic from apps/web/ or apps/mobile/ into a new or existing shared package under packages/ in a turborepo monorepo, OR create a fresh empty shared package skeleton. Reads .workflow/meta.json with stack.framework="monorepo". Adds the package to pnpm-workspace.yaml (already covered by the wildcard), updates packages/typescript-config/base.json path aliases, registers as workspace:* in both apps. Use to "estrai questa logica in shared", "spostala in packages/shared", "create a shared @<s...Votes: 0GitHub stars: 6
- Monorepo BootstrapScaffold a turborepo monorepo on pnpm workspaces, with shared packages (types, design tokens or shared UI, backend client). Three topologies, asked in Step 1: web+mobile (Next.js app AND an Expo + RN app — the classic case), web+agent (Next.js app + an eve agent in apps/agent, no mobile), or web-only (just the turborepo and shared-package tooling around one web app). Reads `.workflow/meta.json` with `stack.framework="monorepo"` and phase in {prd_drafted, design_extracted}. Always idempotent. ...Votes: 0GitHub stars: 6
- Monorepo Sync TypesRegenerate backend types and re-export them via packages/shared/types/ in a turborepo monorepo so both apps/web/ and apps/mobile/ consume a single typed surface. Supports Supabase (via supabase gen types typescript), neon-drizzle (via drizzle-kit introspect/pull + InferSelectModel/InferInsertModel re-exports — the default DB stack), tRPC (via inference from the server router import), and custom REST (via a manual or zod-derived schema). Reads .workflow/meta.json with stack.framework="monorepo...Votes: 0GitHub stars: 6
- Prd From IdeaTurn a raw product idea — a paragraph, a Notion dump, a half-formed thought, or a brief that arrived as a **file** (`.docx`, `.pdf`, `.pptx`, `.xlsx`: an RFP, a client deck, a Word spec — converted to Markdown first with `anydoc`) — into a structured PROJECT.md (high-level brief) and PRD.md (product requirements document) inside a project''s `.workflow/` folder, following the dev-flow contract. Use when the user pastes a product idea and says "let''s plan this", "draft a PRD", "what would thi...Votes: 0GitHub stars: 6
- Prd To TasksBreak down a PRD.md into a concrete, executable `tasks.md` checklist that a developer or an AI agent can pick up and ship. Reads `.workflow/PRD.md` (and `.workflow/PROJECT.md` for context), produces `.workflow/tasks.md` with one task per checkable bullet, grouped by user story or epic, sized to ~2–8 hours each. Output is compatible with beads, GitHub Issues import, `scrum` (Linear, Jira or GitHub), and ralph-tui task sources. Use when the user says "split this into tasks", "make the issues", ...Votes: 0GitHub stars: 6
- Product To Agent SkillWrite the agent-skill for the product you just built, so a coding agent can drive it. Reads the product''s own API surface — Next.js route handlers, an OpenAPI spec, or an eve agent''s tools — and produces a distributable `skills/<slug>/SKILL.md` in the product repo: auth (device flow before raw keys), the loop an agent should perform, the endpoint reference, error shapes, and a common-mistakes table grounded in what actually breaks. Plus the README row and the `npx skills add owner/repo` lin...Votes: 0GitHub stars: 6
- Project Infra SetupSet up a project''s third-party environments from the command line: the GitHub repo, the Vercel project (region, environment variables, Git link), marketplace connectors (Neon Postgres, Blob storage, Resend email), DNS records and domains, secrets handled without ever pasting them in chat, and the sub-processor register. Use when the user says "configura Vercel / Neon / Resend", "crea il progetto su Vercel", "collega il repo a Vercel", "configura il dominio / i DNS per le email", "variabili d...Votes: 0GitHub stars: 6
- Promote ComponentUse to refactor a React/RN component up the colocation hierarchy (L0 → L1 → L2) when its usage spreads across pages. Two modes: "scan candidates" counts every component''s usages across the codebase and reports the promotion candidates against the Rule of Three; "promote <Component>" moves the file to the right level, updates all imports. Reads `.workflow/meta.json#stack.framework` to honor next / expo-rn / monorepo conventions. Triggers on: "promote PostCard", "scan promotion candidates", "t...Votes: 0GitHub stars: 6
- Registry IntakeGovern third-party source from a shadcn-format registry — `shadcn add @ns/item`, a registry-item URL, `eve add @ns/…` — with an allowlist, a static review of the item and its dependency closure, a hashed snapshot installed instead of the live URL, a PreToolUse hook that refuses installs around it, and a `check` in dev-flow''s phase gate; `@coss` stays live only when stack.ui is coss. Use when the user wants something from a community registry (pdfcn, agentcn…), asks if one is safe, updates an...Votes: 0GitHub stars: 6
- Rn Add ScreenUse to add a new screen to an existing Expo + RN app: from a description, a wireframe, or a screenshot, generate the route file in app/ (Expo Router file-based), wire up data fetching via TanStack Query if needed, apply NativeWind classes from the project DESIGN.md tokens, and respect the scaffolded folder layout. Reads .workflow/meta.json with stack.framework="expo-rn" and phase ≥ "scaffolded". Use when dev-flow routes here from scaffolded+expo-rn, or the user says "add a login screen", "cre...Votes: 0GitHub stars: 6
- Rn Animations GesturesUse when adding animations or gestures to a React Native + Expo app: scale/opacity/translation transitions, layout animations (FadeIn/SlideIn/FadeOut), shared-value driven motion, swipe-to-delete, pan/pinch/long-press gestures, scroll-linked animations. Triggers on: "anima questo", "swipe to X", "fade in/out", "pinch zoom", "scroll-driven animation". Not for: styling (rn-styling), navigation transitions (Expo Router handles those — see rn-expo-router), CSS-only on web (Next.js stack).Votes: 0GitHub stars: 6
- Rn BackendUse to connect an Expo + RN app to a backend (auth, database, storage, realtime), agnostic of the provider. Teaches the shared patterns: secure-store for tokens, auth state via Zustand + TanStack Query, refresh-on-401 middleware, auth-gate routing via Expo Router (app)/_layout.tsx, row-level security vs API-auth concepts. Provider-specific details live in sub-references: Supabase (default, matches the course), Firebase, custom REST/JSON, tRPC. Triggers on: "setup backend", "setup auth with X"...Votes: 0GitHub stars: 6
- Rn BootstrapScaffold a new Expo + React Native app from a PROJECT.md + PRD.md + DESIGN.md using the opinionated stack (Expo Router, TypeScript, NativeWind v4, Zustand, TanStack Query, Reanimated, expo-image, FlashList). Reads .workflow/meta.json with stack.framework="expo-rn" and phase in {prd_drafted, design_extracted}. Produces a running Expo app at the project root, sets phase to "scaffolded". Always idempotent: re-running detects existing files and skips. Use when dev-flow routes here from prd_drafte...Votes: 0GitHub stars: 6
- Rn Components ApisUse when working with React Native core components (View, Text, ScrollView, FlatList, TextInput, Pressable, Modal, KeyboardAvoidingView, SafeAreaView) or platform APIs (Platform, Dimensions, useWindowDimensions, Linking, AppState). Triggers on: "which RN component should I use", "ScrollView vs FlatList", "how do I handle keyboard avoidance", "platform-specific code", "open external URL". Not for: styling (rn-styling), navigation (rn-expo-router), data fetching (rn-data-fetching), animations (...Votes: 0GitHub stars: 6
- Rn Data FetchingUse when fetching data from APIs in React Native: choosing between fetch+useEffect (didactic only) and TanStack Query (production default), wiring the QueryClient provider, building queries / mutations / optimistic updates / paginated and infinite lists / cache invalidation / refetch on focus, handling loading and error states, AsyncStorage persistence, offline-first behavior. Triggers on: "fetch posts from API", "infinite scroll", "optimistic mutation", "cache invalidation", "loading state"....Votes: 0GitHub stars: 6
- Rn Eas Build Submit UpdateUse for cloud builds and OTA updates of an Expo + RN app via EAS: configuring eas.json profiles (development/preview/production), managing credentials (APNs key, Android keystore) without committing them to git, submitting builds to App Store Connect / Google Play via EAS Submit, shipping JS-only fixes via EAS Update with channels/branches, EAS Workflows for CI. Triggers on: "set up EAS Build", "OTA update", "EAS Submit", "configure eas.json", "deploy to Play Store / TestFlight". Not for: sto...Votes: 0GitHub stars: 6
- Rn Eas DeployUse to deploy an Expo + RN app end-to-end: initialize eas.json with 3 profiles (development/preview/production), set up credentials (APNs key, Android keystore) via `eas credentials`, build for preview to smoke-test, build production, submit to App Store Connect + Play Console via EAS Submit, configure EAS Update channels (preview + production), and verify the post-submission checklist from rn-publishing-payments. Reads .workflow/meta.json with stack.framework="expo-rn" and phase="feature_com...Votes: 0GitHub stars: 6
- Rn Expo RouterUse when working with navigation in an Expo + React Native app: adding routes, building tab/stack/drawer layouts, modal routes, dynamic segments (e.g. /profile/[id]), typed routes, deep linking, search params. Triggers on: "add a route", "wire up tabs", "open as modal", "set up deep linking", "configure navigation", or whenever an agent is about to touch a file under app/. Not for: styling navigation chrome (rn-styling), animating transitions (rn-animations-gestures, Wave 3), or non-RN web ro...Votes: 0GitHub stars: 6
- Rn FundamentalsUse at the start of any React Native or Expo task to lock in foundational choices: Expo managed workflow as default, latest Expo SDK with New Architecture ON, TypeScript, npm. Triggers on: "starting a new RN/Expo project", "what is the right architecture for an Expo app", "managed vs bare workflow", questions about Fabric/Hermes/JSI/New Architecture, "differences between RN and React web". Also triggers as a precondition when any other rn-* skill is selected and project setup is unclear. Not ...Votes: 0GitHub stars: 6
- Rn Module AddUse to wire a backend/infra module (auth, db, storage, realtime, push, payments, cms, analytics, observability) into a scaffolded Expo + RN app. Reads .workflow/meta.json with stack.framework="expo-rn" and the user-chosen provider for each module (Supabase, Firebase, custom REST, tRPC, RevenueCat, Sanity for cms). Installs deps, generates the wiring code (lib/auth.ts, lib/supabase.ts, etc.), updates meta.json#stack to record the choice. Always idempotent. Triggers on: "add auth", "wire up db"...Votes: 0GitHub stars: 6
- Rn Publishing PaymentsUse when preparing an Expo + RN app for store submission (metadata, screenshots, localized listings, privacy nutrition label, age rating) and integrating monetization (In-App Purchases via RevenueCat for digital goods/subscriptions; Stripe via WebView ONLY for non-digital services). Triggers on: "submit to App Store", "Play Store listing", "screenshot sizes", "RevenueCat setup", "Stripe payment in app", "subscription", "IAP", "privacy nutrition label", "App Store review reject". Not for: buil...Votes: 0GitHub stars: 6
- Rn Push NotificationsUse when adding push or local notifications to an Expo + RN app: requesting permissions at the right moment, registering for push (Expo push service in dev, APNs/FCM direct in prod), handling foreground + tapped + cold-start notifications, deep linking from a notification payload to a specific route, scheduling local notifications, badge management. Triggers on: "add push notifications", "local notification", "deep link from notification", "iOS/Android push setup", "register for notifications...Votes: 0GitHub stars: 6
- Rn StylingUse when styling React Native + Expo components: choosing between StyleSheet/NativeWind/inline, wiring NativeWind v4 from DESIGN.md tokens, handling Flexbox in RN (column-by-default, not row), safe-area insets, dark mode, responsive design with useWindowDimensions, optimized images via expo-image, performant lists via FlashList, and choosing NativeWind vs real native components via @expo/ui (SwiftUI/Jetpack Compose). Triggers on: "style this screen", "add dark mode", "fix safe area", "import ...Votes: 0GitHub stars: 6
- Rn UpgradeUse to upgrade an existing Expo + RN project to a newer Expo SDK: bump `expo`, run `npx expo install --fix` to align every dependency, run `npx expo-doctor` for diagnostics, clear caches, and native-rebuild only for bare-workflow projects — skipped entirely for CNG (Continuous Native Generation) projects. Walks a breaking-changes checklist (removed APIs, moved imports, deprecated native modules). Reads `.workflow/meta.json` with `stack.framework="expo-rn"`; does NOT bump `phase`. Triggers on:...Votes: 0GitHub stars: 6
- Rn Write TestsUse to write tests for an Expo + RN app: Jest + React Native Testing Library for unit/integration (components, hooks, queries, mutations) and Maestro for end-to-end flows (sign-in, navigation, forms). Sets up the testing stack on first call (jest-expo preset, RNTL, jest config) and writes a focused test next to the source file. Triggers on: "write tests for X", "add e2e test", "two-user flow", "multi-user test", "test con due utenti", "shared state between users", "mock expo-notifications", "...Votes: 0GitHub stars: 6
- Screenshot To PageGenerate a real, working page (route + components) inside an already-scaffolded app from a single UI screenshot, applying the project''s DESIGN.md tokens and the existing UI library (shadcn, Base UI, MUI, or Coss). Reads a screenshot from `.workflow/screenshots/`, plus `.workflow/DESIGN.md` and `.workflow/meta.json` for tokens and stack, then writes the route into the codebase at the project root. Use when the user says "fai questa pagina dallo screenshot", "build the home page from this imag...Votes: 0GitHub stars: 6
- ScrumRun a dev-flow project with agile scrum on the tracker chosen at design time — Linear, Jira or GitHub Issues: records the choice, creates or links the project, pushes `.workflow/tasks.md` into estimated, labelled, prioritised issues, sets up 2-week sprints (Linear cycles, Jira sprints, GitHub milestones), then keeps **the tracker as the source of truth** — new tasks up, status and velocity down, each sprint planned to the velocity target — and triages bugs by severity (S1–S4) without a PRD ro...Votes: 0GitHub stars: 6
- ShadscanAudit a React/shadcn app for missing UI fundamentals — accessibility, interaction, empty/error/loading states, form wiring, responsive shell, production polish — with the shadscan CLI, then route each real fix to the dev-flow skill that owns it. One of five pre-deploy gates, with `compliance-audit` (legal), `vercel-doctor` (cost), `launch-audit` (launch readiness) and `app-security` (code security); dev-flow proposes it at `feature_complete` and in the `deployed` maintenance loop. Use when th...Votes: 0GitHub stars: 6
- Spec ReviewReview a diff on the two axes a dev-flow project can check that a generic reviewer cannot: the **spec** it was built from (`.workflow/PRD.md` + `tasks.md`) and the **contract** it was built under (golden rules, `meta.json#stack`). Two parallel sub-agents, reported side by side and never merged, with a Fowler smell baseline as the floor. Use when the user says "review this branch", "spec review", "review since <ref>", "does this match the PRD?", "controlla il diff contro la spec", or dev-flow ...Votes: 0GitHub stars: 6
- State DisciplineApply React 19 / Next.js 16 state discipline — `useState` is the last resort, not the default: derive from props/URL/data, `key` to reset, `useMountEffect` for one-time external sync, never bare `useEffect`. Use when the user pastes `useState + useEffect + fetch`, reaches for `useState` to mirror a prop, hand-rolls a derived value via `useEffect + setState`, syncs state with URL via `useEffect`, or asks "should I add useState here?". Also owns the React 19 concurrent-state APIs — `useTransiti...Votes: 0GitHub stars: 6