Guía de Formik - Librería para Formularios en React

[@FalconMasters]

Si te gusto el video dale manita arriba y no olvides suscribirte para mas tutoriales de desarrollo web!

[@vanessamc3342]

Puto amo como siempre ✌️😄

[@FalconMasters]

@@vanessamc3342 haha gracias !

[@soulhunter223]

Este tutorial sigue siendo vigente a dia de hoy, muchas gracias crack!😌

[@ntrpause]

¡Gracias!

[@victorga74_1]

Gracias por la paciencia y la manera tan excelente de explicar. Saludos

[@orlandocastaneda3169]

que pedaso de tutorial, excelente! yo tenia dudas que me adelante a buscar pero resulto que todas las resolvio a su tiempo jaja

[@mperezguendulain]

Muchísimas gracias Carlos, desde que vi tus primeros videos hace años supe que me tenía que suscribir. Muchas gracias por todo el apoyo!

[@SandraPerez-tj6fj]

Excelente video, y la explicación, estoy empezando a armar un formulario y realmente me sirve muchísimo.GRACIAS

[@juliopaez9989]

Excelente Carlos, Gracias infinitas, fue un placer haber seguido el video, realmente me abrió la mente a posibilidades infinitas. Gracias, Gracias, Gracias

[@jeycolon]

Amigo eres un gran maestro, gracias por tanto. Un abrazo

[@SuperOskytar]

Mejor tutorial de Formik que he visto

[@edummorenolp]

Una gran herramienta, y muy bien explicada. Gracias.

[@lilajoha]

38:24 como se hace la llamada a la api de whatsapp?

[@vitalivs7249]

Gracias amigo, muy buena guía, explicas muy claro. Te ganaste un nuevo suscriptor.

[@marcosmartilotta848]

Simplificando todo como siempre!

[@qeqerevo]

Buenisimo el video, no usar estados dentro de un componente es una gloria jajaj

[@AltoViajeBlog]

Hola, por ahora funciona! Pero tengo algunas dudas. Cómo hago validaciones? Por ejemplo, siguiendo tu form, alguien podría mandar u poniendo un nombre o un mensaje con una sola letra, cómo hago para poner un minlength? Y la otra duda es cómo hago para que sea realmente funcional, o sea que pueda enviarlo a un servidor y me llegue a mi mail la información que envía el usuario? Muchas gracias!

[@mariasilviamorales5393]

Excelente Video. Muchas gracias por todo lo que enseñás. Me fuiste de mucha ayuda. Voy a seguir viendo tus tutoriales para seguir aprendiendo.

[@FalconMasters]

Muchas gracias! Espero que aprendas mucho en todos ellos.

[@fidelp27]

Excelente video! Muchas gracias por compartir. Súper claro todo

[@natachavergara412]

Gracias por el tutorial, rápido, fácil y super entendible.

[@yoanestradablanco1608]

Exelenete he estado buscando una libreria que me ayudara a no hacer esto manualmente saludos y exito hermano voy a compara tu curso de udemy para apoyar

[@FalconMasters]

Me alegra que te sirviera y gracias por el apoyo lo aprecio mucho.

[@silvinaronzoni9573]

Excelente video....muchas gracias !!!

[@MiguelRodriguez-ks1gs]

Excelente tutorial... gracias por tu trabajo 🙂

[@axcha22]

Muchas gracias por el contenido, excelente video. Saludos:)

[@sebastianacevedo8422]

Excelente!! te agradezco mucho este video!

[@andersonenocsmorilloguzman9139]

Gracias chulisimo Falcon..

[@melisapeano9707]

Gracias!! muy buena tu explicación

[@camilarojasserantoni3241]

que buen video! muchas gracias por la completisima explicación! ahora lo aplico en mi proyecto ;)

[@antonionavarrro]

Excelente video, justo ahora estaba buscando algo sobre Formik 👍

[@valentinewiggin9705]

Muchísimas gracias por el video, excelente.

[@alelasgrutas]

Muchas gracias ! muy bueno tu aporte.Saludos

[@nivus97]

Muy buen video, bien explicado, como siempre, gracias! 👏

[@borissinisterra6730]

Muy buena explicación, eres un crack bro.

[@santi_cendra_music]

Buenas! consulta! Tengo una tabla y quiero que al apretar el boton edit ya me cargue como "initialvalues()" los datos del usuario en cada campo, la fino viene de un param... como se haria eso como algo asi (pero esto obvio que no va)-> value={formik.values.nombre&&dataEdit.nombre}

[@edgarlinanmedellin7153]

Muy buen tutorial, aprendí demasiado y te ahorra mucho tiempo a comparación de la otra forma, pero me quedo una duda en el video donde realizas la validaciones usando estados y le das estilos con styled components,¿Como agregaríamos estilos cuando es validado o no, ya que antes importabas Input que era un styled-component y ahora usas Field?

[@AlanMartinez96]

Nice video bro ! I just have one thing to correct at the minute 27:10 when u say that the variable errores must be a declared as let. Remember that u r working with an object that has the property of being mutable. Therefore later when u add a new prop like errores.nombre = "anything" It doesn't matter if u declare the errores variable as const or let. Because u are not changing the value of the variable. You r just mutating it. Once again you've done a really good job on this video. These things are really useful for the community

[@jfbj1792]

Gran video. Gracias por el gran aporte 😀

[@davidespinoza1469]

Excelente, gracias!

[@jibleg]

Excelente video. Solo falto implementar la validación usando Yup

[@compaluis51]

Genial FalconMaster !! Felicidades. Sólo faltaría la explicacion para datos adjuntos para calificar de excelente tu tema. Ya tengo todo listo pero ahora cómo lo envío ya en producción?. Saludos.

[@josesantillan732]

Te amo sos un genio

[@diegoazocar506]

Excelente video, muy buen trabajo. ¿Existe alguna forma que las validaciones de campo, como campos vacíos, largo de texto, etc lo haga automáticamente sin aplicar lógica?, esto facilitaría mucho las cosas. Algo así como laravel con "validate". Muchas gracias.

[@ryan2000]

Te recomiendo instalar Yup

[@ntrpause]

20:09 como se hace la seleecion de multicursores en mac?

[@FalconMasters]

No se como sea en mac, pero tiene que ser similar, Alt + Clic, o Command + Click, o shift + click.

[@ntrpause]

@@FalconMasters Gracias esta genial el video esta mejor que el curso que compre en udemy

[@jeanchavez6048]

luego los values de los inputs, los puedo usar como props para otro componente?

[@AngelUrbina-vt8ye]

Muchas gracias!!!

[@klaynospina9236]

el video esta muy bueno una pregunta en temas laborales como se enviarian a un api?

[@juancaycho6711]

Excelente tutorial, me sirvió bastante.

[@EdwinHernandez-zw3ob]

Demasiado bueno amigo

[@exequielfloresarriagada1825]

Gran tutorial eres un Crack !!

[@alejandromonroy8726]

Un abrazo

[@Hernanskate100]

gran video gracias

[@braianezequielrosales3982]

Hola !! Cual es el theme de vscode que esta usando ?? Esta buenisimo.

[@NovatoWTF]

Falcon, No te olvides enseñar de GRAPHQL EN EL BACKEND Y FRONTEND. TAMBIEN EN TIEMPO REAL.

[@kevin101294]

Por favor

[@JorgePerez-hg9jt]

Muchas gracias, una pregunta, si quisiera añadirle un estilo disbled al botón cuando alguno de los inputs no pasen la validación con qué propiedad podría validar ese estilo?

[@ospcg]

Me gusta el tema de vscode y el sonido de tu teclado, que usas en ambos casos? Buen video bro

[@pablos.r1305]

Excelente, fui el like número 1000 jeje

[@FalconMasters]

muchas gracias!

[@berlinjuan]

exelente como siempre !!!!

[@SrCR4ZY]

Gracias falcon!!

[@AndresRojas-tr9ir]

Muy buen tutorial!

[@victortrejo4517]

yo tengo una duda, tengo un formulario en el cual tengo que insertar el rfc ¿como le hago para que me muestre un dialog si el rfc ya existe en la base de datos?

[@maximilianosarmiento2451]

Hola, una consulta! como podría trabajarlo en caso de un textarea? lo intenté de la misma forma que los inputs, pero algo sale mal..

[@matiasask3774]

Hola gracias por el contenido!. una pregunta, como manejas inputs como checkbox, radibutton y select en el caso que sea un formulario mas complejo? saludos

[@tuhablasingles]

Excelente video, si quisiera pasar el estado de otro componente por props como valor de uno de los fields se podria con formik ?

[@juliopaez9989]

Me pasa idem con Formik, le paso por props el valor a los campos y se inicia la primera vez en blanco o siempre con los datos del registro anterior. No encuentro como hacer que se inicie con los datos del registro actual.

[@miguelvasquez9849]

Por algún motivo, cuando instalo "formik", me empieza a salir un error en "eslint" que dice " 'name' is missing in props validation " cuando paso props a un componente como función. Pero ya probé y es cuando instalo "formik".

[@darwinsinche294]

Falcon, como puedo utilizar formik con componentes Antd, Syncfusion, Material UI, etc.

[@TheVERDOLAGA45]

Hola. ¿Cómo haría para realizar la opción de editar de un CRUD con axios para que me cargue los datos de la BD del registro a editar con FORMIK?

[@pablohperez]

Supongo que podrìas cargarlos en el initialValues del formik

[@magalif.5737]

Buenas Carlos, tenés planeado hacer un curso de Next js para subir a Udemy?

[@FalconMasters]

Si, pero no estoy seguro de cuando lo haré. Primero estoy trabajando en actualizar todos mis cursos.

[@juanochando7146]

gracias bro

[@GiancarloCarccamo]

buen video

[@ttvhuskyy3679]

porque si pongo un console log de values dentro de la funcion de retorno siempre me imprime 3 veces los valores? {({ values, errors, touched, handleSubmit, handleChange, handleBlur }) => ( {/* */} {console.log(values)}

[@YohGar2854]

Muy bueno el video pero como obtengo los valores de un campo mientras escribo, ósea capturar los valores de un campo mienta escribo

[@sanant8748]

Alguna guía ara intergralo con recaptcha?

[@jorgellanque7704]

Comienza en 12:45

[@leandropeeledobleve]

tal cual

[@borisjoelmendozatamara5174]

Gracias 😁😁😁

[@dennisfraile4529]

Buen video, una pregunta se puede usar formik dentro de un modal ?

[@FalconMasters]

Si claro, sin problemas

[@julialocamuz28]

excelente.

[@OmarMendozaKS]

Cual es la fuente de letra que usas en VSC?, se lee perfecto

[@FalconMasters]

Utilizo estas: kzbin.info/www/bejne/hZibe6OFndVrirM

[@tiagoae]

crack!!

[@camilarojasserantoni3241]

una duda, se puede integrar formik a react - bootstrap? para que visualmente quede agradable ? ahahaha (se que pusiste tus estilos pero con bootstrapn te facilita mucho el trabajo) saludos desde chile

[@FalconMasters]

Hola Camila, nunca lo he hecho pero seguro que se puede. React bootstrap solo aporta componentes, mientras que formik agrega la funcionalidad. No veo porque no se podrían juntar ambos.

[@angeljesuszorrillacuevas7654]

A mi no me borra el formulario con el resetForm, pq?

[@universodragonball9696]

yo los formularios los trabajo de esta manera: const [formData, setFormData] = useState(initialFormValue()); function initialFormValue() { return { nombre: "", precio: "" } } para la función que permite cambiar los valores: const onChange = e => { setFormData({ ...formData, [e.target.name]: e.target.value }); }; y el onChange lo mando llamar dentro del form en lugar de llamarlo en cada input

[@moisesvargasichpas4805]

Que fuente utilizas master?

[@FalconMasters]

Utilizo estas: kzbin.info/www/bejne/hZibe6OFndVrirM

[@alexisantoniojimenezjoaqui6776]

tienes cursocompleto de react??? actualizado

[@FalconMasters]

Si, este es mi curso de React: www.udemy.com/course/react-desde-cero/?couponCode=43CAFEF7CAA1BAB844D8 Esta completo y actualizado.

[@jcruz30]

podrías hacer tutorial uno para aprender implementar pasarelas de pago?

[@aVirusX]

Hola FalconMaster, tengo una súper duda y quiero que me ayudes!, bueno es que quiero implementar en mi página web en el title mi marca pero cuando salga en el buscador, ejemplo: Campamentos libres - Mimarca, que salga en el buscador pero cuando entren a la web vean en el código no salga "´- Mimarca", no sé si me doy a entender, sé que lleva un código en el title para que aparezca Mimarca en el buscador pero no en el código Saludos!! y abrazos!!

[@FalconMasters]

Hola Danny, eso tiene que ver con SEO, yo no conozco mucho del tema asi que no podria decirte si hay alguna forma de hacerlo. Pero según entiendo el title de tu sitio tal como lo tienes en el código es como lo toma Google.

[@nicotomomate]

Debes usar Javascript para eso, document.title = variabledejacascript; saludos

[@thedyslexicwebdev1654]

31:18 48:00 SELECT countries

[@mariacandelareynoso1337]

Epic!

[@kevinat71]

que opinas de React Hook Form?

[@Riczerq]

Yo lo considero mucho más robusto que Formik.

[@paquilloel]

ya no aparece el código en Github...

[@FalconMasters]

Aquí lo tienes: github.com/falconmasters/formularios-react-formik

[@virocumi]

Estoy frenado con este error: Error: Objects are not valid as a React child (found: object with keys {nombre, correo}). If you meant to render a collection of children, use an array instead. Ayuda!!!!

[@pablos.r1305]

El código tira este error en la parte de las validaciones: En esta línea: errores.nombre = 'Por favor ingresa un nombre' Dice "La propiedad 'nombre' no existe en el tipo '{}'.ts(2339)" Alguien sabe cómo solucionarlo ?

[@FalconMasters]

Hola Pablo, revisa bien el código, lo mas seguro es que tengas algo mal.

[@Manelike2000]

Mi estimado, si adquiero tu curso, puedo terminarlo a mi ritmo o hay un plazo de semanas por cada sesión?? Quiero tomar tu curso de desarrollo web en Udemy para superarme en el mundo de la programación

[@FalconMasters]

Si, puedes seguir el curso a tu ritmo, una vez que lo adquieres es tuyo y se queda en tu cuenta de Udemy para siempre

[@andresleyton8517]

Estoy frenado con la conección de la API quien me puede ayudar

[@pablomartinez6184]

Instalé email js y formik me envía formularios vacíos en caso de que el usuario lo decida :(

[@FalconMasters]

Hola Pablo, lo único que podría decirte es que seguramente algo este mal en el código.

[@zeroes5237]

mare, yo tarde casi 10 minutos en instalar react TS y copiar el código base -.-

[@josearmandozeballosduran7086]

Amazing

[@mrgatsby039]

Amigos alguien podría orientarme, como haría para direccionar hacia la pagina principal de mi aplicación web después de que el usuario se loguee?

[@FalconMasters]

Hola Leonardo, eso depende mucho de que lenguaje estés utilizando y si es del lado del cliente o del servidor.

[@mrgatsby039]

@@FalconMasters Si claro entiendo estoy usando node js y socket io del lado del servidor y Reactjs con peerjs, socket io-client en el frontend para modelar una app de video llamadas ya tengo mi app lista, pero mi problemática radica en como adicionarle un formulario de registro y de inicio de sesión a dicha aplicación web ya que no sabria como enrutarlos, y que luego de que el usuario pueda registrarse sea direccionado hacia la pagina principal de la app. Si alguien pudieras orientarme o ayudarme te lo agradecería una y mil veces. Saludos y por cierto muchas gracias por compartir tus conocimientos tu canal vale oro, mereces un millón de suscriptores.

[@douglaszuniga2773]

@@mrgatsby039 lograste solucionarlo?

[@mrgatsby039]

@@douglaszuniga2773 si bro gracias

[@saksahgx4011]

LIKE :D

[@santiagousca]

pense que las validaciones lo hacia formik

[@ronpb3943]

X2 para eso estaba viendo que tal con la libreria, pero aun asi no está mal, esta buena para usarla en combinacion con yup y bootstrap

[@FitzgeraldSilva]

50 minutos para eso estoy en el minuto 30 ya me desanime de formik no tienes metodologia

[@ji3291]

53 minutos'?? next!

[@FalconMasters]

Suerte encontrando uno mejor explicado

[@Deus-lo-Vuilt]

Gracias por el video