Skip to main content
La biblioteca de componentes es una colección de componentes de interfaz pulidos y listos para usar. Puedes agregarlos a tu app directamente desde el chat de IA del editor. En lugar de describir un diseño desde cero, explora componentes seleccionados y elige el que quieras. Base44 lo reconstruye dentro de tu app.
Cuando agregas un componente, Base44 lo adapta al estilo de tu sitio. Ajusta sus colores, fuentes y contenido a tu app, en lugar de insertar un bloque genérico. Siempre puedes personalizar más el diseño pidiéndoselo al chat de IA.
Captura de pantalla de la ventana de la biblioteca de componentes con All components seleccionado, la lista de categorías y una cuadrícula de componentes coloridos

La biblioteca de componentes en el editor de tu app


Abrir la biblioteca de componentes

Abre la biblioteca de componentes desde el menú del signo más en el chat de IA, junto a donde escribes tus prompts.
Cuando seleccionas un componente, el chat de IA cambia automáticamente a Build mode. Para obtener más información sobre los modos de chat, consulta Modos del chat de IA.
Para abrir la biblioteca de componentes:
  1. Ve al editor de tu app.
  2. En el chat de IA, haz clic en el icono del signo más junto al cuadro de prompt.
  3. Haz clic en Explore component library.
Captura de pantalla del menú del signo más del chat de IA con el cursor sobre Explore component library

Abrir la biblioteca de componentes desde el menú del signo más


Explorar y previsualizar componentes

La biblioteca de componentes se abre en una ventana grande. Arriba hay un cuadro de búsqueda y a la izquierda una lista de categorías. All components muestra todo el contenido de la biblioteca. Cada categoría agrupa los componentes según su propósito, como Commerce, Navigation y Booking & Scheduling. Tienes 3 formas de encontrar un componente:
  • Búsqueda: Escribe una palabra clave en el cuadro de búsqueda. La búsqueda se hace en la categoría abierta. Para buscar en toda la biblioteca, elige primero All components.
  • Categorías: Haz clic en una categoría a la izquierda para ver solo sus componentes. En un teléfono, las categorías aparecen como una fila sobre el cuadro de búsqueda.
  • Filtros: Haz clic en Filters para acotar la lista por etiqueta.
Pasa el cursor sobre un componente para verlo en acción. Luego haz clic en él para abrir sus detalles. Verás una vista previa en vivo que puedes cambiar entre Desktop y Mobile, y una breve descripción. Algunos componentes incluyen Try different states para ver cada estado antes de agregarlo. Usa las flechas junto al nombre del componente para ir al anterior o al siguiente.
Captura de pantalla de la biblioteca de componentes con la categoría Commerce resaltada y sus componentes mostrados con Filters

Explorar una categoría en la biblioteca de componentes


Agregar un componente

Desde los detalles de un componente, indica a la IA cómo usarlo. Luego agrégalo a tu prompt o constrúyelo de inmediato. Puedes agregar un componente por mensaje. Al enviar el mensaje, Base44 reconstruye el componente como código React dentro de tu app. También adapta su estilo, fuentes y textos a tu diseño. Para agregar un componente a tu app:
  1. Haz clic en el icono del signo más junto al cuadro de prompt en el chat de IA del editor de tu app.
  2. Haz clic en Explore component library.
  3. Haz clic en el componente que quieras.
  4. En How should the AI use it?, describe dónde va, como una página o sección. Este paso es opcional.
  5. Haz clic en Add to chat para colocarlo en tu prompt y editar el mensaje primero. O haz clic en Build now para enviarlo de inmediato.
Captura de pantalla de los detalles de un componente con su vista previa en vivo, su descripción y los botones Add to chat y Build now resaltados

Los detalles de un componente, con Add to chat y Build now

Más sobre cómo agregar componentes:
  • Agregado rápido: Para agregar un componente sin abrir sus detalles, haz clic en el + de su tarjeta.
  • Volver a verlo: Para ver un componente más tarde, haz clic en su chip en el cuadro de prompt o sobre el mensaje que enviaste.
  • Nuevas bibliotecas de código: Algunos componentes dependen de una biblioteca de código que tu app aún no tiene. En ese caso, Base44 te pide aprobar su instalación al construir el componente. Obtén más información sobre cómo agregar y usar paquetes npm.

Preguntas frecuentes

Haz clic en una pregunta para obtener más información.
Puedes agregar un componente por mensaje. Para agregar otro, abre de nuevo la biblioteca de componentes y repite los pasos.
No. Agregar un componente es un mensaje de construcción estándar. Usa créditos igual que cualquier otro prompt. No hay ningún cargo aparte por explorar o agregar un componente.
Sí. Una vez construido, el componente forma parte de tu app. Puedes pedirle al chat de IA que cambie su estilo, su contenido o su diseño, como con cualquier otra parte de tu app.
Esta página fue traducida con IA. Para obtener la información más precisa y actualizada, consulta la versión en inglés.