React App Dev (VMark)
SkillDev toolsEdits React components and stores correctly by applying this React Claude skill loaded with VMark project conventions.
Available today. Use it from your connected AI after setup.
No other account needed.
Add ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.
Then ask your AI: use the React App Dev (VMark) skill
About this skill
Implement or modify VMark React UI with project conventions (Zustand selectors, Tailwind v4, shadcn/ui). Use for components, hooks, stores, and UI behavior changes.
What this skill tells your AI
The instructions your AI receives, as published by xiaolai/vmark in .claude/skills/react-app-dev/SKILL.md and read by ahel’s review.
Overview
Apply VMark frontend conventions for React 19 + Zustand v5 + Tailwind v4 + shadcn/ui.
Workflow
- Read relevant files before editing (components, hooks, stores, plugins).
- Follow the VMark rules in
AGENTS.md(no store destructuring; use selectors). - Keep code files under ~300 lines; split when needed.
- Prefer local feature boundaries; avoid cross-feature imports.
- Update tests for new behavior and run
pnpm check:allwhen asked.
References
references/paths.mdfor common source locations and scans.- Docs map:
dev-docs/README.md.
Signals
- GitHub stars
- 808
- Forks
- 127
- Last commit
- Sep 2026
Advanced
- Item type
- skill
- Key
react-app-dev- Source
- github.com/xiaolai/vmark