Communitygithub.com

pproenca/emilkowal-animations

Emil Kowalski 的網頁動畫最佳實踐。適用於在 React、CSS 或 Framer Motion 中撰寫、審閱或實作動畫時使用。觸發於涉及轉場、緩動、手勢、提示訊息、抽屜或動態效果的任務。

emilkowal-animations 是什麼?

這是一個專注於 Emil Kowalski 網頁動畫最佳實踐的 AI 技能。當開發者在 React、CSS 或 Framer Motion 中撰寫、審閱或實作動畫,尤其是處理轉場、緩動函數、手勢互動、提示訊息、抽屜面板或一般動態效果時,此技能會自動觸發。它提供經過實戰驗證的動畫模式與指導,幫助您建立流暢、直覺且高效能的用戶介面動畫。此技能支援多種現代網頁技術棧,並作為知識庫,提供具體的實作建議和程式碼範例,確保動畫既美觀又符合最佳效能實踐。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/pproenca/dot-skills/tree/main/skills/emilkowal-animations

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

emilkowal-animations 是做什麼的?

Emil Kowalski 的網頁介面動畫最佳實踐。在 React、CSS 或 Framer Motion 中撰寫、審閱或實作動畫時使用。觸發於涉及轉場、緩動、手勢、提示訊息、抽屜或動態效果的任務。

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/nuqs

nuqs (type-safe URL query state) best practices for Next.js and other React frameworks. This skill should be used when writing, reviewing, or refactoring code that uses nuqs for URL state management. Triggers on tasks involving useQueryState, useQueryStates, search params, URL state, query parameters, nuqs parsers, limitUrlUpdates, Standard Schema, NuqsAdapter, or Next.js routing with state.

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).

相關技能