FreePublished on GitHub

nuqs

Type-safe URL query state management with nuqs 2.x. Use when writing or reviewing code that uses useQueryState, useQueryStates, URL search params, query parameters, nuqs parsers, createLoader, createSearchParamsCache, createSerializer, or URL state in Next.js, React, Remix, React Router, or TanStack Router.

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki

See how to install

Files included (43)

SKILL.md5.6 KB
references/advanced-adapter-props.md1.9 KB
references/advanced-eq-function.md1.5 KB
references/advanced-optimistic-search-params.md1.2 KB
references/advanced-standard-schema.md2.7 KB
references/advanced-url-keys.md1.5 KB
references/debug-common-errors.md1.8 KB
references/debug-enable-logging.md911 B
references/debug-testing.md3.1 KB
references/history-back-sync.md1.3 KB
references/history-push-navigation.md1.3 KB
references/history-replace-ephemeral.md1.3 KB
references/history-scroll-behavior.md1.3 KB
references/parser-array-format.md1.7 KB
references/parser-custom.md2.1 KB
references/parser-date-format.md1.8 KB
references/parser-enum-literals.md2.0 KB
references/parser-hex-colors.md691 B
references/parser-index-offset.md1.6 KB
references/parser-json-validation.md1.8 KB
references/parser-typed.md2.0 KB
references/parser-with-default.md1.6 KB
references/perf-avoid-rerender.md1.3 KB
references/perf-clear-on-default.md1.4 KB
references/perf-limit-url-updates.md2.6 KB
references/perf-serialize-utility.md1.8 KB
references/server-create-loader.md3.0 KB
references/server-next15-async.md1.8 KB
references/server-search-params-cache.md2.6 KB
references/server-shallow-false.md1.4 KB
references/server-share-parsers.md1.6 KB
references/server-use-transition.md1.6 KB
references/setup-adapter.md3.0 KB
references/setup-client-hooks.md1.7 KB
references/setup-server-imports.md1.6 KB
references/setup-shared-parsers.md1.9 KB
references/state-avoid-derived.md1.8 KB
references/state-clear-with-null.md1.2 KB
references/state-controlled-inputs.md1.3 KB
references/state-functional-updates.md1.4 KB
references/state-options-inheritance.md1.5 KB
references/state-setter-return.md1.1 KB
references/state-use-query-states.md2.0 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

nuqs Best Practices

Type-safe URL query state management with nuqs 2.x. Contains rules across 8 categories, prioritized by impact.

Rule Categories

Priority	Category	Impact	Prefix
1	Parser Configuration	CRITICAL	`parser-`
2	Adapter & Setup	CRITICAL	`setup-`
3	State Management	HIGH	`state-`
4	Server Integration	HIGH	`server-`
5	Performance	MEDIUM	`perf-`
6	History & Navigation	MEDIUM	`history-`
7	Debugging & Testing	LOW-MEDIUM	`debug-`
8	Advanced Patterns	LOW	`advanced-`

Quick Reference

1. Parser Configuration (CRITICAL)

parser-typed — Use typed parsers for non-string values
parser-with-default — Use withDefault for non-nullable state
parser-enum-literals — Use literal/enum parsers for constrained values
parser-array-format — Choose correct array parser format
parser-json-validation — Validate JSON parser with Standard Schema
parser-date-format — Select appropriate date parser
parser-index-offset — Use parseAsIndex for 1-based URL display
parser-hex-colors — Use parseAsHex for color values
parser-custom — Create custom parsers for complex types

2. Adapter & Setup (CRITICAL)

setup-adapter — Wrap app with correct NuqsAdapter
setup-client-hooks — Add 'use client' for hooks
setup-server-imports — Import server utilities from nuqs/server
setup-shared-parsers — Define shared parsers in a dedicated file

3. State Management (HIGH)

state-use-query-states — Use useQueryStates for related parameters
state-functional-updates — Use functional updates for derived state
state-clear-with-null — Clear URL parameters with null
state-controlled-inputs — Handle controlled input value properly
state-avoid-derived — Avoid derived state from URL parameters
state-options-inheritance — Use withOptions for parser-level config
state-setter-return — Use setter return value for URL access

4. Server Integration (HIGH)

server-create-loader — Use createLoader for page-level server parsing
server-search-params-cache — Use createSearchParamsCache for nested RSC access
server-shallow-false — Use shallow:false to trigger server re-renders
server-use-transition — Integrate useTransition for loading states
server-share-parsers — Share parsers between client and server
server-next15-async — Handle async searchParams in Next.js 15+

5. Performance (MEDIUM)

perf-limit-url-updates — Throttle/debounce URL updates
perf-clear-on-default — Use clearOnDefault for clean URLs
perf-avoid-rerender — Memoize components using URL state
perf-serialize-utility — Use createSerializer for link URLs

6. History & Navigation (MEDIUM)

history-push-navigation — Use history:push for navigation-like state
history-replace-ephemeral — Use history:replace for ephemeral state
history-scroll-behavior — Control scroll behavior on URL changes
history-back-sync — Handle browser back/forward navigation

7. Debugging & Testing (LOW-MEDIUM)

debug-enable-logging — Enable debug logging for troubleshooting
debug-common-errors — Diagnose common nuqs errors
debug-testing — Test components and hooks with URL state

8. Advanced Patterns (LOW)

advanced-url-keys — Use urlKeys for shorter URL param names
advanced-eq-function — Implement eq function for object parsers
advanced-adapter-props — Configure NuqsAdapter global defaults and URL middleware
advanced-standard-schema — Use createStandardSchemaV1 and inferParserType
advanced-optimistic-search-params — useOptimisticSearchParams for Remix/React Router

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

More skills from this repository

accessibility-a11y

Free

Implement web accessibility (a11y) best practices following WCAG guidelines to create inclusive, accessible user interfaces.

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki33Updated Aug 28, 2026

agent-browser

Free

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki33Updated Aug 28, 2026

bun

Free

Bun runtime, package manager, bundler, and test runner. Use when running scripts with bun, managing packages, serving HTTP with Bun.serve, querying databases with Bun.sql/bun:sqlite/Bun.redis, shell scripting with $, using S3/file I/O, writing tests with bun:test, bundling or compiling to executable, or using any Bun-specific API (spawn, glob, semver, FFI, workers, plugins, HTMLRewriter).

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki33Updated Aug 28, 2026

commit-work

Free

Create high-quality git commits: review/stage intended changes, split into logical commits, and write clear commit messages (including Conventional Commits). Use when the user asks to commit, craft a commit message, stage changes, or split work into multiple commits.

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki33Updated Aug 28, 2026

denji

Free

Manage SVG icons as framework components using Denji CLI. Use when the user needs to add, remove, list, or manage SVG icons in React, Preact, Solid, Qwik, Vue, or Svelte projects. Triggers include requests to "add an icon", "set up icons", "manage SVG icons", "remove an icon", "list icons", or any task involving Iconify icons as framework components.

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki33Updated Aug 28, 2026

frontend-design

Free

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

The English summary is being prepared. Showing the original description.

fellipeutaka/kanpeki33Updated Aug 28, 2026

See all skills by fellipeutaka

Report a problem with this skill

Install

Install with a command

npx skills add https://github.com/fellipeutaka/kanpeki --skill nuqs

Paste it into your terminal and run it (requires Node.js). You can choose which agents to install it for, such as Claude Code or Codex.

Ask your agent

Please install the following Agent Skill.
https://github.com/fellipeutaka/kanpeki/tree/main/.agents/skills/nuqs

First review SKILL.md and the bundled files and confirm there is nothing suspicious (such as sending data externally or reading credentials). Then place it in ~/.claude/skills/nuqs/ for Claude Code, or ~/.agents/skills/nuqs/ for Codex.

Send this text to Claude Code or Codex as is. It checks the contents before installing.

View source on GitHub

Repository: fellipeutaka/kanpeki
Stars: 33
Forks: 1
Category: Development
License: MIT
Original language: English
Last updated: Aug 28, 2026

A skill is a set of instructions and scripts for an agent. cccskills does not guarantee that skills are safe. Review the contents before you install.