Fuaaa yo no le hago tanto al front pero cada vez q veo este tipo de videos entiendo todo re bien y me dan mas ganas de meterme en el mundo del front. Sigue así!!!
Creo que es primera vez que veo un video en el que explican el uso del aria... no se si generalmente nadie lo utiliza o no se le da la importancia que merece, gracias Midu
eres un dios, estoy seguro que gracias a ti, mucha gente podrá conseguir trabajo como programador, y estoy seguro de que si me esfuerzo, yo también. muchas gracias por toda tu ayuda, eres un grande.
Midu, un saludo desde Cuba 😊 muchas gracias x darnos este contenido tan rico educacionalmente, estoy empezando en este mundo del desarrollo web y me viene de maravilla, y estoy seguro que a mucha otra gente también, seria muy interesante un proyecto parecido a este, tipo TO DO LIST pero guardando en una base de datos, pues no veo material de ese tipo en youtube, eres un grande❤
el tema del test. Si yo lo hago manual, es decir, npm run dev... y agregar y borrar.. , tengo el mismo resultado. Veo si funciono o no. Lo vamos probando mientras vamos escribiendo el código. No tengo aun bien en claro, la funcionalidad del text, por lo menos en este caso.
no era mas sencillo como otra estrategia del input, hacer el onChange, un useState y listo? probablemente me perdi la explicación, porque este genio explica todo.
Me encanto el video, super bien explicado (como siempre), solo una duda me queda en el test, sin animo de ofender ni ser un pesado y dejando de lado el hecho de que es un ejemplo rapido, y es que al momento de eliminar el unico elemento de la lista y esperar encontrar el texto "No hay elementos en la lista.", esto es una buena practica? Me refiero a testear algo tan especifico en la interfaz, si se cambiase a "No hay elementos en la lista!" o cualquier minimo cambio haria fallar el test, con testear que la lista quede vacia no seria suficiente al estar la funcionalidad cumplida? Gracias desde ya, sos el 1 Miguel Duran Developer ❤
Hay diferentes estrategias a la hora de trabajar con textos y sus tests. Todos tienen cosas positivas y negativas. Desde un punto de vista purista, es normal que el test se rompa si la traducción cambia y no es suficiente con ver que no hay elementos, ya que la idea es simular cómo percibe el usuario la app. Pero como digo hay diferentes estrategias con pros y contras, que puedes estudiar aquí: testing-library.com/docs/example-react-intl/#translated-components-testing-stategy
@@xeroxe55 el comando de consola "cd" es para moverte a una carpeta, lo único que hizo con ese comando es moverse a la carpeta live-coding, que supongo que tendrá guardada para los códigos que escribe en vivo, luego en esa carpeta creó su proyecto
1:09:38 qué raro, hice debug y se agrega un solo hijo a la lista, pero me da error el test porque dice que regresó 3 hijos en lugar de 1... pero en el debug solo se ve 1 li... añadí otro input para añadir una etiqueta al item, vaya un tag simple de texto, y lo agregué en el test como input 2 y todo bien, solo esa parte que menciono me causó error.
Los caracteres en blanco cuentan como "childNodes". A mí me paso que delante y detrás de la expresión donde renderizaba la lista, es decir, detrás de la etiqueta de apertura de ul, y delante de la etiqueta de cierre, tenía un espacio. Si los borras se soluciona. Otra opción es usar "childElementCount", que parece contar solo los elementos "efectivos" y no todos los nodos.
Espera, lo de la funcion que llama a otra funcion no es lo mismo que crear la tipica funcion fuera donde el handleDelete recibe una (id) y dentro lo de siempre.. seteas el updated array y en el onclick solo haces esto {() => handleDelete(id)} y ya? lo que entiendo es que el solo esta sacando la llamada de la funcion "()=>" fuera, pero sin ningun beneficio, en mi opinion menos legible que el metodo clasico.
Qué locura es lo que es capaz de hacer este hombre, cada que explica algo flipo en colores
Jajaja me pasa lo mismo, cada vídeo que hace de este tipo es una clase magistral. Un crack
Haz flipao tio joder!
Fuaaa yo no le hago tanto al front pero cada vez q veo este tipo de videos entiendo todo re bien y me dan mas ganas de meterme en el mundo del front. Sigue así!!!
Creo que es primera vez que veo un video en el que explican el uso del aria... no se si generalmente nadie lo utiliza o no se le da la importancia que merece, gracias Midu
eres un dios, estoy seguro que gracias a ti, mucha gente podrá conseguir trabajo como programador, y estoy seguro de que si me esfuerzo, yo también. muchas gracias por toda tu ayuda, eres un grande.
Midu es demasiado humilde para todo lo que sabe, es el mejor
Midu, un saludo desde Cuba 😊 muchas gracias x darnos este contenido tan rico educacionalmente, estoy empezando en este mundo del desarrollo web y me viene de maravilla, y estoy seguro que a mucha otra gente también, seria muy interesante un proyecto parecido a este, tipo TO DO LIST pero guardando en una base de datos, pues no veo material de ese tipo en youtube, eres un grande❤
Saludos desde Cuba también desde Holguín, cómo vas? Yo llevo muy poco y me veo bien
@@saule.1595 llevo ya unos 6 meses y ahora en enero tengo una entrevista de trabajo, dale duro que es uno de los pocos trabajos que se paga bien aquí
Sos realmente una locura explicando
Midu, vuelve a hacer de esto !!! Grande crack
Midu, muchas gracias por tu contenido
el tema del test. Si yo lo hago manual, es decir, npm run dev... y agregar y borrar.. , tengo el mismo resultado. Veo si funciono o no. Lo vamos probando mientras vamos escribiendo el código. No tengo aun bien en claro, la funcionalidad del text, por lo menos en este caso.
Grande Midu!
Que genial no sabia de ese sitio
muy buena prueba, la voy a repetir yo solo
no era mas sencillo como otra estrategia del input, hacer el onChange, un useState y listo? probablemente me perdi la explicación, porque este genio explica todo.
Bro eres un tanke,1K de bendiciones!!!
increíble midu, me encantó todo la parte de los test, no pensaba que fuese tan fácil hacerlos.
Estaría genial pruebas técnicas de backend también.
Crack de Cracks el midu ✊, Excelente forma de enseñar parte de tus conocimientos. Mas videos Asi bro
Que fácil que explicas ❤
Excelente respuesta al porque si se deben hacer los TEST
Sería genial que subieran pruebas semanales porque necesito practicas :)
Si las entradas no se pueden repetir, el id podría ser el mismo texto del elemento, así el mismo id ya te dice que elemento es.
¡Excelente. Muchas gracias Midu!
Gracias a ti!
Gracias Midu por el contenido! Todo de 10 🙌 ahora a mover las manitas
Gracias por tantos aportes.
1:16 jajajaja epa midu que pasó? mucha mala influencia por parte de Goncy me parece 😂
Eres el mejor bro,
Que bueno eres, gracias.
Muy buen contenido!
Eres mi heroe❤ quiero ser como tu
Tengo una duda, por qué la función onSubmit no tiene un callback como sí lo tiene el onClick del botón eliminar?
"Qué opinas de una variable?" 🤣🤣🤣 excelente contenido Midu! 🤓
la terminal del principio como se puede descargar y configurar para que sea tan comodo?
hola señor midu, una pregunta ,¿ se puede usar codigo de ejemplo de proyectos que haya echo en un una entrevista?
midu deberias hacer una prueba tecnica para angular, asi es un poco mas real el poner junior :)
"Lo mejor seria empezar con un contexto y un reducer" jajajaj epico min 20:32
Genial!
ese midu jaja, me encanta cuando se expresa de algo que no le gusta
god midu!!!
Me encanto el video, super bien explicado (como siempre), solo una duda me queda en el test, sin animo de ofender ni ser un pesado y dejando de lado el hecho de que es un ejemplo rapido, y es que al momento de eliminar el unico elemento de la lista y esperar encontrar el texto "No hay elementos en la lista.", esto es una buena practica? Me refiero a testear algo tan especifico en la interfaz, si se cambiase a "No hay elementos en la lista!" o cualquier minimo cambio haria fallar el test, con testear que la lista quede vacia no seria suficiente al estar la funcionalidad cumplida? Gracias desde ya, sos el 1 Miguel Duran Developer ❤
Hay diferentes estrategias a la hora de trabajar con textos y sus tests. Todos tienen cosas positivas y negativas. Desde un punto de vista purista, es normal que el test se rompa si la traducción cambia y no es suficiente con ver que no hay elementos, ya que la idea es simular cómo percibe el usuario la app.
Pero como digo hay diferentes estrategias con pros y contras, que puedes estudiar aquí: testing-library.com/docs/example-react-intl/#translated-components-testing-stategy
@@midulive te kiero mucho midudev
¿Qué es eso que haces en la consola al inicio? eso de npm, cd live-coding y todo eso, ¿es necesario hacerlo siempre que vaya a iniciar un proyecto?
@@xeroxe55 el comando de consola "cd" es para moverte a una carpeta, lo único que hizo con ese comando es moverse a la carpeta live-coding, que supongo que tendrá guardada para los códigos que escribe en vivo, luego en esa carpeta creó su proyecto
Otro error de junior no usar los hooks apropiados de react y omitir el uso de estos como useCallback
1:09:38 qué raro, hice debug y se agrega un solo hijo a la lista, pero me da error el test porque dice que regresó 3 hijos en lugar de 1... pero en el debug solo se ve 1 li... añadí otro input para añadir una etiqueta al item, vaya un tag simple de texto, y lo agregué en el test como input 2 y todo bien, solo esa parte que menciono me causó error.
y añadí otro item y dice que son 4 en lugar de 2...
A mi me pasa lo mismo, asumo que devuelve todos los nodos hijos de la lista(ul), así que lo modifiqué por: list.querySelectorAll('li').length.
Los caracteres en blanco cuentan como "childNodes". A mí me paso que delante y detrás de la expresión donde renderizaba la lista, es decir, detrás de la etiqueta de apertura de ul, y delante de la etiqueta de cierre, tenía un espacio. Si los borras se soluciona. Otra opción es usar "childElementCount", que parece contar solo los elementos "efectivos" y no todos los nodos.
que extensión usas para los iconos?
Hola. Si no me equivoco es Material Icons
Que extensión usas para que te autocomplete en vscode ? Me sirve mucho
Github copilot (es de paga)
Git hub copilot, es de pago
es github copilot, si estas en la universidad github te lo regala por un año en el github students pack
No es una extensión, tenés que ir al json de configuración de vscode y activar el auto completado de javascript
T refieres a GitHub Copilot?
jajajaja 45:20 "A ver el codigo lo esta haciendo el de QA o tu, bueno pues aprende", algo que yo diria
Una prueba técnica no define un programador
@@eikerd pero si tú sueldo
Espera, lo de la funcion que llama a otra funcion no es lo mismo que crear la tipica funcion fuera donde el handleDelete recibe una (id) y dentro lo de siempre.. seteas el updated array y en el onclick solo haces esto {() => handleDelete(id)} y ya? lo que entiendo es que el solo esta sacando la llamada de la funcion "()=>" fuera, pero sin ningun beneficio, en mi opinion menos legible que el metodo clasico.
una prueba de estudio del orto jajajajajjaa
A cómo hablas de a rato, te estás juntando con argentinis jaja el orto jajaja
Prueba del orto....😂😂😂
Como que estudio del orto? jajajjaj
Morí de risa 🤣
ASJASJJASJASJASJASJAS un estudio del orto AJSASJAJAJj