Seleccionar Múltiples Elementos en una Tabla con Checkboxes en Svelte 🚀

Este proyecto es una aplicación sencilla de gestión de registros en una tabla, implementada con Svelte. Permite eliminar registros seleccionados de una lista, seleccionar todos los registros a la vez, y mostrar alertas emergentes para confirmar las operaciones.

Resultado final

Características

• Selección masiva: Los usuarios pueden seleccionar o deseleccionar todos los registros con un solo clic.
• Eliminación de registros: Los registros seleccionados se pueden eliminar de manera dinámica.
• Alertas emergentes: El sistema muestra alertas para informar al usuario sobre el éxito de la operación.
• Visualización en tabla: Los registros se muestran en una tabla con campos como nombre, teléfono, sexo, profesión, y departamento.

Tecnologías Utilizadas

• Svelte: Framework para la creación de interfaces de usuario interactivas.
• Bootstrap: Framework CSS para la maquetación y el diseño responsivo.
• Bootstrap Icons: Biblioteca de íconos para enriquecer la interfaz.
• Next.js Toast Notify: Librería para mostrar alertas emergentes Ver
• Loading Request: Librería para mostrar el Loading

[!IMPORTANT] La librería Nextjs Toast Notify es opcional, pero su implementación es tan sencilla que sería un desperdicio no aprovecharla. Mejora significativamente la experiencia del usuario en la aplicación 😮.

Funcionamiento

1. Carga de Datos: El proyecto carga datos de un archivo data.json que contiene la información de las personas. Este archivo debe estar ubicado en la carpeta pública del proyecto.
2. Selección y Eliminación: El usuario puede seleccionar registros individualmente o seleccionar todos al mismo tiempo. Luego, los registros seleccionados pueden eliminarse de la tabla.
3. Alertas: Tras la eliminación de un registro, se muestra una alerta emergente que notifica al usuario sobre el éxito de la operación.

Instalación

Requisitos

• Node.js 16.x o superior

Pasos para la Instalación

1. Clona el repositorio:

   git clone https://github.com/urian121/eliminar-multiples-registros-dinamicamente-en-una-tabla-con-Svelte
   cd eliminar-multiples-registros-dinamicamente-en-una-tabla-con-Svelte
   

2. Instala las dependencias:

   npm install
   

3. Ejecuta el servidor de desarrollo:

   npm run dev
   

4. Abre tu navegador y visita http://localhost:5173/ para ver la aplicación en acción.

Apóyanos 🙌

✨ Comparte este proyecto con otros desarrolladores para que puedan beneficiarse 📢. ☕ Invítame un café o una cerveza 🍺:

• Paypal ([email protected]). 👍 Suscríbete a mi canal de YouTube para más contenido increíble y tutoriales. ⭐ Déjanos una estrella en GitHub:
• Dicen que trae buena suerte 🍀.

Gracias por tu apoyo 🤓.