Oma Frontend

React/Next.js/Angular-Frontend-Agent, der shadcn-Primitives, Design-Tokens und FSD-Lite-Konventionen durchsetzt.

von first-fluke · first-fluke/oh-my-agent

Funktioniert mit Setup ★ 9.6/10

Oma Frontend — React/Next.js/Angular-Frontend-Agent, der shadcn-Primitives, Design-Tokens und FSD-Lite-Konventionen durchsetzt.

Was es kann

Ein Frontend-Spezialisten-Subagent für React-, Next.js- und Angular/TypeScript-Codebasen, der shadcn/ui-Primitives, Design-Token-Nutzung, i18n-String-Bezug und eine Next.js-16-proxy.ts-Konvention (nie middleware.ts) durchsetzt. Reagiert auf UI-, Komponenten-, Layout-, CSS-/Tailwind-, shadcn-, Angular- oder RxJS-Anfragen und liefert Ressourcen für Tech-Stack, Tailwind-Regeln und Angular-RxJS-Marble-Test-Policy.

Testbericht

Führte einen echten Baseline-vs-Skill-Product-Card-Build aus: Allein die Skill-Version erkannte 5 konkrete Konventionsverstöße, die die Baseline verschifft hatte (fehlendes 'use client' bei einer interaktiven Komponente, hartkodierte Tailwind-Farben statt Design-Tokens, hartkodierter UI-Text statt i18n, rohe div/button statt shadcn-Primitives, nicht-kebab-case-Dateiname) — aber der Skill-Body selbst verweist auf '../../rules/frontend.md' und '../_shared/*' außerhalb seines eigenen Ordners, sodass ein einfaches Single-Skill-cp -r Pflichtlektüre-Dateien verpasst.

Getestet am: 2026-07-13 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/first-fluke/oh-my-agent
cd oh-my-agent
mkdir -p ~/.claude/skills
cp -r .agents/skills/oma-frontend ~/.claude/skills/oma-frontend

Befehle & Beispiel-Prompts

  • /oma-frontendReact/Next.js/Angular-Frontend-Agent, der shadcn-Primitives, Design-Tokens und FSD-Lite-Konventionen durchsetzt.

Skills reagieren auf normale Anfragen — keine Slash-Befehle nötig. Nach der Installation aktivieren Prompts wie diese den Skill (auf Englisch):

  • Build this component using our shadcn primitives and design tokens
  • Add a new Next.js page following our FSD-lite folder conventions
  • Wire up this Angular form with RxJS and our proxy.ts routing setup