formik-patterns
Criar Formulários React com Formik
Criar formulários em React requer tratamento de validação, estado e submissão. Esta skill fornece padrões Formik comprovados para criar formulários acessíveis e validados com esquemas Yup.
スキルZIPをダウンロード
Claudeでアップロード
設定 → 機能 → スキル → スキルをアップロードへ移動
オンにして利用開始
テストする
「formik-patterns」を使用しています。 Create a registration form with email, password, and confirm password fields
期待される結果:
- Use Yup validation with .matches() for password requirements
- Add .oneOf([yup.ref('password')]) for confirm password
- Set enableReinitialize: true for edit forms
- Disable submit button when form is invalid or submitting
「formik-patterns」を使用しています。 Show me how to handle form errors properly
期待される結果:
- Always check formik.touched[field] before showing errors
- Use try/catch with finally in onSubmit handler
- Set formik.setSubmitting(false) in finally block
- Display toast notifications for user feedback
セキュリティ監査
安全Pure documentation skill containing only Formik code examples and patterns. No executable code, network calls, file system access, or command execution. Static findings are false positives from markdown code blocks and regex validation patterns being misidentified as security threats.
リスク要因
🌐 ネットワークアクセス (1)
📁 ファイルシステムへのアクセス (1)
⚙️ 外部コマンド (19)
品質スコア
作れるもの
Formulários de login e autenticação
Criar formulários de login seguros com validação de email, requisitos de senha e tratamento de erros.
Formulários de entrada de dados
Criar formulários que submetem para APIs GraphQL com estados de carregamento adequados e feedback de erros.
Assistentes complexos de múltiplas etapas
Implementar fluxos de checkout e assistentes de onboarding com validação por etapas e navegação.
これらのプロンプトを試す
Show me how to create a login form using Formik with email and password validation using Yup.
How do I create a Yup validation schema for a password field that requires uppercase, lowercase, number, and minimum 8 characters?
Write a Formik form that submits to a GraphQL mutation with proper onCompleted and onError handlers.
How do I implement a multi-step form with Formik where each step has its own validation schema?
ベストプラクティス
- Always show validation errors only after field is touched to reduce noise
- Disable submit button during submission and when form is invalid
- Handle both onCompleted and onError callbacks for mutation submissions
回避
- Showing validation errors immediately before user interacts with field
- Leaving submit button enabled during async submission
- Skipping error handling in form submission handlers