Communitygithub.com

YepAPI/skills

Patrones de LaunchDarkly/Flagsmith/Vercel, despliegues graduales, divisiones porcentuales, alternancias A/B.

¿Qué es skills?

Este skill proporciona las mejores prácticas y patrones para implementar y gestionar feature flags (banderas de características) en aplicaciones modernas. Cubre la integración con plataformas líderes como LaunchDarkly (para entornos empresariales), Flagsmith (como alternativa open-source) y Vercel Flags / `@vercel/flags` para proyectos Next.js. El skill enfatiza la importancia de los despliegues graduales: enviar código detrás de flags y habilitarlo de forma incremental. Define tipos de flags (booleanas, porcentuales y por segmentos de usuarios) y establece una convención de nomenclatura clara (kebab-case descriptivo). Además, aborda la evaluación de flags del lado del servidor por defecto, la limpieza de flags obsoletos (considerados deuda técnica), el uso de hashing de IDs de usuario para bucketing consistente en despliegues porcentuales, y la configuración de flags para pruebas A/B con seguimiento de eventos de conversión. Incluye ejemplos de código para Vercel Flags/Next.js y LaunchDarkly, y advierte sobre malas prácticas como enviar funciones sin flag, anidar dependencias de flags o dejar flags en el código tras un rollout completo al 100%.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/YepAPI/skills/tree/HEAD/skills/feature-flags

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Feature Flags

Reglas

  • Usa feature flags para despliegues graduales — envía código detrás de flags, actívalo de forma incremental
  • Tipos de flags: booleana (activado/desactivado), porcentual (10% de usuarios), segmentación por usuario (IDs/segmentos específicos)
  • LaunchDarkly para empresas, Flagsmith para código abierto, Vercel Flags o @vercel/flags para Next.js
  • Evalúa flags del lado del servidor por defecto — solo pasa los valores de las flags al cliente, nunca la lógica de evaluación
  • Convención de nomenclatura de flags: enable-new-checkout, show-pricing-v2 — descriptivo, kebab-case
  • Limpia las flags después del despliegue completo — las flags obsoletas son deuda técnica; establece fechas de expiración
  • Despliegues porcentuales: hashea el ID de usuario para un bucketing consistente — el mismo usuario siempre ve la misma variante
  • Por defecto, desactiva la flag para funciones nuevas — falla de forma segura si el servicio de flags no está disponible
  • Usa flags para pruebas A/B: define variantes, rastrea eventos de conversión, mide la significancia estadística
  • Almacena sobrescrituras de flags en variables de entorno para el desarrollo local

Patrones

// Patrón Vercel Flags / Next.js
import { flag } from "@vercel/flags/next";

export const showNewCheckout = flag({
  key: "show-new-checkout",
  decide: () => false, // desactivado por defecto
});

// En un componente de servidor
const enabled = await showNewCheckout();
// Patrón LaunchDarkly
import * as ld from "@launchdarkly/node-server-sdk";
const client = ld.init(process.env.LAUNCHDARKLY_SDK_KEY!);

const showFeature = await client.variation("new-checkout", user, false);

Evitar

  • Enviar funciones sin una flag — cada nueva función debe ser toggleable
  • Dependencias anidadas de flags — mantén la lógica de flags plana e independiente
  • Dejar flags en el código después de un rollout al 100% — programa la limpieza en un plazo de 2 semanas
  • Evaluación de flags del lado del cliente exponiendo reglas de segmentación — evalúa en el servidor, envía el resultado

Individual skills in this repo

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

YepAPI/skills

WCAG 2.1 AA — semantic HTML, keyboard navigation, screen readers.

YepAPI/skills

Experiment setup, variant splitting, statistical significance, and feature flag integration.

YepAPI/skills

CRUD generators, data tables, user management, role-based access, and bulk operations.

YepAPI/skills

Monitor what ChatGPT and Gemini say about your brand using YepAPI.

YepAPI/skills

Queue workers with BullMQ/Inngest/Trigger.dev, job retries, dead letter queues, concurrency.

YepAPI/skills

Commander.js, interactive prompts with Clack, spinners, colors, config files, exit codes, and npm publishing.

YepAPI/skills

cmdk integration, Cmd+K trigger, fuzzy search, grouped actions, keyboard navigation, and dynamic action registration.

YepAPI/skills

Content planning with trend and sentiment data from YepAPI.

YepAPI/skills

Content calendar, keyword-driven planning, and content briefs.

YepAPI/skills

Theme switching with CSS variables, system preference detection, next-themes, and persistence.

YepAPI/skills

Threaded comments, @mentions, reactions, moderation queue, optimistic UI, and cursor pagination.

YepAPI/skills

Competitive analysis between domains using YepAPI.

YepAPI/skills

Layout grids, KPI cards, data tables with sorting/filtering, sidebar navigation, and responsive breakpoints.

YepAPI/skills

Data encryption — TLS everywhere, AES-256-GCM for PII, bcrypt passwords, encrypted backups.

YepAPI/skills

Chart patterns with Recharts/Nivo/D3, responsive containers, color scales, and accessibility.

YepAPI/skills

Drizzle schema definition, push vs migrate, type-safe queries, relations, transactions, and prepared statements.

YepAPI/skills

Upload handling, resize/compress, CDN delivery, blur placeholders, and next/image patterns.

YepAPI/skills

Local business and Google Maps research using YepAPI.

YepAPI/skills

Cursor-based pagination, IntersectionObserver, virtualized lists with @tanstack/react-virtual, and scroll position restoration.

YepAPI/skills

Chat UI components, streaming responses with AI SDK, context window management, and RAG patterns.

Skills relacionados