Formularios en Vue 3

Este curso pertenece a las siguientes rutas de aprendizaje

Contenido del curso
timer

Desbloquea el curso

Contrata un plan y consigue acceso completo

Crea tu cuenta

¿Ya tienes una cuenta? Inicia sesión

¿Qué aprenderás?

En este curso aprenderás a desarrollar formularios en Vue 3 utilizando Composition API, desde cosas 'sencillas' hasta formularios con múltiples pasos (Wizard), campos dependientes y mucho más que a continuación te explico.

Desarrollaremos un total de cinco formularios para cubrir muchos casos de uso, todos ellos utilizando las mismas dependencias pero de diferentes formas. Las dependencias utilizadas son estables y están 100% actualizadas, algo de lo que me he preocupado para que tengas las mejores herramientas para trabajar con formularios en Vue 3.

Todo el curso se llevará a cabo utilizando Tailwind CSS, te explicaré cómo configurarlo de forma completa en Vue 3 para que lo puedas exprimir al máximo.

También te explicaré cómo configurar ESLint en IntellIj o WebStorm. Si no sabes nada acerca de ESLint, simplemente debes saber que es una herramienta que nos ayuda a escribir mejor código. Formulario para números de teléfono El primer formulario será algo sencillo con un único campo para introducir un número de teléfono. Para que sea algo realmente útil, haremos uso de máscaras, también aplicaremos del código del país, en España por ejemplo es +34. Así forzaremos al usuario que nos visita que utilice un teléfono con el formato que nosotros deseamos.

Este formulario tendrá deshabilitado el botón de submit hasta que haya pasado la validación, que en este caso será el formato del teléfono. Formulario para coincidencia y fortaleza de contraseñas El segundo formulario es un caso muy utilizado en la web, la meta es aprender a validar la fortaleza de una contraseña añadiendo componentes para que visualmente el usuario que utiliza dicho formulario sepa si su contraseña es débil o fuerte.

Además, también aprenderemos a validar la coincidencia de contraseñas, es decir, que la confirmación haga match con la contraseña introducida, algo completamente necesario para evitar errores futuros de acceso. Formulario con campos dependientes Aunque en todo momento estaremos trabajando con Vue 3, prepararemos una serie de datos en archivos .json que consumiremos en esta sección del curso. Aquí aprenderás a construir formularios que tengan dependencia entre ellos mismos. La idea es ir filtrando los siguientes campos conforme el usuario va seleccionando opciones.

Al finalizar el proceso completo del formulario le brindaremos los resultados que hemos encontrado para sus intereses, un campo muy típico en muchas aplicaciones. Formulario para pagar con tarjeta Los formularios de pago están a la orden del día desde hace ya demasiado. En este bloque aprenderás a crear el tuyo propio de forma completa, pero recuerda, siempre en el cliente, no nos comunicamos con APIs ni nada parecido.

En este formulario tendremos varios datos sensibles que controlar, a nivel de interfaz pero también de validación, tales como titular de tarjeta, número de tarjeta, fecha de expiración y código de verificación. Hasta que todos estos campos no sean correctos no podremos realizar el pago, como la vida misma. Formulario Wizard con múltiples pasos La guinda del pastel para el final, un formulario con múltiples pasos pero que únicamente valide los datos para cada paso, y no para todo el esquema de validación definido. La idea es simple, si en pantalla sólo vemos dos campos, ¿por qué validar el resto?

En este bloque además de aprender a crear formularios Wizard con Vue 3, aprenderás otras muchas cosas por el camino que estoy seguro te resultarán muy útiles en tu día a día, sinceramente no tiene desperdicio.

Gracias a este curso dominarás los formularios en Vue 3 como un master, y mira que no me gusta nada esa palabra, pero te garantizo que lo que aprenderás aquí te va a facilitar el trabajo de una forma tremenda en tu día a día.

Si quieres aprender a crear formularios en Vue 3 ni lo dudes, suscríbete ahora a la plataforma y accede al path de Vue 3, que junto con este curso te brindan todo lo necesario para ser un PRO en el mejor framework para desarrollar interfaces en el cliente con JavaScript y HTML. 

Requisitos

Haber seguido los cursos anteriores de la ruta de aprendizaje con Vue 3.

¿A quién va dirigido el curso?

Desarrolladores que trabajen con Vue 3 y Composition API y deseen adentrarse de lleno en el trabajo con formularios de forma correcta.

¿Qué hacer en caso de dudas durante el curso?

Si estás suscrito al plan Trimestral o Anual cuentas con soporte completo en menos de 24 horas dentro de días laborables.

Cursos relacionados

Acerca del autor

Desarrollador con 10 años de experiencia en web y móvil y formador con 7 años de experiencia.
Empecé en el mundo de la programación a raíz de un accidente de trabajo y me tuve que reinventar.
Soy autodidacta, me dedico de forma profesional a desarrollar software y cada día aprendo cosas nuevas.
Apasionado del backend, me encanta todo lo que tiene que ver con procesos y lógica.
Me encanta programar, pero todavía más ayudar a otras personas en su proceso de formación.

Cursosdesarrolloweb

Israel Parra

Php, JavaScript, Laravel, Vue, React, React Native, Svelte, Serverless

Valoraciones
5
star star star star star

2 valoraciones

star star star star star
star star star star star_border
star star star star_border star_border
star star star_border star_border star_border
star star_border star_border star_border star_border
Andrew

hace 2 años

Andrew - La mejor plataforma para aprender de Vue 3!
star star star star star

Si quieres volverte un Pro en Vue 3 aprendiendo desde lo basico hasta avanzado con las mejorares practica esta es la plataforma correcta, muchas gracias profe Israel por enseñarnos lo mejor

Cristian Sepúlveda Caro

hace 3 años

Cristian Sepúlveda - FORMULARIOS EN VUE3
star star star star star

Excelente curso, no me dejo de sorprender, y aprender con Israel. Gracias, ha sido la mejor página de cursos hay.

Cursosdesarrolloweb Cursosdesarrolloweb

Cursosdesarrolloweb es una plataforma educativa con cursos y tutoriales en texto y vídeo.

Términos y condiciones Política de privacidad Formulario de contacto

Copyright 2024 © Todos los derechos reservados.

Contacto