Procesar envíos de formularios HTML con Svelte

Este proyecto muestra cómo crear un formulario en Svelte, capturar la entrada de los usuarios y procesar los datos al enviarlo. El ejemplo incluye la validación de los datos antes de enviarlos y muestra cómo usar notificaciones (toast) para informar al usuario sobre el éxito o error del proceso.

Resultado final

Características

• Formulario de entrada con campos para nombre, sexo, profesión y edad.
• Validación para asegurarse de que el campo de sexo sea "Masculino" antes de enviar el formulario.
• Utiliza la librería nextjs-toast-notify para mostrar notificaciones de éxito o error.
• Los datos del formulario se envían y se guardan en un array que se comparte entre el componente padre e hijo mediante binding bidireccional.

Tecnologías utilizadas

• Svelte: Framework para crear interfaces de usuario reactivas.
• nextjs-toast-notify: Librería para mostrar notificaciones emergentes de éxito y error.

[!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 😮.

Documentación oficial Nextjs Toast Notify

👍Alertas

👍 NPM

Instalación

Para comenzar con el proyecto, sigue estos pasos:

1. Clona este repositorio:

   git clone https://github.com/tu_usuario/proyecto-svelte-formulario.git
   cd proyecto-svelte-formulario
   

2. Instala las dependencias:

   npm install
   

3. Inicia el servidor de desarrollo:

   npm run dev
   

4. Abre el navegador y accede a la URL indicada (por lo general http://localhost:5173).

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 🤓.