CommunityProgramación y desarrollogithub.com

lobehub/zustand

Convenciones de tienda Zustand de LobeHub. Úselo al editar src/store, slices de tienda, acciones públicas/internas, acciones de dispatch, flattenActions, actualizaciones optimistas, selectores, mapas o migración de acciones de clase.

¿Qué es zustand?

Este skill define las convenciones para trabajar con tiendas Zustand en el proyecto LobeHub. Proporciona pautas claras sobre cómo estructurar y editar el directorio `src/store`, incluyendo slices de tienda (store slices), acciones públicas e internas, acciones de dispatch, flattenActions, actualizaciones optimistas, selectores, mapas y la migración de acciones de clase. Es útil para desarrolladores que mantienen o contribuyen a LobeHub, asegurando consistencia y buenas prácticas en el manejo del estado global. Funciona en plataformas como Claude Code, Cursor y Codex, y se basa en el archivo SKILL.md para documentar las reglas y patrones de implementación.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/lobehub/lobe-chat/tree/main/skills/zustand

Installed? Explore more Programación y desarrollo skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Preguntar en tu IA favorita

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

Documentación

¿Qué hace zustand?

Convenciones de tienda Zustand de LobeHub. Úselo al editar src/store, slices de tienda, acciones públicas/internas, acciones de dispatch, flattenActions, actualizaciones optimistas, selectores, mapas o migración de acciones de clase.

Slices de tienda

  • Divida la tienda en slices lógicos según la funcionalidad.
  • Cada slice debe tener su propio archivo dentro de src/store.

Acciones

Acciones públicas e internas

  • Las acciones públicas se exportan desde el slice principal.
  • Las acciones internas se mantienen privadas y solo se usan dentro del slice.

Acciones de dispatch

  • Use dispatch para acciones asíncronas o multi-paso.
  • Defina las acciones de dispatch en un archivo separado siguiendo la convención de nombres.

flattenActions

  • Use flattenActions para aplanar acciones anidadas y mejorar el rendimiento.

Actualizaciones optimistas

  • Implemente actualizaciones optimistas para mejorar la experiencia de usuario.
  • Asegúrese de revertir los cambios si falla la operación.

Selectores

  • Cree selectores para acceder a partes específicas del estado.
  • Use createSelector para memoización cuando sea necesario.

Mapas

  • Para datos tipo mapa, use estructuras de datos inmutables como Map de JavaScript o librerías como immer.

Migración de acciones de clase

  • Migre acciones de clase a funciones simples siguiendo el patrón Zustand.
  • Elimine dependencias de ciclo de vida de clase y conviértalas en hooks o efectos.

Individual skills in this repo

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

Skills relacionados