No acostumbró a hacer comentarios por que sé que las personas que hacen estos vídeos explicativos tratan de hacerlo de la mejor manera que pueden, pero tu brother te pasas, eres un crack, un vídeo así con todo incluido es lo que tengo como dos meses de andar buscando y neta no pude ni pausar, ni tan siquiera ver a otro lado fue increíble, muchas gracias!! Sigue así, sigue ayudando a los simples mortales como yo en esto!. Gracias!.
para lo del minuto 44:50 , es correcto lo que dice la mayoria el e.path ya no es un estandar , mi solucion fue en el navegador Firefox Developer Edition y funciona perfectamente : if (e.target.innerHTML === 'done' || e.target.innerHTML === 'delete') { console.log(e.originalTarget.offsetParent.childNodes[1].innerHTML); }
Cuando estaba haciendo un juego, para mi fue muy difícil entender sobre como detectar el evento, pero con su video ya siento que es muy fácil detectarlo, muchas gracias
Realmente bueno.. ya llevo varios videos de este curso.. y francamente es bueno... por donde lo mires... es usted talentoso Ignacio, al menos en lo que respecta a hacer un curso en youtube... felicidades... y realmente agradecido... siga adelante...
Me encantó este video, muchas gracias, llevaba varios días tratando de entender como funciona el localStorage y como guardar las cosas y al fin pude. Gracias
Llevo un año aprendiendo mediante internet-free y tu, sin dudas eres el mejor. Si haces un tutorial de Typescript la pegarias del techo (: no desaparezcas
Ignacio, eres un montro!! Como dicen en mi país. Muchísimas gracias por este video, de crear una App de una Rutina del Gym. Ahora veré el nuevo video para aprender a hacerlo con Vue, así podré notar la enorme diferencia y seguir aprendiendo más y más del framework con tus enseñanzas. Haces ver que la programación es realmente sencilla, nuevamente gracias!!
Hola Ignacio, felicitaciones... excelente vídeo. Te hago un aporte: En el momento de eliminar un registro, que tan si en la etiqueta de icono agregas un atributo data con un indice por ejemplo edit y en tu función de eliminar obtiene el valor de la siguiente forma "e.target.dataset.id". Así te ahorra todo ese rollo de llegar hasta la etiqueta y me parece que tiene mas exactitud a la hora de eliminar o seleccionar el registro que se desea... Un saludo desde Colombia
Excelente tutorial Ignacio!, gracias me fue muy util este miniCRUD voy hacer mencion para los que esten siguiendo este cursito que el e.path del DOM no es un standard y no lo podran encontrar en Firefox en su lugar podran encontrar: composedPath y para solucionar la compatibilidad entre navegadores pues simplemente pueden anteponer con un if (e.path), y/o if(composedPath) y agregan la logica que quieran! SALUDOS!
Excelente vídeo, de verdad me quito el sombrero, si se encontrase mas contenido así en youtube sería mucho mas fácil dar los primeros pasos en el desarrollo web.
Hola a todos, creo que lo unico que hay que cuidar con querySelector son con las versiones de explradores que puedan visitar tu pagina, ya que pueden tener versiones viejas de javaScript y no va a funcionar en ellos. Saludos. Excelente profesor, estos milenials, por que son tan buenos en esto!!!
Felicitaciones Ignacio y muchas gracias por estos tutoriales, me han sido de gran ayuda. Me paso que al crear la aplicacion y probandola en firefox me daba error al llamar el "event.path", leyendo encontré que no es un estandar para los navegadores, y que se puede utilizar el metodo "event.composedPath()", y funciona exactamente igual con chrone y firefox. Nota: no probe con otros navegadores, si alguien lo intenta por favor comente como le va.
Buenas Tambien podes subir por la jerarquia de nodos hacia el div alert y bajar hasta la etiqueta , asi: let texto = e.target.parentNode.parentNode.childNodes[1].innerText; que es parte del standar DOM, asi que funciona en todos los navegadores.
Wow!, muchisimas gracias, me puse en una hora a ver y hacer la practica, no copiando sino pensando y pf, aprendí un montón, muchisisisisisisimas gracias :D!
Felicitaciones Ignacio muy buen video. Sabes podías haber utilizado la función TRIM() para cortar los espacios a los lados...pero bueno de la forma en que lo hiciste también funciona...!!!
lo mismo pensé cuando estaba viendo el video, con solo utilizar e.target.innerHTML.trim() te evitas tener que andar modificando el código dentro del literal
Si, tambien use el trim(), ya que las comillas literales las conoci en estos dias y estan buenisimas para poder visualizar la estructura del html, cuando juntas todo sin espacios (como hacia antes) era muy complicado leerlo posteriormente. Excelentes los tutoriales, me los estoy devorando! y aprendiendo mucho! mil gracias Ignacio!
Para no repetir todo el trozo de Html Mejor usar una variable para el color segun el estado for (elem of arrayActividades) { let tipoAlerta = "alert-danger"; if (elem.estado) { tipoAlerta = "alert-success"; } listatareas.innerHTML += ` accessibility ${elem.actividad} - ${elem.estado} done delete
Aprendí muchísimo!!! Una sugerencia! Hice esto para el innerHTML de cada actividad para ahorrarme el if else let customStatus item.estado === false ? customStatus = 'danger' : customStatus = 'success' Abrazo!!
He usado localstorage y es súper útil y creo que llegara a remplazar las coockies, esta genial el video hermano ,como advertencia si hacen un app para clientes que usan browser viejos usen coockies de preferencia ,porque no soportan él api de localstorage solos los browser modernos soporta la api
Como dices, no todos los navegadores lo soportan, por lo tanto, tambien puede fallar en muchos sistemas android. Una funcion sencilla para saber si localstorage esta soportado por el navegador es la siguiente if(typeof(Storage)!=="undefined"){ //Soporta localstorage }else{ //No soporta localstorage } o sea... si es distinto de UNDEFINED esta soportado ;-)
hola, muy buen video, me suscribi, TIPS: en el navegador firefox developer me costo encontrar el e.path, pero pero pero explorando me sirvio en console: e.originalTarget.parentElement.offsetParent.childNodes[ ].innerHtml, les dejo esa anotacion para que los que usen firefox en vez de chrome
Buen video, espero sigas subiendo este tipo de material donde hablas y practicas con javascript puro sin frameworks ni librerias, donde el trabajo se realiza con codigo puro y duro, asi es como realmente se aprende a programar, por otra parte hay un tema de los SPA con Ajax a ver si te das un tiempito sobre ello o para realizar el mecanismo de un eficiente y real preloader de una pagina web o de imagenes con Preload y Prefetch, en forma didactica como acostumbras, desde a gracias por todo.
el tema de la detección de la condición literal (e.target.innerHTML === done) eliminando los espacios en blanco también se podia solucionar usando una condicional menos estricta (== en lugar de ===)
saludos, antes que nada el video este super bueno gracias de verdad, queria decirle que la logica que usas en la app tienen un problema me explico: si ingresas 3 actividades con el mismo nombre CORRER por ejemplo si quiero eliminar la ultima actividad que ingrese la que se va a eliminar es la primara ya que cuando el recorra el arreglo en la primera posición del arreglo encontrara el nombre de la actividad y la eliminara pero no esta bien porque la que el tiene que eliminar es la tercera, eso pasa porque al hacer la comparacion en el arreglo comparamos los nombres de las actividades, lo correctos es que se comparen con un valor unico lo que en Base de datos se llama Primary Key
Solución: Agregar un campo 'id' a la estructura del array, 'id' contendrá un valor correlativo que también se almacenará en el atributo 'id' de cada uno de los elementos 'i', de esa forma se recupera el valor del atrributo 'id' del elemento 'i' y se localiza en el campo 'id' del array, tanto para eliminar como para editar. var lastIndex = 0; //correlativo global arrayActividades = [ { 'id': '0', 'actividad': 'correr', 'estado': 'eliminado'}, { 'id': '1', 'actividad': 'nadar', 'estado':' eliminado'} ]; done delete
Ufff que video tan bueno, aprendí demasiado, has que repasar mucho y también leer demasiado para que queden muchas cosas enn claro. una duda que tengo es: tambien se puede crear las actividades por medio de clases?
Muchas gracias por el video, tengo una duda. Cuando te metes en la consola para ubicar con el mouse el texto caminar en el inner HTML, yo entré al children y podia ver también la "b" y el inner HTML, ¿Cómo sabes o supiste que funcionaría utilizando childNodes?
Buenas, muchas gracias por el video, vengo con una consulta,. El boton de borrar, no me funciona en Firefox, por lo que vi la parte donde usamos "console.log(e)" no funciona igual en firefox, ya que cuando hago lo mismo, no me aparece "Path" en la lista. El error en consola dice: Uncaught TypeError: e.path is undefined file:///C:/Users/Katu/Desktop/Momocca-Coffee/estilos/index.js:125 EventListener.handleEvent* file:///C:/Users/Katu/Desktop/Momocca-Coffee/estilos/index.js:121
Hola Ignacio, cómo siempre excelente contenido. Pero creo que hay algo se tea ha pasado o no hemos llegado ahí. Las Promesas, creo que es un tema muy interesante, he visto en otros lugares, pero la verdad es que, tú eres único en explicar. Excelente cómo siempre.
Excelente tutorial, solamente que tengo un problema, al agregar una actividad en la lista de actividades en el document, se me agregan nuevamente pero sumado al numero de otras actividades, es decir que en el localstorage tengo 4 actividades ("correr, saltar, nadar, pesas"). Pero si agrego otra como ("descansar") se me agrega pero nuevamente se agregan las 4 anteriores, es decir en ves de tener 5 actividades tengo 9, este problema se arregla si recargo la pagina, como lo arreglo si no la recargo?
Gracias hermano, he aprendido más contigo que con los maestros de la escuela, oye en algún momento vas a hacer el CRUD con acceso a la base de datos mysql? me quedé esperandolo ya que en uno de tus videos me parece que lo mencionaste y busqué en todos tus videos y no lo encontré, gracias y ojalá puedas leer mi comentario, saludos y sigue así, eres un crack. El próximo mes me inscribo al premium de bootstrap, saludos
Hola Ignacio, tengo un problemilla. Trato de usar una imagen como btn para borrar (que hice yo) y no me funciona el momento en donde tengo que borrar el LocalStorage :S, ayudaaaa.
Hola amigo, muchas gracias por todo lo que enseñas. Oye una pregunta, a mi no me funciona poner el float-left mr-2 dentro de la etiqueta i al momento de alinear el equino con el texto, me podrias decir cual es la razon? muchas gracias.
Excelente vídeo, pude entender en profundidad el tema. Sólo que en mi proyecto no uso innerHtml y me falta la parte de pintar. Si alguien me puede ayudar le agradezco
Hola Ignacio, no logro interpretar este error que me bota consola app.js:37 Uncaught TypeError: arrayActividades.foreach is not a function at HTMLDocument.PintarDB (app.js:37) PintarDB @ app.js:37 Me ayudas? yo veo todo igual
tengo un problema en el minuto 40:33 verás yo no uso MATERIALIZE SINO FONT-AWSOME PERO CUANDO PINTO CUALQUIERA DE LOS ICONOS EN LA CONSOLA ME TRAE EL CORRE O NADAR PERO EL NOMBRE DEL ICONO LO TRAE VACIO COMO SI EL ICONO NO TIENE NOMBRE
SOS ignacio Necesito ayuda con este error, no logro descifrarlo: Uncaught TypeError: Cannot set property 'estado' of undefined at EditarDB (app.js:88) at HTMLDivElement. (app.js:116) Y otra cosa que me pasa, al eliminar siempre me borra la primera actividad, o sea si tengo actividad 1 = correr y actividad 2 = trotar al darle click en eliminar trotar, me borra correr y me desplaza trotar como actividad 1
el find index no me gusta por que hace el recorrido, cuando podemos poner tarjet a la alerta que tenga el index, cuando preciones la alerta, ya sabes que index es sin recorrerlo.
A Y U D A!! Tengo el siguiente error y no se elimina el contenido del id="listaActividades" que esta en el html ---> Uncaught TypeError: Cannot set property 'innerHTML' of null at HTMLDocument.PintarDB listaActividadesUI.innerHTML = ' '; { listaActividadesUI.innerHTML = ''; }
A que se debe estos errores: - Uncaught TypeError: Cannot read property 'addEventListener' of null - Uncaught TypeError: Cannot set property 'innerHTML' of null at HTMLDocument.PintarDB
Muy bueno el tutorial, me suscribo!!! Hay un pequeño bug, cuando se actualiza el navegador el arrayActividades vuelve a estar vacio y cuando seteamos el localStorage va colocar un array desde 0, alguien soluciono este pequeñoo bug?? Saludos!!!
Se podría crear una funcion que verifique despues que cargue la página algo asi: const verificarArray = () => { if (!localStorage.getItem('localTareas')) { listaTareas = []; } else { listaTareas = JSON.parse(localStorage.getItem('localTareas')); } return listaTareas; } Me respondo solo pero me funcionó
Errores en Navegadores Como Solucionarlo? En Firefox => e.path is undefined En Chrome => Cannot set property 'estado' of undefined at EditarDB (app.js:67) at HTMLDivElement. (app.js:94) EditarDB @ app.js:67 (anonymous) @ app.js:94
Para llegar a la actividad y al estado se puede recuperar con querySlector sobre el path[2] recuperaEstado = e.path[2].querySelector('span').innerHTML; recuperaValor = e.path[2].querySelector('b').innerHTML;
![LocalStorage [Conceptos y definiciones] ❤ JAVASCRIPT ❤](http://i.ytimg.com/vi/7hR7oTpDukc/mqdefault.jpg)
![❤ JAVASCRIPT: Event Delegation [Tutorial en Español]](/img/n.gif)
El mejor del mundo no hay ninguna duda.
No acostumbró a hacer comentarios por que sé que las personas que hacen estos vídeos explicativos tratan de hacerlo de la mejor manera que pueden, pero tu brother te pasas, eres un crack, un vídeo así con todo incluido es lo que tengo como dos meses de andar buscando y neta no pude ni pausar, ni tan siquiera ver a otro lado fue increíble, muchas gracias!! Sigue así, sigue ayudando a los simples mortales como yo en esto!. Gracias!.
para lo del minuto 44:50 , es correcto lo que dice la mayoria el e.path ya no es un estandar , mi solucion fue en el navegador Firefox Developer Edition y funciona perfectamente :
if (e.target.innerHTML === 'done' || e.target.innerHTML === 'delete') {
console.log(e.originalTarget.offsetParent.childNodes[1].innerHTML);
}
Me hice bola a mitad de video pero te agradezco por tu tiempo por hacer este tutorial. Ahora a estuadiarlo!
Cuando estaba haciendo un juego, para mi fue muy difícil entender sobre como detectar el evento, pero con su video ya siento que es muy fácil detectarlo, muchas gracias
Hice tu curso al pie de la letra y quiero que sepas que aprendi mucho, gracias.
Llevaba todo el dia buscando como hacer esto y la verdad eres un maestro chaval como explicas y lo facil que lo haces!!! Thanks infinitas!!!!
Realmente bueno.. ya llevo varios videos de este curso.. y francamente es bueno... por donde lo mires... es usted talentoso Ignacio, al menos en lo que respecta a hacer un curso en youtube... felicidades... y realmente agradecido... siga adelante...
Me encantó este video, muchas gracias, llevaba varios días tratando de entender como funciona el localStorage y como guardar las cosas y al fin pude. Gracias
Llevo un año aprendiendo mediante internet-free y tu, sin dudas eres el mejor. Si haces un tutorial de Typescript la pegarias del techo (: no desaparezcas
Ignacio, eres un montro!! Como dicen en mi país. Muchísimas gracias por este video, de crear una App de una Rutina del Gym. Ahora veré el nuevo video para aprender a hacerlo con Vue, así podré notar la enorme diferencia y seguir aprendiendo más y más del framework con tus enseñanzas. Haces ver que la programación es realmente sencilla, nuevamente gracias!!
He estado bucando muchos videos del C.RU.D pero el tuyo me explico muchas cosas que no entendia, gracias, sigue adelante
Excelente video. Me es muy útil. Gracias.
Hola Ignacio, felicitaciones... excelente vídeo. Te hago un aporte: En el momento de eliminar un registro, que tan si en la etiqueta de icono agregas un atributo data con un indice por ejemplo edit y en tu función de eliminar obtiene el valor de la siguiente forma "e.target.dataset.id". Así te ahorra todo ese rollo de llegar hasta la etiqueta y me parece que tiene mas exactitud a la hora de eliminar o seleccionar el registro que se desea... Un saludo desde Colombia
Si, yo tambien lo hice asi
Se puede ver como lo has resuelto? El codigo. Me genera duda como generas el id del item y para que no se repita. Gracias!
Excelente tutorial Ignacio!, gracias me fue muy util este miniCRUD voy hacer mencion para los que esten siguiendo este cursito que el e.path del DOM no es un standard y no lo podran encontrar en Firefox en su lugar podran encontrar: composedPath y para solucionar la compatibilidad entre navegadores pues simplemente pueden anteponer con un if (e.path), y/o if(composedPath) y agregan la logica que quieran! SALUDOS!
Señor le daría un besito en la frente por lo lindo que fue , muchas gracias buen hombre estaba súper atrapado en eso XD.
Miento sigo atrapado el composedPath no dice undefined ;( .
Un ayudadita.
Maravilloso ejercicio, infinitas gracias!
Clarísimo che, muchas gracias por el aporte !!
En vez de innerHtml deberías usar textContent para no tener problemas con las tabulaciones. Excelente video!!!
Excelente vídeo, de verdad me quito el sombrero, si se encontrase mas contenido así en youtube sería mucho mas fácil dar los primeros pasos en el desarrollo web.
Hola a todos, creo que lo unico que hay que cuidar con querySelector son con las versiones de explradores que puedan visitar tu pagina, ya que pueden tener versiones viejas de javaScript y no va a funcionar en ellos. Saludos. Excelente profesor, estos milenials, por que son tan buenos en esto!!!
Sos un genio, con todos tus cursos aprendi muchisimoo!!, muchas gracias por compartir todos tus conocimientos!
Gracias! Pronto más cursos para seguir aprendiendo 😋
Excelente @Bluuweb!, una excelente explicación, lo entendí a la perfección. Un gusto poder ver tus vídeos.
Felicitaciones Ignacio y muchas gracias por estos tutoriales, me han sido de gran ayuda.
Me paso que al crear la aplicacion y probandola en firefox me daba error al llamar el "event.path", leyendo encontré que no es un estandar para los navegadores, y que se puede utilizar el metodo "event.composedPath()", y funciona exactamente igual con chrone y firefox.
Nota: no probe con otros navegadores, si alguien lo intenta por favor comente como le va.
hola, cómo usaste el método "event.composedPath()" para obtener el valor del texto?
yo utilizo firefox
Buenas
Tambien podes subir por la jerarquia de nodos hacia el div alert y bajar hasta la etiqueta , asi:
let texto = e.target.parentNode.parentNode.childNodes[1].innerText;
que es parte del standar DOM, asi que funciona en todos los navegadores.
@@castroabregu muchas gracias estaba buscando justo algo así
Gracias Brother estuvo muy chevere la actividad
Muchas gracias David, mañana a las 14 directo de esto mismo jijiji saludos
Excelente video! Siento que te quiero! lo entendí todo al toque!
Wow!, muchisimas gracias, me puse en una hora a ver y hacer la practica, no copiando sino pensando y pf, aprendí un montón, muchisisisisisisimas gracias :D!
Excelente NachoBluu (Espero no te moleste)
Excelentes tus cursos.
Felicitaciones Ignacio muy buen video. Sabes podías haber utilizado la función TRIM() para cortar los espacios a los lados...pero bueno de la forma en que lo hiciste también funciona...!!!
lo mismo pensé cuando estaba viendo el video, con solo utilizar e.target.innerHTML.trim() te evitas tener que andar modificando el código dentro del literal
Verdad! me encanta que existan opciones más sencillas jijiji para la próxima la utilizaré! muchas gracias!!
Si, tambien use el trim(), ya que las comillas literales las conoci en estos dias y estan buenisimas para poder visualizar la estructura del html, cuando juntas todo sin espacios (como hacia antes) era muy complicado leerlo posteriormente.
Excelentes los tutoriales, me los estoy devorando! y aprendiendo mucho! mil gracias Ignacio!
Para no repetir todo el trozo de Html Mejor usar una variable para el color segun el estado
for (elem of arrayActividades) {
let tipoAlerta = "alert-danger";
if (elem.estado) {
tipoAlerta = "alert-success";
}
listatareas.innerHTML += `
accessibility ${elem.actividad} - ${elem.estado}
done
delete
`
}
Aprendí muchísimo!!! Una sugerencia! Hice esto para el innerHTML de cada actividad para ahorrarme el if else
let customStatus
item.estado === false ? customStatus = 'danger' : customStatus = 'success'
Abrazo!!
Muy bueno explicando y con un poco de humor... Gracias por todos los vídeos!!!!
no se como haces que se vea tan facil
excelente explicacion!! se las recomiendo
Que bien que explicas loco, ojala haya mas como vos
Uff tengo la cabeza como un bombo pero no tiene perdida. Muchas gracias genio. saludos desde la distancia.
Gracias campeón. Muy bueno bueno
Minuto 38:35, manzo escándalo, jajaja un genio Ignacio
He usado localstorage y es súper útil y creo que llegara a remplazar las coockies, esta genial el video hermano ,como advertencia si hacen un app para clientes que usan browser viejos usen coockies de preferencia ,porque no soportan él api de localstorage solos los browser modernos soporta la api
Muchas gracias por tus recomendaciones!! :) Saludos!!
Como dices, no todos los navegadores lo soportan, por lo tanto, tambien puede fallar en muchos sistemas android. Una funcion sencilla para saber si localstorage esta soportado por el navegador es la siguiente
if(typeof(Storage)!=="undefined"){
//Soporta localstorage
}else{
//No soporta localstorage
}
o sea... si es distinto de UNDEFINED esta soportado ;-)
@@hugoantoniosegura3447 correcto 👍
Gracias!! siempre se puede optimizar el código :)
hola, muy buen video, me suscribi, TIPS: en el navegador firefox developer me costo encontrar el e.path, pero pero pero explorando me sirvio en console: e.originalTarget.parentElement.offsetParent.childNodes[ ].innerHtml, les dejo esa anotacion para que los que usen firefox en vez de chrome
Buen video, espero sigas subiendo este tipo de material donde hablas y practicas con javascript puro sin frameworks ni librerias, donde el trabajo se realiza con codigo puro y duro, asi es como realmente se aprende a programar, por otra parte hay un tema de los SPA con Ajax a ver si te das un tiempito sobre ello o para realizar el mecanismo de un eficiente y real preloader de una pagina web o de imagenes con Preload y Prefetch, en forma didactica como acostumbras, desde a gracias por todo.
ya había visto varios vídeos sobre el mismo tema, ahora por fin lo entiendo, muchas gracias lo explicas muy bien.
el tema de la detección de la condición literal (e.target.innerHTML === done) eliminando los espacios en blanco también se podia solucionar usando una condicional menos estricta (== en lugar de ===)
saludos, antes que nada el video este super bueno gracias de verdad, queria decirle que la logica que usas en la app tienen un problema me explico: si ingresas 3 actividades con el mismo nombre CORRER por ejemplo si quiero eliminar la ultima actividad que ingrese la que se va a eliminar es la primara ya que cuando el recorra el arreglo en la primera posición del arreglo encontrara el nombre de la actividad y la eliminara pero no esta bien porque la que el tiene que eliminar es la tercera, eso pasa porque al hacer la comparacion en el arreglo comparamos los nombres de las actividades, lo correctos es que se comparen con un valor unico lo que en Base de datos se llama Primary Key
Solución: Agregar un campo 'id' a la estructura del array, 'id' contendrá un valor correlativo que también se almacenará en el atributo 'id' de cada uno de los elementos 'i', de esa forma se recupera el valor del atrributo 'id' del elemento 'i' y se localiza en el campo 'id' del array, tanto para eliminar como para editar.
var lastIndex = 0; //correlativo global
arrayActividades = [ { 'id': '0', 'actividad': 'correr', 'estado': 'eliminado'},
{ 'id': '1', 'actividad': 'nadar', 'estado':' eliminado'} ];
done
delete
@@eduardorivas6959 así es, es increíble que después de 2 anos alguien respalda gracias hermano
¡Excelente tutorial! ¡Muchas gracias!
Muy buen video, muy util
hola, tus videos me han sido muy útiles. Gracias.... Me gustaria que por fa hicieras uno explicando promise.
Hola, si tengo pendiente algunos videos de Javascript jijij pronto pronto jijij Saludos Diana!
Mira los videos anteriores, creo que ya videos sobre promise.
Excelente video para que funcione el DOMContentloaded hay que activarlo
Increible!
al momento de pintar la alerta le agrego un index, y al precionar obtengo ese index. y ya puedo hacer lo que sea.
Ufff que video tan bueno, aprendí demasiado, has que repasar mucho y también leer demasiado para que queden muchas cosas enn claro. una duda que tengo es: tambien se puede crear las actividades por medio de clases?
Muchas gracias por el video, tengo una duda. Cuando te metes en la consola para ubicar con el mouse el texto caminar en el inner HTML, yo entré al children y podia ver también la "b" y el inner HTML, ¿Cómo sabes o supiste que funcionaría utilizando childNodes?
Buenas, muchas gracias por el video, vengo con una consulta,. El boton de borrar, no me funciona en Firefox, por lo que vi la parte donde usamos "console.log(e)" no funciona igual en firefox, ya que cuando hago lo mismo, no me aparece "Path" en la lista. El error en consola dice:
Uncaught TypeError: e.path is undefined
file:///C:/Users/Katu/Desktop/Momocca-Coffee/estilos/index.js:125
EventListener.handleEvent* file:///C:/Users/Katu/Desktop/Momocca-Coffee/estilos/index.js:121
Muy bueno muchas gracias.
BRUTAL!!!! 😎😎😎
Gracias ma man
Muy buen video, tienes un nuevo suscriptor :)
Muy buen ejercicio!
Me encantó, muchas gracias
Excelente vídeo! muy bueno saludos
creo que es mejor pasarle un index a la alerta, y accedemos directo al objeto de array, para mostrar eliminar o hacer lo que se tenga que hacer.
Excelente BluuWeb 😎
Hola Ignacio, cómo siempre excelente contenido. Pero creo que hay algo se tea ha pasado o no hemos llegado ahí. Las Promesas, creo que es un tema muy interesante, he visto en otros lugares, pero la verdad es que, tú eres único en explicar. Excelente cómo siempre.
gracias! será el tema posiblemente para los próximos videos :) Saludos!!
@@bluuweb Cómo siempre, eres genial! Saludos.
buenisimos tus tutoriales!! gracias! :)
Excelente tutorial, solamente que tengo un problema, al agregar una actividad en la lista de actividades en el document, se me agregan nuevamente pero sumado al numero de otras actividades, es decir que en el localstorage tengo 4 actividades ("correr, saltar, nadar, pesas"). Pero si agrego otra como ("descansar") se me agrega pero nuevamente se agregan las 4 anteriores, es decir en ves de tener 5 actividades tengo 9, este problema se arregla si recargo la pagina, como lo arreglo si no la recargo?
Gracias hermano, he aprendido más contigo que con los maestros de la escuela, oye en algún momento vas a hacer el CRUD con acceso a la base de datos mysql? me quedé esperandolo ya que en uno de tus videos me parece que lo mencionaste y busqué en todos tus videos y no lo encontré, gracias y ojalá puedas leer mi comentario, saludos y sigue así, eres un crack. El próximo mes me inscribo al premium de bootstrap, saludos
no funciona en mozila firefox e no internet explore para excluir uo editar
hola como puede activar el MouseEvent ?
para que se mueste en consola..
Porque no me sale el cursor ni la bolita esa cuando paso el mouse a traves de la pantalla del responsive ?
Hola, cuál es el plugin que usas en Vs para que te autocomplete lo que escribís de js?
Gracias
se puede hacer el codigo de la bd pequeño para aprenderlo bn?
Hola, "path" no me aparece en la lista, alguna idea?
Hola Ignacio, tengo un problemilla. Trato de usar una imagen como btn para borrar (que hice yo) y no me funciona el momento en donde tengo que borrar el LocalStorage :S, ayudaaaa.
Excelente tutorial :) , sigue así .
Muchas gracias!! 🎉🎉🎉 saludos!!
Hola amigo, muchas gracias por todo lo que enseñas. Oye una pregunta, a mi no me funciona poner el float-left mr-2 dentro de la etiqueta i al momento de alinear el equino con el texto, me podrias decir cual es la razon? muchas gracias.
lograste solucionarlo?
Al refrescar la pag se sobre escribe el localstorage
Alguien sabe que tool usa para resaltar las palabras predeterminadas de js?
Excelente vídeo, pude entender en profundidad el tema. Sólo que en mi proyecto no uso innerHtml y me falta la parte de pintar. Si alguien me puede ayudar le agradezco
Hola Ignacio, no logro interpretar este error que me bota consola
app.js:37 Uncaught TypeError: arrayActividades.foreach is not a function
at HTMLDocument.PintarDB (app.js:37)
PintarDB @ app.js:37
Me ayudas? yo veo todo igual
forEach. utiliza la mayuscula
Tengo un problema al agregar y mostrar en pantalla el nombre de la actividad me sale undefined alguien sabra porque :C
el innerHTML no me funciona necesito ayudaaaa rapidoooo porfavor
Hola como podría tener los mismos colores en VB que los tuyos, me sería más facil para seguirte.
tengo un problema en el minuto 40:33 verás yo no uso MATERIALIZE SINO FONT-AWSOME PERO CUANDO PINTO CUALQUIERA DE LOS ICONOS EN LA CONSOLA ME TRAE EL CORRE O NADAR PERO EL NOMBRE DEL ICONO LO TRAE VACIO COMO SI EL ICONO NO TIENE NOMBRE
lo resolvi utilizano la funcion classlist[1] ya que font awesome trabaja con clases y no poseen nombre en si
ME EXPLOTAA LA CABEZA
Estimado segui el tutorial hasta la parte de listaactividades.innnerHTML = ' '; pero no se borra el input de l texto activida - Estado
!Ayeda¡
Me pasaaaaa
SOS ignacio
Necesito ayuda con este error, no logro descifrarlo:
Uncaught TypeError: Cannot set property 'estado' of undefined
at EditarDB (app.js:88)
at HTMLDivElement. (app.js:116)
Y otra cosa que me pasa, al eliminar siempre me borra la primera actividad, o sea si tengo actividad 1 = correr y actividad 2 = trotar al darle click en eliminar trotar, me borra correr y me desplaza trotar como actividad 1
A mi también me ocurre lo de 'estado' of undefined. De casualidad, ¿lograste corregir ese error?
@@michel_hdez yo tengo el problema de que al mostrar las actividades todos los nombres los tengo como undefined sabran el problema ?
el find index no me gusta por que hace el recorrido, cuando podemos poner tarjet a la alerta que tenga el index, cuando preciones la alerta, ya sabes que index es sin recorrerlo.
34:00 JAJAJAJAJA SOLO POR ESO ME SUSCRIBÍ JAJAJAA
Genial.
A Y U D A!! Tengo el siguiente error y no se elimina el contenido del id="listaActividades" que esta en el html ---> Uncaught TypeError: Cannot set property 'innerHTML' of null at HTMLDocument.PintarDB listaActividadesUI.innerHTML = ' '; {
listaActividadesUI.innerHTML = '';
}
tengo ese mismo error como pudiste resolverlo?
Aqui carrito.app se puede ver funcionando una lista de la compra bien completa usando localstorage.
vamo a borrar el localstorage jaja
Descarge el codigo y cuando lo ejecuto en Chrome android no funciona. sabes qu sucede?
Es mejor que lo vayas escriniendo, así vas a aprenderlo, si solo copias y pegas no entenderás nada
Todo me sale perfecto hasta cuando creo la función EditarDB();
No logro interpretar los errores
descarga los archivos en drive
Llegué hasta el minuto 57:00 de ahí en adelante ya no supe en qué me equivoqué porque no me respondía igual en el navegador.
Alta frustración jaja.
A que se debe estos errores:
- Uncaught TypeError: Cannot read property 'addEventListener' of null
- Uncaught TypeError: Cannot set property 'innerHTML' of null
at HTMLDocument.PintarDB
Muy bueno el tutorial, me suscribo!!!
Hay un pequeño bug, cuando se actualiza el navegador el arrayActividades vuelve a estar vacio y cuando seteamos el localStorage va colocar un array desde 0, alguien soluciono este pequeñoo bug?? Saludos!!!
Se podría crear una funcion que verifique despues que cargue la página algo asi:
const verificarArray = () => {
if (!localStorage.getItem('localTareas')) {
listaTareas = [];
} else {
listaTareas = JSON.parse(localStorage.getItem('localTareas'));
}
return listaTareas;
}
Me respondo solo pero me funcionó
Son muy buenos tus tutoriales, pero para mejorar te recomiendo que pongas comentarios en tu código :)
Muchas gracias!! // Trataré de hacerlo de ahora en adelante :)
Mi momento favorito es 50:00 - QUE HICE QUE HICE
Errores en Navegadores Como Solucionarlo?
En Firefox => e.path is undefined
En Chrome => Cannot set property 'estado' of undefined
at EditarDB (app.js:67)
at HTMLDivElement. (app.js:94)
EditarDB @ app.js:67
(anonymous) @ app.js:94
Requisito para este curso ?
Hola, saber lo básico de javascript, dom y objetos principalmente... todo está en el canal así que puedes revisarlo gratis :) Saludos!!
Para llegar a la actividad y al estado se puede recuperar con querySlector sobre el path[2]
recuperaEstado = e.path[2].querySelector('span').innerHTML;
recuperaValor = e.path[2].querySelector('b').innerHTML;
Todos dicen CRUD pero falta editar o update nadie lo hace en los videos.