rumo-frontend
Skill7 starsChanged 14 days agoMITView on GitHub
Use when building, refactoring, or designing frontend pages and components, including a new interface with no existing pattern to follow or a request to improve visual quality or accessibility; starting or troubleshooting a local frontend development server (package scripts, backend proxy, ports, certificates, micro-frontends); or capturing browser evidence such as screenshots or a short GIF when explicitly asked. Do not capture persistent visual evidence merely because frontend code changed, and do not use to diagnose broken behavior in an existing page without a fix request (use rumo-debug).
We split this skill into the rules it gives an agent
2 rules. About 0 are common, 1 is distinctive, and 1 is very specific to this project.
≈0
Common · estimate
Many files like this have a rule of this kind.
≈1
Distinctive · estimate
This author's own choices. Worth a look.
1
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Distinctive: line 24
Use an isolated automation browser profile by default.
- Very specific: line 28
Run scripts/probe_frontend_ui.py --repo <path> for a read-only inventory of manifests, source roots, and likely component libraries.
≈ “Common” is an estimate: at least 1 in 5 of the 308,232 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Rumo Frontend
Choose the mode that matches the request and read its reference before acting.
| Mode | Use for | Reference |
| UI | Changing pages in an existing application: component reuse, layout, visual consistency | references/ui.md, plus page-patterns.md and visual-consistency.md when aligning layouts |
| New design | A page, component, or application with no existing pattern to follow, or an explicit request to make the interface look better | references/design-quality.md and page-patterns.md |
| Dev server | Starting, configuring, or repairing a local development server | references/dev-server.md |
| Browser evidence | Persistent screenshots, state sequences, DOM evidence, or GIFs the user asked for | references/browser-evidence.md |
An established design system or adjacent page always outranks the defaults in design-quality.md. Before handing back any UI or new-design change, check it against references/accessibility.md.
Shared Boundaries
- Confirm the real repository, package manager, route, and intended backend before editing or starting anything. Use
rumo-project-profilewhen project-specific commands, proxy rules, or design references exist. - Never point a development server or browser at an environment whose purpose is unclear. By default operate only on localhost or an environment the user identified as development or test. Production access needs the user's explicit go-ahead and stays read-only unless the user authorizes the exact change.
- Preserve routes, APIs, permissions, keyboard behavior, and loading, empty, error, disabled, and validation states.
- Use an isolated automation browser profile by default. Let the user type passwords and one-time codes; never extract credentials from a browser profile.
- Temporary renders and screenshots for self-checking are expected. Keep evidence capture local; persisting, committing, uploading, or publishing it is a separate action that needs explicit approval.
- A successful build does not prove proxy, authentication, or browser behavior; report which of those were actually exercised.
Run scripts/probe_frontend_ui.py --repo <path> for a read-only inventory of manifests, source roots, and likely component libraries.
In this repository22 other files it gives its agents.
- AGENTS.mdAGENTS.md
- CLAUDE.mdCLAUDE.md
- rumo-agent-collaborationSkill
- rumo-clarifySkill
- rumo-coding-guidelinesSkill
- rumo-database-change-safetySkill
- rumo-debugSkill
- rumo-explainSkill
- rumo-filesystem-safetySkill
- rumo-git-commitSkill
- rumo-handoffSkill
- rumo-interfaceSkill
- rumo-lifecycle-safetySkill
- rumo-planSkill
- rumo-project-profileSkill
- rumo-proseSkill
- rumo-reflectSkill
- rumo-remote-opsSkill
- rumo-reviewSkill
- rumo-setupSkill
- rumo-testSkill
- rumo-verifySkill
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.