clawteam-rnd-frontend

clawteam-rnd-frontend is an agent for Claude Code from deepelementlab/jupyter-studio. It costs 57 tokens per session (1,836 once invoked), scanned A, original, Apache-2.0.

A frontend engineering role focused on building responsive user interfaces that work across devices, networks, input methods, and assistive technologies. It covers reusable components, data flow, rendering approaches, performance, and accessibility.

In plain words
What is it for?
Use it to plan component structures, choose client- or server-rendering approaches, manage UI and server state, improve loading and interaction performance, and build accessible interfaces.
Why use it?
It helps turn visual designs into interfaces that remain maintainable and usable under real-world conditions.

Agent for Claude Code

Written for Claude Code: a Claude Code subagent (agents/*.md).

Good fit Use it to plan component structures, choose client- or server-rendering approaches, manage UI and server state, improve loading and interaction performance, and build accessible interfaces.

Compare 6 agents from other repositories ↓
Install with agentmods
npx agentmods add agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Clone the repo
git clone --depth 1 https://github.com/deepelementlab/jupyter-studio

Made for: Claude Code.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for clawteam-rnd-frontend

README.md
[![agentmods](https://agentmods.dev/badge/agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend/github.svg)](https://agentmods.dev/agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend)
Your own site
<a href="https://agentmods.dev/agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend"><img src="https://agentmods.dev/badge/agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for clawteam-rnd-frontend

Your own site · 80×15
<a href="https://agentmods.dev/agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend"><img src="https://agentmods.dev/badge/agents/deepelementlab/jupyter-studio/clawteam-rnd-frontend.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 57 Only the description is in the session, so the agent can decide to use it. The body loads when it is invoked.
When invoked 1,836 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00057 $0.01836
Opus 5 $0.00028 $0.00918
Sonnet 5 $0.00011 $0.00367
Haiku 4.5 $0.00006 $0.00184

Measured 10d ago against content hash 660976fd2ad1, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-10, from the pricing page.

Security

Grade A, and why

clawteam-rnd-frontend scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

clawcode/.claw/agents/clawteam-rnd-frontend.md · 133 lines

How it starts

The opening of the file, as written. The whole thing — 133 lines — stays where its author put it; the contents beside it link to each section on GitHub.

You are the Frontend R&D Engineer role in clawteam. You ship reliable, fluid experiences on real devices — not only static layouts. Compared to backend (data and domain rules) or ops (platform uptime), you own how design behaves under varied network, CPU, input, and assistive tech. Treat UI as engineering: reuse, maintainability, testability, and measurable UX. Aim to be the engineering side of UX — designs that work efficiently in the wild.

Core mindset (how you build)

  1. Component thinkingSingle responsibility, high cohesion, low coupling. Props down, events up; atoms (button, input) vs domain components; compose rather than monolith screens.
  2. Declarative UI — Describe what the UI should be from state; avoid imperative DOM surgery except at clear boundaries (focus management, third-party bridges). Keep view logic predictable and separated from business rules where it helps testability.
  3. Data-driven flow — UI = f(state). Make sources, updates, and direction of data explicit: local state, lifted state, global store, server/cache state — don’t conflate them. Prefer immutability for shared updates.
  4. Progressive enhancement & graceful degradationCore content and tasks work without assuming latest JS or APIs; enhance when capabilities exist. Prefer feature detection over brittle browser sniffing.
  5. Performance first — Latency and bytes affect conversion and satisfaction. Budget bundle size, render work, and main-thread time per feature: split code, lazy-load, memoize, virtualize lists, optimize images.
  6. Accessibility built-inSemantic HTML, correct ARIA when semantics aren’t enough, keyboard paths, focus management, contrast. A11y is baseline, not polish.

Structural frameworks (how you design the app)

1. Frontend architecture layers (names vary by stack):

Layer Role Examples
UI Components, styles, interaction React/Vue/Svelte, CSS modules, design system
State Local, shared, global client state useState, Context, Redux, Zustand, Pinia
Data HTTP/GraphQL, cache, normalization TanStack Query, SWR, Apollo, fetch layer
Routing URL ↔ views, layouts React Router, Vue Router, file-based routes
Build Bundling, envs, optimizations Vite, Webpack, Rollup
Platform Errors, analytics, perf Sentry, Web Vitals, RUM

Read the full file on GitHub · 133 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 10d ago First seen · 133 lines · 57 tokens per session scan A 660976fd2ad1

Subscribe to this mod's changes

clawteam-rnd-frontend is an agent published in the GitHub repository deepelementlab/jupyter-studio (53 stars, last pushed 3mo ago), licensed Apache-2.0. It adds 57 tokens to every session and 1,836 once invoked, about $0.0003 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other agents, from other repositories

angular-developer

Expert in Angular 17+ development. Signals, standalone components, modern control flow, and enterprise SPA patterns. Triggers on angular, angular component, ng, rxjs, ngrx, angular signal, angular standalone.

hoangatg/ai-agent-toolkit · 48 tokens

fullstack-developer

Expert in end-to-end feature development spanning frontend, backend, and database layers. Use for building complete features, full-stack prototypes, and integrated systems. Triggers on fullstack, full stack, end to end, feature development, prototype, mvp, complete feature.

hoangatg/ai-agent-toolkit · 59 tokens

svelte-developer

Expert in Svelte 5 and SvelteKit development. Runes, reactivity, server-side rendering, and full-stack Svelte. Triggers on svelte, sveltekit, svelte component, svelte rune, svelte 5.

hoangatg/ai-agent-toolkit · 56 tokens

performance-optimizer

Expert in performance optimization, profiling, Core Web Vitals, and bundle optimization. Use for improving speed, reducing bundle size, and optimizing runtime performance. Triggers on performance, optimize, speed, slow, memory, cpu, benchmark, lighthouse.

hoangatg/ai-agent-toolkit · 53 tokens

frontend-specialist

Senior Frontend Architect who builds maintainable React/Next.js systems with performance-first mindset. Use when working on UI components, styling, state management, responsive design, or frontend architecture. Triggers on keywords like component, react, vue, ui, ux, css, tailwind, responsive.

hoangatg/ai-agent-toolkit · 63 tokens

review-risk

R1 Risk reviewer — security, privilege boundaries, data exposure, dependency risks, and merge-blocking vulnerabilities.

Gentleman-Programming/gentle-ai · 25 tokens