All authors
Claude Skills by L-X-T
github.com/L-X-T31 skills0 installs15 views
- Angular DeveloperGenerates Angular code and provides architectural guidance. Trigger when creating projects, components, services, or HTTP communication, or for best practices on reactivity (signals, linkedSignal, resource, httpResource), forms, dependency injection, routing, SSR, accessibility (ARIA), animations, styling (component styles, Tailwind CSS), testing, naming conventions, or CLI tooling.Votes: 0GitHub stars: 13
- BrainstormingExplores user intent and design through a feasibility spike, a short design, or a full specification. Use when the user has an idea but no concrete plan yet, wants to brainstorm, or asks for a design-first session – not for small, well-specified tasks.Votes: 0GitHub stars: 13
- Code ReviewCode review changed, staged, last-commit, and merge or PR work against requirements and the repository style guide. Use when reviewing current work, staged changes, the last commit, a branch, a merge, or a pull request. For a whole-codebase style audit use ng-review-style-guide instead.Votes: 0GitHub stars: 13
- Create A SkillCreate, edit, and improve agent skills with the right invocation, information hierarchy, leading words, and pruning so each skill runs predictably. Use when the user wants to create, write, edit, refactor, or review a skill, or asks what makes a skill good.Votes: 0GitHub stars: 13
- Create E2e TestsCreate end-to-end (e2e) tests for an Angular component using Playwright or Cypress. Use when the user wants e2e or browser tests, a Cypress `.cy.ts` spec, a Playwright e2e `.spec.ts`, or mentions testing a component in a real browser. Detects the configured platform (asks only when both or neither are set up), scaffolds it when missing, then writes and runs the spec. Not for unit or TestBed component tests – use ng-testing for those.Votes: 0GitHub stars: 13
- Diagnosing BugsFeedback-loop-first diagnosis discipline for hard bugs and performance regressions. Use when debugging, hunting a bug's root cause, chasing a flaky or failing test, or tracking down a regression – the user says "diagnose"/"debug this" or reports something broken, throwing, failing, or slow.Votes: 0GitHub stars: 13
- Frontend DesignCreate distinctive, intentional frontend designs through aesthetic direction, typography, layout, and interface copy. Use when building new UI, redesigning an existing screen, or asking for visual design guidance.Votes: 0GitHub stars: 13
- Git Stack RewriteFold staged changes or an existing commit into an older Git commit and rebase every affected dependent branch stack onto the rewritten commit. Use when the user says prompts like "use git stack rewrite to squash commit [source] into [target]", or asks to squash, fixup, amend, or move staged changes back into an earlier commit and then rebase branches that were on top of it.Votes: 0GitHub stars: 13
- Grill MeInterview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when the user wants to stress-test a plan, get grilled on their design, or mentions "grill me". For a grilling anchored to the project's domain model and style guides use grill-with-style instead.Votes: 0GitHub stars: 13
- Grill With StyleGrilling session that challenges your plan against the code's actual domain model and project style guide, and sharpens terminology. Use when the user wants to stress-test a plan against their project's language and style guide. For a plain design grilling without that lens use grill-me instead.Votes: 0GitHub stars: 13
- HandoverCompact the current conversation into a handover document for another agent to pick up. Use when the user wants to hand work over to a new session, says "handover", "hand off", or asks to summarise the session for the next agent.Votes: 0GitHub stars: 13
- Implement PlanExecute an approved implementation plan in small working slices, verifying each slice and reconciling the result with the plan. Use when the user asks to implement a written plan, execute approved tickets, or continue an agreed implementation. Do not use for brainstorming, drafting a plan, review-only requests, or a small edit that needs no plan.Votes: 0GitHub stars: 13
- Ng AccessibilityMake an Angular (v17+) application accessible – semantic HTML, keyboard & focus, color contrast, text alternatives, accessible forms & tables, plus Angular-specific tooling (ARIA attribute bindings, CDK a11y LiveAnnouncer/cdkTrapFocus, Angular Aria & Material, accessible custom components, router titles/active-links/focus management). Use when the user wants to improve accessibility/a11y, meet WCAG AA, fix screen-reader or keyboard issues, pass axe/Lighthouse a11y audits, or asks for an acces...Votes: 0GitHub stars: 13
- Ng Data AccessBuild the typed server-communication layer in Angular v22+ – fetch data through httpResource/resource/rxResource backed by HttpClient, with functional interceptors, loading/error/reload state, and SSR-safe transfer caching. Use when fetching data, writing an API service, wiring HttpClient, choosing httpResource vs resource vs rxResource, adding an interceptor, or surfacing loading/error/reload state. The project's TypeScript style guide prefers resource()/rxResource()/httpResource() over "RxJ...Votes: 0GitHub stars: 13
- Ng FormsBuild signal-based forms in Angular v22+ using the Signal Forms API (public API since v22, imported from @angular/forms/signals). Use for form creation with automatic two-way binding, schema-based validation, field state management, and dynamic forms. Triggers on form implementation, adding validation, creating multi-step forms, or building forms with conditional fields. Don't use for template-driven forms without signals or third-party form libraries like Formly or ngx-formly.Votes: 0GitHub stars: 13
- Ng MigrateRun Angular package updates and official `ng generate @angular/core:*` migration schematics to modernize Angular code – standalone, control flow, `inject()`, signal inputs/outputs/queries, lazy routes, self-closing tags, ngClass/ngStyle, CommonModule, RouterTestingModule, unused-import cleanup. Use when the user wants to update Angular, run `ng update`, migrate, modernize, or convert Angular code at any scope from a single component or service up to a library or whole application.Votes: 0GitHub stars: 13
- Ng PerformanceOptimize the performance of an Angular (v17+) application – both initial load (bundle size, lazy loading, deferrable views, images, SSR/SSG/hydration) and runtime (change detection, OnPush, zoneless, slow templates, large lists, RxJS). Use when the user wants to make an Angular app load faster, fix slow rendering or janky change detection, reduce bundle size, improve Core Web Vitals / Lighthouse scores, or asks for a performance review/audit. Covers the angular.dev performance best practices.Votes: 0GitHub stars: 13
- Ng PrototypeBuild a throwaway Angular prototype to flesh out a design before committing – either a runnable terminal app for state/business-logic questions, or several radically different UI variations on one route, switchable from a floating bar. Use when the user wants to prototype an Angular feature, mock up a screen, sanity-check a data model or state machine, explore design options, or says "prototype this", "try a few designs", or "let me play with it".Votes: 0GitHub stars: 13
- Ng RefactorRefactor a dusty / legacy Angular component into a small, modern, signal-based one using a repeatable 7-step blueprint – Analyse → Declutter → Update → Modernize → Type → Refactor → Review – while delegating Angular updates and official migration schematics to ng-migrate. Use when the user wants to refactor, modernize, clean up, tame, or "de-dust" a large, messy, or legacy Angular component, service, directive, or feature.Votes: 0GitHub stars: 13
- Ng Review ArchitectureReview the architecture of an Angular project against domain-driven design and module depth – bounded contexts, library categories (feature/ui/data-access/util/domain/api/shell), domain isolation, access restrictions, smart/dumb components, and deep vs shallow modules. Produces a structured review, then drills into chosen findings. Use when the user wants an Angular architecture review, to assess domain structure or boundaries, find refactoring or deepening opportunities, or check DDD/Nx laye...Votes: 0GitHub stars: 13
- Ng Review Style GuideAudit the whole Angular codebase against the project style guide (all of style-guide/, auto-selected by file type) and report severity-ranked conformance findings, then drill in and fix on approval. Use when the user wants a full-codebase style-guide review, a conformance audit, to check the existing code against the style guide, or to find where the codebase drifted from the guide – as opposed to reviewing a diff (use code-review) or only SCSS/styling (use ng-styling).Votes: 0GitHub stars: 13
- Ng SecurityHarden Angular applications against common web vulnerabilities. Use when reviewing or improving app security, preventing XSS, configuring Content Security Policy (CSP) or Trusted Types, working with sanitization / DomSanitizer / bypassSecurityTrust, securing HttpClient (XSRF/CSRF, XSSI), auth and token storage, SSR/SSRF (allowedHosts), or keeping dependencies patched.Votes: 0GitHub stars: 13
- Ng Signal StoreManage genuinely shared, multi-consumer state with @ngrx/signals SignalStore (withState / withComputed / withMethods / withEntities / rxMethod). Use when state must be shared across several components or routes and the user mentions state management, shared state, a store, NgRx, or SignalStore. Guard – prefer a local signal() / computed() or a signals-based service first; reach for a store only when state is truly shared. If @ngrx/signals is not in package.json, installation is a gated, expli...Votes: 0GitHub stars: 13
- Ng StylingAudit Angular styling against the repo style guide, the "Angular Styling" workshop deck, and angular.dev, then fix findings on approval. Use when reviewing, checking, or cleaning up Angular styling / CSS / SCSS: prefer `[class.x]` / `[style.x]` over `ngClass` / `ngStyle`, View Encapsulation (Emulated / ShadowDom / None), (S)CSS architecture, design tokens via CSS custom properties and `:host` knobs, BEM with a project prefix, nesting depth, and removing `!important`, `::ng-deep`, `float`, inl...Votes: 0GitHub stars: 13
- Ng TestingWrite Vitest unit and component tests for Angular – TestBed for standalone + zoneless components, signal/computed assertions, DI and HttpClient mocking, and CDK component harnesses. Use when the user wants to unit-test or spec a component, service, pipe, signal, or computed, mentions Vitest, TestBed, HttpTestingController, or component harnesses, or says "test this component/service". Not for browser end-to-end tests – use create-e2e-tests.Votes: 0GitHub stars: 13
- Ng Verify FeatureVerify a running Angular feature against acceptance criteria using the browser, and report observed behavior with reproduction evidence. Use when the user asks to verify a delivered feature, check an Angular user flow, or perform scoped exploratory acceptance testing. Do not use for source-only code review, writing e2e specs, or a general explanation of browser testing.Votes: 0GitHub stars: 13
- SpartanManages spartan/ui, the Angular UI library - adding, composing, fixing, debugging, and styling UI with the Brain (headless primitives) and Helm (styled) layers. Provides project context, component APIs, and usage examples. Applies when working with spartan/ui, @spartan-ng/brain, @spartan-ng/helm, the @spartan-ng/cli generators, or any Angular project with a components.json file. Also triggers for "spartan init", "add a spartan component", or "set up spartan/ui".Votes: 0GitHub stars: 13
- Test Driven DevelopmentDrive implementation from a failing test first – red, green, refactor – so every line of production code is demanded by a test you watched fail. Use when implementing a feature or bugfix before writing implementation code, or when the user mentions TDD, red-green, "write the tests first", or "test-drive this".Votes: 0GitHub stars: 13
- UnslopEdit prose to remove AI-writing tells and improve clarity. Use when writing or revising prose (docs, READMEs, commit messages, blog posts, UI copy), or when the user says text sounds like AI, or asks to unslop, de-AI, or humanize it.Votes: 0GitHub stars: 13
- Update Skills DirectoryAudit .agents/skills so every skill has valid frontmatter, a lean SKILL.md, flat support folders, and a root 02-SKILLS.md link. Use when the user adds, renames, removes, or restructures a skill, or asks to update the skills index/directory. Do not use it to create per-skill README files.Votes: 0GitHub stars: 13
- Update SkillsCheck vendored skills for upstream updates and selectively apply requested updates while preserving local adaptations and provenance. Use when the user asks whether third-party skills are outdated, wants an upstream comparison, or asks to refresh installed skill copies. For directory structure and catalogue maintenance alone, use update-skills-directory.Votes: 0GitHub stars: 13