frontend-planner
Use when breaking down a frontend feature, project, or migration, when a frontend repo has no documented conventions, or before implementation starts on…
Skill by pranav8494
Install
Works with Claude Code, Claude apps, Codex, Cursor, Gemini CLI, GitHub Copilot, VS Code, OpenCode, Goose, Windsurf. Read the repository before you give any tool access to your data.
npx agentmarket install skill/pranav8494-frontend-planner
Asks which of your tools to add it to (Claude Code, Codex, Cursor, VS Code, Windsurf, Gemini CLI, Claude Desktop) and shows the change first. See https://agentmart.dev/cli.
Get the weekly diff
The weekly diff: one email a week with new agent tools, notable updates and grade changes, plus security alerts for tools you follow. Double opt-in, one-click unsubscribe.
About
Use cases: design, frontend
Reviews
Write a reviewNo reviews yet. Installed it? Reviews come from verified installers only. How reviews work
Permissions
What this skill can do and what it asks for, from its SKILL.md and code. Checked Oct 25, 2026.
- Tools
- No tools found
- Secrets
- None asked for
- Install scripts
- None found
Network hosts it talks to 1
codeload.github.com· found in install command
Files it touches
~/.claude/skills/frontend-planner
What's inside
- Skill name
frontend-planner- Description
- Use when breaking down a frontend feature, project, or migration, when a frontend repo has no documented conventions, or before implementation starts on non-trivial UI work.
- License
- MIT
- Instructions
- 65 lines in SKILL.md · view on GitHub
Files (1)
- SKILL.md
SKILL.md (first lines)
# Frontend Planner ## Iron Law ``` No plan without recon. Read the repo before proposing anything. If the repo has no conventions file, the first deliverable is the conventions file, not the feature. A task that does not name its files, its layer, and its test is not a task. Load applicable overlays before acting: ../../overlays/domains/<domain>.md and ../../overlays/stacks/<stack>.md. Announce which you loaded, or state "no overlay". Never invent domain or stack rules absent from an overlay file. ``` --- ## Before Taking Any Action 1. **Announce** the overlays loaded, or "no overlay". 2. **Recon first** — never propose tasks before Phase 1 is complete. 3. **Confirm** before writing any file, including the conventions file. 4. **Report** the plan, the convention gaps, and what you could not resolve. --- ## Phase 1 — Recon | Read | To learn | |---|---| | `package.json`, lockfile, framework config | Installed versions — never assume them from the task | | The conventions file, if any | Which rules already exist | | 3 comparable features and their tests | The de-facto pattern and the real testing bar | | Lint / CI config | What is machine-enforced — never plan human process for it | ## Phase 2 — Conventions gate | State | Action | |---|---| | Exists | Plan inside it; each task cites the rules it follows | | Absent | Task 1 is to write `FRONTEND-CONVENTIONS.md` from the 3 samples, each rule marked **observed** or **proposed** | | Code contradicts it | Report the drift, ask which wins, then plan | **Conventions sections:** stack and versions · directory and layer map · import boundaries · component contract · state ownership · data layer · platform forks · testing bar · accessibility bar · performance budgets · open decisions. ## Phase 3 — Decompose Vertical slices, each shippable alone. Every task names: - **Files** created or changed, and their layer - **Public surface** it exposes, and who consumes it - **States**: loading, empty, error, success - **Test** that proves it, at the level this repo already tests - **Accessibility** requirement, named rather than implied - **Done when** — one observable condition Sequence by dependency and flag blockers. Keep risks and unknowns in their own list; never bury an unknown inside a task. --- ## Output Protocol End every response with `CONFIDENCE: [High|Medium|Low] — [one-line reason]`. If out of scope or missing context, return `BLOCKED: [reason] — [what would unblock this]` instead.
From pranav8494/team-of-agents, MIT.
More from pranav8494/team-of-agents
- 0.624score
backend-engineer
pranav8494
Use when designing APIs, working with databases, building microservices, handling authentication and authorisation, optimising server performance, designing…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
devex
pranav8494
Use when improving developer workflows, setting up or optimising CI/CD pipelines, reducing build times, improving local development setup, evaluating…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
document-writer
pranav8494
Use when writing or improving technical documentation, API references, runbooks, onboarding guides, READMEs, changelogs, ADRs, release notes, or any content…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
frontend-engineer
pranav8494
Use when implementing frontend work — building or changing components, wiring API integration, managing state, or executing a frontend implementation plan.
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
frontend-reviewer
pranav8494
Use when reviewing a frontend pull request or diff, auditing a frontend repo for gaps, or checking whether code has drifted from the project's documented…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
ux-researcher
pranav8494
Use when conducting user research, creating personas or journey maps, planning usability testing, synthesising user feedback, evaluating information…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
data-analyst
pranav8494
Use when analysing data files (CSV, JSON, Excel), writing SQL queries, identifying trends and patterns, building dashboards or charts, summarising metrics…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
product-manager
pranav8494
Use when writing user stories or acceptance criteria, defining product requirements, prioritising a feature backlog, creating a product roadmap, analysing…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
orchestrator
pranav8494
Use when you are unsure which specialist to invoke, when a task spans multiple roles, when you want the system to plan before acting, or when you need…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
project-manager
pranav8494
Use when planning sprints, tracking delivery milestones, managing dependencies, identifying risks, writing status reports, running retrospectives, or…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
qa-engineer
pranav8494
Use when writing test plans, designing test cases, identifying edge cases and failure scenarios, reviewing code for testability, setting up test automation…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
senior-engineer
pranav8494
Use when reviewing code for architecture, quality, or correctness; making technical design decisions; evaluating trade-offs between approaches; refactoring…
SkillAFreshness: A★ 7Claude Code +9
Signals
- Stars
- 7
- Forks
- 1
- Open issues
- 2
- Last commit (this folder)
- Oct 6, 2026 (22 days ago)
- Last release
- Oct 6, 2026 (22 days ago)
From GitHub (fetched Oct 24, 2026).
Details
- License
- MIT
- Repository
- github.com/pranav8494/team-of-agents
- First seen
- Oct 24, 2026
- Last checked
- Oct 24, 2026
- Source
- GitHubgithub-graphql
More from pranav8494
- 0.624score
devex
pranav8494
Use when improving developer workflows, setting up or optimising CI/CD pipelines, reducing build times, improving local development setup, evaluating…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
backend-engineer
pranav8494
Use when designing APIs, working with databases, building microservices, handling authentication and authorisation, optimising server performance, designing…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
frontend-engineer
pranav8494
Use when implementing frontend work — building or changing components, wiring API integration, managing state, or executing a frontend implementation plan.
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
frontend-reviewer
pranav8494
Use when reviewing a frontend pull request or diff, auditing a frontend repo for gaps, or checking whether code has drifted from the project's documented…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
document-writer
pranav8494
Use when writing or improving technical documentation, API references, runbooks, onboarding guides, READMEs, changelogs, ADRs, release notes, or any content…
SkillAFreshness: A★ 7Claude Code +9 - 0.624score
orchestrator
pranav8494
Use when you are unsure which specialist to invoke, when a task spans multiple roles, when you want the system to plan before acting, or when you need…
SkillAFreshness: A★ 7Claude Code +9
Cite this page
frontend-planner skill. Agent Mart. https://agentmart.dev/skills/pranav8494-frontend-planner (last updated 2026-10-24)