jpskill.com

すべてのSkill (11,660)

🛠️ 開発・MCP コミュニティ
Vue 3 型安全 i18n
web-i18n-vue-i18n
Vue 3 Composition API で国際化対応を行う際に、型安全性を確保し、より安全で効率的な多言語対応のウェブアプリケーション開発を支援するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
React Intl 国際化
web-i18n-react-intl
ICUメッセージ形式で国際化対応されたWebアプリケーションを、React Intlライブラリを用いて多言語対応させるための翻訳作業を効率化するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Next.js 型安全 i18n
web-i18n-next-intl
Next.js App Routerで、型安全な国際化(i18n)を実現し、多言語対応のWebアプリケーション開発を効率的に進めることができるSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Vue 3 Composition API
web-framework-vue-composition-api
Vue 3のComposition APIを活用し、リアクティビティやコンポーザブル、ライフサイクルといった要素を組み合わせて、効率的で再利用可能なVue.jsのWebアプリケーションを構築するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Svelte 5 Runes リアクティビティ
web-framework-svelte
Svelte 5のRunesという新しい仕組みを使って、状態管理やデータの加工、イベント処理などを効率的に行い、より使いやすいウェブサイトやアプリケーションを開発するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
SolidJS リアクティブ開発
web-framework-solidjs
SolidJSのきめ細かいリアクティビティパターン(シグナル、エフェクト、メモ、ストア、リソース作成、制御フロー、Suspense、SolidStartなど)を活用して、効率的なWebアプリケーション開発を支援するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
React コンポーネント設計
web-framework-react
ReactというJavaScriptライブラリを用いて、ウェブアプリケーションの画面を部品のように組み合わせて構築したり、便利な機能を利用したり、効率的な開発手法を適用したりするSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Angular スタンドアロン構成
web-framework-angular-standalone
Angular 17-19のスタンドアロンコンポーネント、シグナル、制御フロー、依存性注入パターンといった機能を活用し、より効率的でモダンなWebアプリケーション開発を支援するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Zod スキーマバリデーション
web-forms-zod-validation
TypeScriptでWebフォームのデータを扱う際に、Zodというライブラリを使って、データの形式や内容が正しいか自動でチェックし、型を安全に扱えるようにするSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
TanStack Form 実装
web-forms-tanstack-form
TanStack Formというライブラリを活用し、入力フォームの作成、入力項目の管理、データの検証、配列データの扱い、項目間の連携などを型安全に行えるようにするSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
React Hook Form 実装
web-forms-react-hook-form
React Hook Formというライブラリを活用し、フォームの作成、入力制御、配列データの扱い、バリデーション設定、パフォーマンス改善など、Reactで効率的なWebフォームを構築・最適化するSkill。
詳しく見る →
🎨 デザイン コミュニティ
クライアント画像処理
web-files-image-handling
Webブラウザ上で画像ファイルを扱い、プレビュー表示、サイズ変更、圧縮、向き調整、形式変換などを行い、メモリを効率的に管理することで、快適な画像処理を実現するSkill。
詳しく見る →
💼 ビジネス コミュニティ
ファイルアップロード実装
web-files-file-upload-patterns
ドラッグ&ドロップや分割アップロード、S3署名付きURLなど、様々なファイルアップロード方式に対応し、ファイル形式の検証や進捗状況の表示、画像プレビュー、アクセシビリティ対応まで行うSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
TypeScript Result 型エラー処理
web-error-handling-result-types
TypeScriptのResult/Either型を活用し、エラーを値として扱い、鉄道指向プログラミングのパターンで、より安全かつ効率的にWebアプリケーションのエラー処理を実装するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
React エラーバウンダリ
web-error-handling-error-boundaries
Reactアプリケーションでエラーが発生した際に、エラー境界パターンや代替UIを表示し、リセットや再試行を可能にすることで、ユーザー体験を向上させるエラー処理を実装するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Apollo Client GraphQL
web-data-fetching-graphql-apollo
Apollo ClientとGraphQLを活用し、データの取得・更新・キャッシュ管理を効率的に行い、画面表示の最適化やリアルタイム更新を実現するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
View Transitions API
web-animation-view-transitions
Web Animations APIとView Transitions APIを活用し、同一ドキュメント内や複数ページ間でのスムーズな画面遷移、要素のアニメーション、擬似要素のスタイリング、アクセシビリティ対応などを実現するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Framer Motion アニメーション
web-animation-framer-motion
Framer Motion(旧Motion)のアニメーションパターンを活用し、コンポーネント、ジェスチャー、レイアウト、スクロール連動など、Webサイトに動きのある表現を手軽に追加し、アクセシビリティにも配慮したアニメーションを実装するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
CSS アニメーション設計
web-animation-css-animations
CSSアニメーションの様々なパターン(トランジション、キーフレーム、スクロール連動、カスタムプロパティなど)を駆使し、GPUアクセラレーションやアクセシビリティにも配慮したWebアニメーションを実装するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Web アクセシビリティ対応
web-accessibility-web-accessibility
ウェブコンテンツを、高齢者や障碍のある方など、誰もが使いやすいように、アクセシビリティに関する国際的な基準や技術を用いて改善するSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
TypeScript 厳格モード設定
shared-tooling-typescript-config
TypeScriptの厳格な設定や最新オプション、パスエイリアスの同期、特殊な設定などを扱い、TypeScriptプロジェクトの構成を効率化し、保守性を高めるSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
Husky + lint-staged Git フック
shared-tooling-git-hooks
Git hooks、lint-staged、commitlintなどを設定し、CI/本番環境に対応、モノレポ構成やv8からの移行もサポートすることで、開発ワークフローを効率化し、コード品質を向上させるSkill。
詳しく見る →
🛠️ 開発・MCP コミュニティ
ESLint + Prettier 設定
shared-tooling-eslint-prettier
ESLintとPrettierというコード整形ツールを、設定ファイル共有やTypeScriptとの連携で効率的に使い、コードの品質を維持・向上させるSkill。
詳しく見る →
💬 コミュニケーション コミュニティ
Biome 統合リンター/フォーマッター
shared-tooling-biome
Biome v2は、ESLintやPrettierといった複数のツールを、Rust製の単一ツールに置き換えることで、高速化と高い互換性を実現し、コードの品質管理を効率化するSkill。
詳しく見る →