agentmods.dev

nextjs-implementer

nextjs-implementer is a skill for Codex from LeeYudok/doksam-skills. It costs 104 tokens per session (5,650 once invoked), scanned A, original, MIT.

A web-app implementation guide that turns a storyboard and a set of business rules into a working Next.js or Vite-and-React application. It treats those planning documents as the required specification.

In plain words
What is it for?
Use it to implement documented web applications, including their screens, flows, validation, interactions, and edge cases, in Next.js or Vite with React.
Why use it?
It prevents developers from quietly changing, removing, or combining screens when turning plans into code. It also clarifies what to do when required planning documents are missing.

Skill for Codex

Written for Codex: agents/openai.yaml present.

not rated 10repo 17d ago A scan SkillSpector: pass 104 tokens original MIT

Good fit Use it to implement documented web applications, including their screens, flows, validation, interactions, and edge cases, in Next.js or Vite with React.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/leeyudok/doksam-skills/nextjs-implementer
View source ↗ LeeYudok/doksam-skills
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.

Any agent
npx skills add LeeYudok/doksam-skills --skill nextjs-implementer
Clone the repo
git clone --depth 1 https://github.com/LeeYudok/doksam-skills

Made for: Codex.

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 nextjs-implementer

README.md
[![agentmods](https://agentmods.dev/badge/skills/leeyudok/doksam-skills/nextjs-implementer/github.svg)](https://agentmods.dev/skills/leeyudok/doksam-skills/nextjs-implementer)
Your own site
<a href="https://agentmods.dev/skills/leeyudok/doksam-skills/nextjs-implementer"><img src="https://agentmods.dev/badge/skills/leeyudok/doksam-skills/nextjs-implementer/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 nextjs-implementer

Your own site · 80×15
<a href="https://agentmods.dev/skills/leeyudok/doksam-skills/nextjs-implementer"><img src="https://agentmods.dev/badge/skills/leeyudok/doksam-skills/nextjs-implementer.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 104 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 5,650 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. Third-party audits
  • NVIDIA SkillSpector pass 7 Sept 2026
How audits are shown
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.00104 $0.05650
Opus 5 $0.00052 $0.02825
Sonnet 5 $0.00021 $0.01130
Haiku 4.5 $0.00010 $0.00565

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

Security

Grade A, and why

nextjs-implementer 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.

The scan reads SKILL.md. This mod also ships 5 executable files (scripts/serve_and_check.py, scripts/validate_traceability.py, tests/test_contract.py, …), listed below but not scanned — reading those needs a real analyzer, not pattern matching.

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.

skills/nextjs-implementer/SKILL.md · 301 lines

How it starts

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

nextjs-implementer

당신은 기획 문서를 코드로 옮기는 시니어 웹 개발자다. mobile-web-planner 가 산출한 두 문서 — Storyboard(HTML)와 Business Rules(md) — 를 계약으로 받아 동작하는 웹 애플리케이션으로 구현한다.

이름은 기존 호출과 설치 경로의 호환성을 위해 유지한다. 프론트 구현 모드는 Next.js App Router와 Vite + React SPA 두 가지다. 세부 스캐폴딩과 검증 명령은 references/implementation-modes.md를 필요한 모드만 읽어 적용한다.

프론트 모드 선택 기준 가능한 백엔드
Next.js (호환 기본값) SSR/SEO, Server Components, Server Actions가 필요하거나 별도 지시가 없음 Next.js 풀스택, Java 1.8 API
Vite + React SPA 정적 호스팅, 클라이언트 라우팅, 별도/기존 API, 경량 랜딩·관리도구 Java 1.8 API, 기존·서버리스 API, 명시적 mock

Vite + Next.js 백엔드라는 모호한 조합은 만들지 않는다. Vite가 /api를 호출해야 하면 API의 소유 주체와 실행 방법을 별도 계약으로 확정한다.

입력

한 쌍의 기획 산출물을 입력으로 받는다.

  1. *_storyboard.html — 화면 목록(05 Screen List), 화면 흐름(06 Service Flow), 트랜잭션 시퀀스(07.x), 공통 규칙(08 General Rule), 화면별 목업(09.x).
  2. *_business-rules.md — 화면 ID 를 키로 화면마다 4개 절: 입력 검증 · 출력 규칙 · 인터랙션 · 엣지케이스.

둘 중 하나만 주어지면 나머지의 위치를 먼저 묻는다. 기획 문서 없이 "그냥 웹앱 만들어줘"라면 이 스킬의 범위 밖이다 — mobile-web-planner 로 기획을 먼저 뽑을지 물어본다.

문서가 답하지 않는 것(데이터 모델·인프라)은 기획 산출물의 범위 밖이므로, 구현에 필요한 최소만 가정으로 명시하고 데이터 계층 뒤에 숨긴다. 기획 문서를 임의로 재해석하거나 화면을 빼거나 합치지 않는다 — 문서와 구현이 다르면 문서를 고칠 일이지 구현이 조용히 이탈할 일이 아니다.

Workflow

아래 순서를 끝까지 수행한다.

  1. 구현 프로필 확정 — 사용자가 프론트·백엔드 스택을 지정하면 그대로 따른다. 지정하지 않으면 위 선택 기준으로 프로필을 정하고 근거를 기록한다. 판단 근거가 없으면 호환 기본값인 Next.js 풀스택을 쓴다. 모드는 중간에 조용히 바꾸지 않는다.
  2. 계약 파악 — Business Rules 의 화면 ID 전수와 Storyboard 의 05 Screen List 를 대조해 구현 대상 화면 집합을 확정한다. 유형(화면/팝업/바텀시트)을 함께 적는다.
  3. 라우트 매핑표 작성 — 코드를 만지기 전에 화면 ID → 라우트(또는 부모 화면 + 오버레이) 매핑표를 만들어 사용자에게 보여준다. 유형이 화면이면 라우트 세그먼트, 팝업·바텀시트면 부모 라우트의 오버레이 컴포넌트다. 별도 API를 쓰는 모드에서는 API 계약표도 함께 만든다 — 07.x 시퀀스의 트랜잭션과 화면별 조회를 메서드 + 경로 + 요청/응답 요지 + 관련 화면 ID 행으로 정리한다. 두 표가 이후 모든 커버리지 판정의 기준이다.
  4. 프로젝트 준비 — 기존 프로젝트가 있으면 그 구조·컨벤션을 따른다. 새 프로젝트는 선택한 모드의 reference대로 초기화한다. Vite 빌드·pnpm·번들 검사는 frontend-build, React 컴포넌트 판단은 react-expert, doksam UI는 doksam-ui가 소유한다. 이 스킬은 그 규칙을 복제하지 않고 결과만 합친다.

Read the full file on GitHub · 301 lines

Files

What ships with it

12 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.

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 · 301 lines · 104 tokens per session scan A c62c82018286

Subscribe to this mod's changes

nextjs-implementer is a skill published in the GitHub repository LeeYudok/doksam-skills (10 stars, last pushed 17d ago), licensed MIT. It adds 104 tokens to every session and 5,650 once invoked, about $0.0005 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-31.

Claude CodeFrontendReactagent-skillsantigravitycodexinformation-architecturemobile-web
Related

Other skills, from other repositories

astro

Build content-focused websites with Astro — zero JS by default, islands architecture, multi-framework components, and Markdown/MDX support.

sickn33/agentic-awesome-skills · 28 tokens

antigravity-design-expert

Core UI/UX engineering skill for building highly interactive, spatial, weightless, and glassmorphism-based web interfaces using GSAP and 3D CSS.

sickn33/agentic-awesome-skills · 39 tokens

algolia-search

Expert patterns for Algolia search implementation, indexing strategies, React InstantSearch, and relevance tuning.

sickn33/agentic-awesome-skills · 22 tokens

frontend-mobile-development-component-scaffold

You are a React component architecture expert specializing in scaffolding production-ready, accessible, and performant components. Generate complete component implementations with TypeScript, tests, s.

rmyndharis/antigravity-skills · 38 tokens

frontend-developer

Build React components, implement responsive layouts, and handle client-side state management. Masters React 19, Next.js 15, and modern frontend architecture. Optimizes performance and ensures accessibility. Use PROACTIVELY when creating UI components or fixing frontend issues.

rmyndharis/antigravity-skills · 55 tokens

nextjs-app-router-patterns

Master Next.js 14+ App Router with Server Components, streaming, parallel routes, and advanced data fetching. Use when building Next.js applications, implementing SSR/SSG, or optimizing React Server Components.

rmyndharis/antigravity-skills · 48 tokens