Getting it into your agent
It runs from inside its repository, so the clone comes first — what it calls does not travel with the file alone.
git clone --depth 1 https://github.com/eric861129/SKILLS_All-in-onenpx agentmods add skills/eric861129/skills_all-in-one/nextjs-developerWrote 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.
[](https://agentmods.dev/skills/eric861129/skills_all-in-one/nextjs-developer)<a href="https://agentmods.dev/skills/eric861129/skills_all-in-one/nextjs-developer"><img src="https://agentmods.dev/badge/skills/eric861129/skills_all-in-one/nextjs-developer.svg" alt="Measured on agentmods" height="20"></a>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.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00115 | $0.01271 |
| Opus 5 | $0.00057 | $0.00635 |
| Sonnet 5 | $0.00023 | $0.00254 |
| Haiku 4.5 | $0.00012 | $0.00127 |
Grade A, and why
nextjs-developer 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 4d 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.
This is a copy
95% identical to nextjs-developer — 2 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.
How it starts
The opening of the file, as written. The whole thing — 144 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Next.js Developer
Senior Next.js developer with expertise in Next.js 14+ App Router, server components, and full-stack deployment with focus on performance and SEO excellence.
Core Workflow
- Architecture planning — Define app structure, routes, layouts, rendering strategy
- Implement routing — Create App Router structure with layouts, templates, loading/error states
- Data layer — Set up server components, data fetching, caching, revalidation
- Optimize — Images, fonts, bundles, streaming, edge runtime
- Deploy — Production build, environment setup, monitoring
- Validate: run
next buildlocally, confirm zero type errors, checkNEXT_PUBLIC_*and server-only env vars are set, run Lighthouse/PageSpeed to confirm Core Web Vitals > 90
- Validate: run
Reference Guide
Load detailed guidance based on context:
| Topic | Reference | Load When |
|---|---|---|
| App Router | references/app-router.md |
File-based routing, layouts, templates, route groups |
| Server Components | references/server-components.md |
RSC patterns, streaming, client boundaries |
| Server Actions | references/server-actions.md |
Form handling, mutations, revalidation |
| Data Fetching | references/data-fetching.md |
fetch, caching, ISR, on-demand revalidation |
| Deployment | references/deployment.md |
Vercel, self-hosting, Docker, optimization |
Constraints
MUST DO (Next.js-specific)
- Use App Router (
app/directory), never Pages Router (pages/) - Keep components as Server Components by default; add
'use client'only at the leaf boundary where interactivity is required - Use native
fetchwith explicitcache/next.revalidateoptions — do not rely on implicit caching - Use
generateMetadata(or the staticmetadataexport) for all SEO — never hardcode<title>or<meta>tags in JSX - Optimize every image with
next/image; never use a plain<img>tag for content images - Add
loading.tsxanderror.tsxat every route segment that performs async data fetching
What ships with it
5 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.
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.
- 4d ago First seen · 144 lines · 115 tokens per session scan A a9f1262dce3e
nextjs-developer is a skill published in the GitHub repository eric861129/SKILLS_All-in-one (52 stars, last pushed 4mo ago), licensed MIT. It adds 115 tokens to every session and 1,271 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. It is 95% identical to nextjs-developer, differing in 2 lines, and is treated as a copy.
Other skills, from other repositories
frontend
Use when building React components, optimizing performance, analyzing bundle sizes, scaffolding projects, implementing accessibility, reviewing frontend code quality, performing visual overhauls, or designing UI/UX systems.
design-agent
You are the Design agent for this project. You own React components, page routes, design tokens, and visual layout.
vercel-react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance…
remotion-best-practices
Best practices for Remotion - Video creation in React.
comp-gen
Generate React/Vue/Svelte components.
blog
Generate blog engine with MDX support.