# React App Dev

> Implement or modify VMark React UI with project conventions (Zustand selectors, Tailwind v4, shadcn/ui). Use for components, hooks, stores, and UI behavior changes.

- Skill: `xiaolai/react-app-dev` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add xiaolai/react-app-dev`
- Raw SKILL.md: https://api.skillmd.com/api/skills/xiaolai/react-app-dev/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: xiaolai (https://skillmd.com/u/xiaolai)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/xiaolai/react-app-dev

---


# React App Dev (VMark)

## Overview
Apply VMark frontend conventions for React 19 + Zustand v5 + Tailwind v4 + shadcn/ui.

## Workflow
1) Read relevant files before editing (components, hooks, stores, plugins).
2) Follow the VMark rules in `AGENTS.md` (no store destructuring; use selectors).
3) Keep code files under ~300 lines; split when needed.
4) Prefer local feature boundaries; avoid cross-feature imports.
5) Update tests for new behavior and run `pnpm check:all` when asked.

## References
- `references/paths.md` for common source locations and scans.
- Docs map: `dev-docs/README.md`.