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 (iamdeveloper86@gmail.com). 👍 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 🤓.