JoseCortezz25

Guide for creating, componentizing, and refactoring UI components following Atomic Design. Use this skill whenever the user is actively building a new component, breaking down a UI into components, or refactoring an existing component. Trigger when the user shares a design/screenshot/code to componentize, when they are writing a new component from scratch, when they are splitting a large component into smaller ones, or when they are refactoring a component's structure or responsibilities. Do NOT trigger for general questions about Atomic Design theory — only when there is a concrete component being created, split, or refactored.

Enforce project-specific Git commit message conventions compatible with commitlint and pre-commit hooks. Use this skill whenever the user asks to write a commit message, create a git commit, stage and commit changes, suggest a commit for their changes, or review/fix an existing commit message. Also trigger when the user says "commitea esto", "hazme un commit", "qué mensaje de commit uso", or any variation of committing code changes.

Forms with React Hook Form + Zod. Use this skill whenever the user is building a form, adding a form field, writing a Zod schema for a form, creating a form hook, wiring a Server Action to a form, or handling form validation. Trigger when the user creates a new form component, asks how to validate a field, wants to handle form submission, or needs to show server-side errors. Do NOT trigger for general Zod schema questions unrelated to forms.

Use when creating, rewriting, reviewing, or optimizing prompts for /goal, goal mode, Codex goal mode, long-running coding agents, autonomous coding tasks, or concrete agent milestones. This skill turns vague work requests into short, verifiable, measurable /goal prompts with guidance, constraints, progress tracking, and cleanup criteria. Trigger even when the user says "make this a goal", "goal prompt", "optimize this prompt for an agent", "run this with /goal", or asks how to structure work for a coding agent.

Set up a new Next.js project with best practices, configured development environment, TypeScript support, and production-ready structure. Use when starting a new Next.js project, initializing a web application, or setting up a project with recommended folder structure and tooling.

React 19 patterns with React Compiler. Trigger: When writing React components - no useMemo/useCallback needed.

Tailwind CSS 4 patterns and best practices. Trigger: When styling with Tailwind - cn(), theme variables, no var() in className.

TypeScript strict patterns and best practices. Trigger: When writing TypeScript code - types, interfaces, generics.

Guide for creating, componentizing, and refactoring UI components following Atomic Design. Use this skill whenever the user is actively building a new component, breaking down a UI into components, or refactoring an existing component. Trigger when the user shares a design/screenshot/code to componentize, when they are writing a new component from scratch, when they are splitting a large component into smaller ones, or when they are refactoring a component's structure or responsibilities. Do NOT trigger for general questions about Atomic Design theory — only when there is a concrete component being created, split, or refactored.

Enforce project-specific Git commit message conventions compatible with commitlint and pre-commit hooks. Use this skill whenever the user asks to write a commit message, create a git commit, stage and commit changes, suggest a commit for their changes, or review/fix an existing commit message. Also trigger when the user says "commitea esto", "hazme un commit", "qué mensaje de commit uso", or any variation of committing code changes.

Forms with React Hook Form + Zod. Use this skill whenever the user is building a form, adding a form field, writing a Zod schema for a form, creating a form hook, wiring a Server Action to a form, or handling form validation. Trigger when the user creates a new form component, asks how to validate a field, wants to handle form submission, or needs to show server-side errors. Do NOT trigger for general Zod schema questions unrelated to forms.

Create distinctive, creative frontend designs that avoid generic "AI slop" aesthetics. Focus on unique typography, cohesive color palettes, atmospheric backgrounds, and well-orchestrated motion.

Enforce English-only identifiers in source code. Use this skill when writing, reviewing, or refactoring variable names, function names, types, interfaces, constants, props, or hooks. Trigger when the user writes or proposes a Spanish identifier, when reviewing code that mixes languages, or when naming something in a domain with Spanish business terms. Do NOT trigger for UI strings or message files — those are a product decision handled via messages.ts.

React 19 patterns with React Compiler. Trigger: When writing React components - no useMemo/useCallback needed.

Tailwind CSS 4 patterns and best practices. Trigger: When styling with Tailwind - cn(), theme variables, no var() in className.

TypeScript strict patterns and best practices. Trigger: When writing TypeScript code - types, interfaces, generics.

Deep-dive guide for configuring and using Guardian's advanced features in an existing project. Use this skill whenever the user wants to tune Guardian's behavior beyond basic setup: configuring providers with model selection, adjusting file patterns, setting up STRICT_MODE, using different run modes (--pr-mode, --ci, --all), structuring AGENTS.md with file references, managing the cache, or integrating Guardian into CI pipelines. Trigger when the user asks about Guardian configuration, run modes, AGENTS.md structure, cache behavior, or provider setup in depth — even if they don't say "implement".

Guides you through installing and setting up Guardian — the AI-powered Git hook for automated code review — in any project. Use this skill whenever the user wants to add Guardian to a project, set up AI code review as a pre-commit hook, run `guardian init` or `guardian install`, create the `.guardian` config or `AGENTS.md` rules file, or protect a repo with AI-assisted commit gating. Trigger even if the user just asks "how do I use Guardian?" or "can you set up Guardian for me?"

Genera interfaces gráficas (componentes React/HTML, mockups, fragmentos CSS/Tailwind) siguiendo al 100% el Brand Guideline de Omnicom Production (OP Mode — dark). Usa esta skill SIEMPRE que el usuario pida: crear o diseñar un componente, una pantalla, un layout, una card, un modal, un badge, un botón, una tabla, un formulario, o cualquier elemento visual. También úsala cuando el usuario mencione "brand guideline", "tokens", "modo OP", "nuestros estilos", "OP style", "Omnicom Production UI", o pida que algo "siga los lineamientos visuales", "respete los tokens" o "use nuestros colores". NUNCA hardcodees colores, tamaños ni tiempos sin referenciar los tokens de esta skill. Cita el token fuente en un comentario inline en cada valor visual que uses.

Repository Pattern for data abstraction in Next.js 15 + Supabase. Trigger: When reading or writing data in any domain — always use a repository, never import DB clients directly in components, hooks, or Server Actions.

Generate Advanced Custom Fields (ACF) Local JSON configurations for WordPress from visual designs or HTML structures. Use when creating ACF field groups, converting designs to ACF schemas, building WordPress custom fields from mockups, or when working with ACF Pro Local JSON format. Supports flexible content, repeaters, clone fields, and all ACF field types.

Use @ajosecortes/notify to add notification toasts in TypeScript/JavaScript web apps. A zero-dependency, framework-agnostic notification library with variants, actions, CSS variable theming, and accessibility built in. Use when the user asks for toast notifications, notification system, toast messages, alert toasts, snackbar, or wants to display success/error/warning/info messages in a web app. Works with vanilla JS, React, Vue, Svelte, Angular, or any DOM environment.

Automate Electron desktop apps (VS Code, Slack, Discord, Figma, Notion, Spotify, etc.) using agent-browser via Chrome DevTools Protocol. Use when the user needs to interact with an Electron app, automate a desktop app, connect to a running app, control a native app, or test an Electron application. Triggers include "automate Slack app", "control VS Code", "interact with Discord app", "test this Electron app", "connect to desktop app", or any task requiring automation of a native Electron application.

Generate structured Vibe Coding prompts (JSON) from wireframes or interface descriptions

Best practices for developing Figma plugins with the dual execution context model (sandbox + UI iframe). Use when writing code in src/plugin/ (sandbox), setting up IPC between sandbox and UI, working with the figma.* API, exporting assets, reading/writing the canvas, managing clientStorage, or handling Figma-specific constraints. Covers the monorepo-networker IPC pattern, node traversal, asset export, performance, and manifest configuration.

Guide for creating, componentizing, and refactoring UI components following Atomic Design. Use this skill whenever the user is actively building a new component, breaking down a UI into components, or refactoring an existing component. Trigger when the user shares a design/screenshot/code to componentize, when they are writing a new component from scratch, when they are splitting a large component into smaller ones, or when they are refactoring a component's structure or responsibilities. Do NOT trigger for general questions about Atomic Design theory — only when there is a concrete component being created, split, or refactored.