Communityコーディング&開発github.com

pproenca/nuqs

Next.js やその他の React フレームワークで型安全な URL クエリ状態を管理するベストプラクティス。useQueryState、useQueryStates、検索パラメータ、URL 状態、クエリパラメータ、nuqs パーサーを含むコードの作成、レビュー、リファクタリング時に使用します。

nuqs とは?

このスキルは、React アプリケーション、特に Next.js などのフレームワークにおいて、nuqs ライブラリを使用した URL クエリ状態の型安全な管理に関するベストプラクティスを提供します。主に useQueryState や useQueryStates フック、URL 検索パラメータ、nuqs パーサー、limitUrlUpdates、Standard Schema、NuqsAdapter、Next.js のルーティングと状態連携を扱うタスクでトリガーされます。開発者はこのスキルを活用することで、URL 状態の宣言的な読み取り・更新、パーサーによる型安全な値のシリアライズ/デシリアライズ、パフォーマンス最適化、アダプターによるフレームワーク統合など、nuqs のコア機能を適切に実装できます。スキルのドキュメントには、設定方法、各フックやパーサーの使用例、パフォーマンスに関する注意点、アダプターの構成、および Standard Schema との互換性についての詳細が含まれています。これにより、予測可能でメンテナンスしやすい URL 状態管理を実現します。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/pproenca/dot-skills/tree/main/skills/nuqs

Installed? Explore more コーディング&開発 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

nuqs は何をしますか?

nuqs (型安全 URL クエリ状態) の Next.js およびその他の React フレームワークにおけるベストプラクティス。このスキルは、nuqs を使用した URL 状態管理のコードを作成、レビュー、リファクタリングする際に使用します。useQueryState、useQueryStates、検索パラメータ、URL 状態、クエリパラメータ、nuqs パーサー、limitUrlUpdates、Standard Schema、NuqsAdapter、または Next.js の状態ルーティングに関するタスクでトリガーされます。

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

pproenca/clean-architecture

Clean Architecture principles and best practices from Robert C. Martin's book. This skill should be used when designing software systems, reviewing code structure, or refactoring applications to achieve better separation of concerns. Triggers on tasks involving layers, boundaries, dependency direction, entities, use cases, or system architecture.

pproenca/code-simplifier

Code simplification skill for improving clarity, consistency, and maintainability while preserving exact behavior. Use when simplifying code, reducing complexity, cleaning up recent changes, applying refactoring patterns, or improving readability. Triggers on tasks involving code cleanup, simplification, refactoring, or readability improvements.

pproenca/emilkowal-animations

Emil Kowalski's animation best practices for web interfaces. Use when writing, reviewing, or implementing animations in React, CSS, or Framer Motion. Triggers on tasks involving transitions, easing, gestures, toasts, drawers, or motion.

pproenca/react-hook-form

React Hook Form performance optimization for client-side form validation using useForm, useWatch, useController, useFieldArray, and the v7.55+ subscribe() API. This skill should be used when building client-side controlled forms with React Hook Form library. This skill does NOT cover React 19 Server Actions, useActionState, or server-side form handling (use react-19 skill for those).

pproenca/typescript

TypeScript performance, tsconfig, type errors, async patterns — triggered when the user asks to "optimize TypeScript performance", "speed up tsc compilation", "configure tsconfig.json", "fix type errors", "improve async patterns", or encounters TS errors (TS2322, TS2339, "is not assignable to"). Also triggers on .ts, .tsx, .d.ts file work involving type definitions, module organization, or memory management. Does NOT cover TypeScript basics, framework-specific patterns, or testing.

pproenca/vitest

Vitest testing framework patterns for test setup, async testing, mocking with vi.*, snapshots, and test performance (formerly test-vitest). This skill should be used when writing or debugging Vitest tests. This skill does NOT cover TDD methodology (use test-tdd skill), API mocking with MSW (use test-msw skill), or Jest-specific APIs.

pproenca/zod

Zod schema validation best practices for type safety, parsing, and error handling. This skill should be used when defining z.object schemas, using z.string validations, safeParse, or z.infer. This skill does NOT cover React Hook Form integration patterns (use react-hook-form skill) or OpenAPI client generation (use orval skill).

関連スキル