@@CarlosAzaustre desde que tus videos me salian como respuesta a mis dudas, ví y supe que enseñas con pasión, porque te apasiona lo que enseñas. Felicidades.
React es exactamente lo mismo, no hay nada diferente. Con todo respeto, pero aprende bien JavaScript para luego aprende algún otro framework, ya que estas preguntas no se deberían hacer si es que aprendiste bien JavaScript
@@JohnKTB obviamente es lo mismo en cuanto a pasos, obtener datos y pintarlos, todas las API funcionan así, no se que tiene que ver saber JS con saber React, así seas el dios del JS no vas a saber usar React por defecto.
Carlos, no te imaginas lo importante que es este video para mí, como desarrollador Front-End era el siguiente paso que tenía que dar...y lo lograre gracias a ti. En serio te lo agradezco.
¡Gracias, gracias, gracias, gracias! No sabes el impacto que generas en mi al explicar tan sencillo. Gracias por compartir conocimiento Carlos. Abrazo de un mexicano. PD. Saluda a un nuevo seguidor!
Excelente video, muchas gracias, no sé si yo estoy tonto pero me marcaba error en la línea para llamar la constante; aquí dejo otra forma de escribirlo por si a alguien más le pasa xhr.open("GET", api + 'perros');
Acabo de consumir un API usando Javascript en produccion por primera vez. Solo me tomo mas de 8 horas para hacerlo bien jajaja pero tu video me ayudo bastante, de hecho hasta compre una de tus camisas, me subscribi y te di un like. Muchas gracias por tus videos sigue adelante. Bendiciones
Genial me ayudaste bastante, sería genial lo de react y consumir con vue una API, al igual de como guardar los datos en una variable para usar dentro de otra funcion. Muchas gracias.
Buenas Carlos! Muy buen vídeo! No soy programador ni nada, sé html y lo básico de css y js. Estaría genial que compartieras el código js de tu documento. Quiero mostrar en una página web las reseñas de clientes a través de la API del programa que recoge las reviews y ando un poco perdido. Gracias!
Gracias Carlos excelente video, esperando al de APIs en React!!!! Si pudieses hacer uno con ejemplos practicos de APis que incluya Async/await seria brutal!
6:31 Hubiera estado MUY BIEN que dijera que esos no eran comillas simples; sino: "backticks" o acentos graves. Ya decía yo que porqué no funcionaba xD En este momento (8:54), en ese "user" que está antes del método .map: todavía no está rodeado ni de paréntesis ni de llaves, nada; y luego en este momento (9:08), ya aparece rodeado de... lo que, después de tantos intentos y revisiones a la documentación, descubriría que son unos malditos paréntesis: ese "user" es un parámetro: toda esa línea, descrita de izquierda a derecha es: Una constante llamada "tpl" > uso de un método integrado en JavaScript llamada ".map" (que pone los valores retornados en un array sin modificar el array original) > el método ".map" tiene 3 parámetros, pero en este vídeo solo se usa 1 parámetro: la función de callback; como es una FUNCIÓN (anónima): ese "user" rodeado entre paréntesis es UN MALDITO PARÁMETRO. Dios, me he tardado HORAS en comprender el porqué no funcionaba. Ese paréntesis rojo a mí me parecía unas llaves, entonces, rodeaba ese "user" con llaves, no con paréntesis. Como recomendación para los próximos vídeos: estaría bueno que explique (después de terminar su código) lo que hace cada parte de su código de manera mucho más específica.
Gracias Carlos, me encanta tu contenido. Me ha ayudado mucho en el bootcamp que estoy haciendo. Podrías hacer un video relacionado con firebase :) saludos desde colombia :D
Enhorabuena Carlos y gracias!!! Una duda que me surge con lo de consumir una api. Imaginemos que tengo un frontend, proyecto hecho en html con javascript o react js o angular...entiendo que son proyectos separados no??? es decir, por un lado lo mejor es tener un proyecto con el frontend y luego otro proyecto con la configuración de la api: routes, models, app.js...etc...etc no? eso es correcto? Entiendo que sí para desacoplar cada capa y que por ejemplo si hay algún problema en la parte de backend: API, tocar solamente esa parte. No tendría sentido juntarlo todo en 1 solo proyecto, es decir, tener el index.html y dentro del mismo proyecto las rutas, los modelos...etc...etc. ¿Qué opinas que es mejor? Soy un novato. Gracias!
Excelente video, me ayudó mucho! me gustaría poder hacer por ejemplo que cada elemento devuelto por la api se cliqueable, y luego generar otra pagina con mas datos de ese elemento específicamente, como deberia hacer? 😆
Muchas gracias, muy bien explicado, una pregunta que pasa si quiero limitar el numero de datos para traer, es decir solo quiero mostrar 20 registros en la tabla.
Muchas gracias por tus amplias y excelentes explicaciones, con el tema de las API´s me he encontrado con la aturizacion hawk? he intentado realizar la autenticacion para poder consumir la API pero no he tenido exito, en postman si sirve la API pero ya en Javascript no me funcionnan los codigos que he intentado, podrias hacer un video con ejemplos de autenticacion? Nuevamente gracias por compartir conocimiento y espero me pueda apoyar
Buenas Carlos, me ha gustado mucho como lo explicabas, el caso es que me hubiera gustado que usaras una api key y ademas que mostraras como se puede esa api key para que no la puedan ver inspeccionando el codigo. Mas que nada porque llevo tiempo intentando hacer eso y no consigo encontrar informacion que explique bien como hacerlo.
GRACIAS! Muy buen aporte! Como siempre bien explicado! aprendo un monton con cada video, a la espera de Apis en React!!!! Como duda personal me gustaria un video aplicando estilos de forma asincrona ,despues del renderizado del DOM con la api ya cargada, ya que se me hace complejo mezclar la asincronia con el fetch , acabo en un mar d errores y undefineds XDDD!
Supongo que si le pones type="module" puedes poner la etiqueta en el header y dejas el body mas limpio, ya que se ejecuta cuando se termina de cargar en el HTML.
Carlos que buen video, un detalle, como le quitariamos las comas a la peticion del objeto xhr, quiero decir, cuando pintamos la data en el HTML se generan unas comas al final de cada elemento, como se le removeria esa coma?
Buenas, muy tarde pero podes hacer un join("") para convertir a string, ya que esas comas aparecen porque es una array. Seria algo asi: const template = data.map(user => `${user.name}, ${user.email}`); const templateToString = template.join('');
Está muy bien la explicación, pero mi caso es algo diferente porque necesito leer la información de un API que está protegido por CORS, así que la respuesta que obtengo con el fetch es un error de cross-domain. Cómo puedo hacer una consulta API con puro javascript cuando el servidor remoto me limita por cruce de d ominios?
Excekente video, pero tengo una consulta, con los dos primeros métodos me sale una coma (,) que no se como sacar, y en rl ultimo no sale. Como saco esa coma?
Hola, 🖐️ Una consulta, si tengo un listado de registros (tabla) en mi página web, cómo puedo hacer para que se muestre de forma automática un registro que se acaba de insertar a la base de datos, pero sin refrescar la página...?? 🤔🤔 Saludos
la api ahi es http, para un https que puedo poner ya que manda un error de access to script from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, https, ipns, chrome-untrusted, ipfs, data, chrome, chrome-extension.
porque el codigo me da problemas al reconocer el signo pesos "$" ???, si lo uso para agregar la url antes del /users , me tira el error de /$%7BAPI_URL%7D/user, pero si dejo entera la URL en ese parámetro ya encuentra la API.
Amigo necesito saber que es una apa y como se consumen eh visto varios videos ejercicios en paginas y eh buscadl en google pero todavía no tengo bien definido que es y como funciona el consumo de apis que me recomiendas hay?
¿Quieres ver como se hace con React? entonces tienes que ver este vídeo ruclips.net/video/6u1RHUoXIPI/видео.htmlsi=3w5yMrykl4HPuGNe
siento que tus videos son como un curso de Udemy están muy completos, es excelente ver que alguien comparta tanta info de Javascript de forma gratuita
Muchas gracias Matías! Es un lujo saber que el contenido que comparto te sirva :)
@@CarlosAzaustre desde que tus videos me salian como respuesta a mis dudas, ví y supe que enseñas con pasión, porque te apasiona lo que enseñas. Felicidades.
Mis felicitaciones Carlos, eres una persona muy buena en lo que haces y permites que las personas obtengan conocimiento de alta calidad.
Estaría genial ver como lo haces con React, Gracias por el contenido!
React es exactamente lo mismo, no hay nada diferente. Con todo respeto, pero aprende bien JavaScript para luego aprende algún otro framework, ya que estas preguntas no se deberían hacer si es que aprendiste bien JavaScript
@@JohnKTB Gracias por tu aporte, muy constructivo
@@JohnKTB jajaja cálmense sabelo todo
@@JohnKTB obviamente es lo mismo en cuanto a pasos, obtener datos y pintarlos, todas las API funcionan así, no se que tiene que ver saber JS con saber React, así seas el dios del JS no vas a saber usar React por defecto.
@@pixeldvx Nadie habla de saber usar react, sino de cómo se consume una api lo cual es lo mismo que en js.
Carlos, no te imaginas lo importante que es este video para mí, como desarrollador Front-End era el siguiente paso que tenía que dar...y lo lograre gracias a ti. En serio te lo agradezco.
Mil gracias a ti! Me alegra saber que el contenido es útil :)
Loco sos mi héroe, lo explicas mejor que en cualquier lado. Muchas gracias.
Excelente vídeo Carlos, no esperaba menos, ojalá próximamente vídeos consumiendo API's gratuitas :) Gracias por todo
fetch a partir de los 10 min. gracias Carlos. vi el tema hace poco y todavia lo estoy estudiando.
Vale bro, necesitaba entender como consumir apis para terminar un proyecto que debo mostrar el Lunes a mi profesor, me salvaste.
Me alegro que te haya servido :)
En agradecimiento solo dejo pasar la publicidad y entro a ella, agradecido contigo
Grande Carlos... Ahora me doy mas idea.... Genial muchas gracias 👏
Gracias por el contenido Carlos, me refrescaste la memoria sobre cómo implementar ajax antes de la llegada de fetch
Excelente @CarlosAzaustre te tomo la palabra un video de como consumir una Api desde ReactJs
Increíble...mega interesante, nuevamente la sacas del parque.
Inmensamente agradecido Carlos.
Muy educativo, gracias. Excelente material
El video y como lo explicas esta fantastico, me encantó.
Falto él fetch con async await y ya quedaría perfecto video 🙈, Muchas Graciias !
La segunda parte del video usa esa API.
Excelente video, justo lo que necesitaba. Gracias Carlos. Me encanta tu contenido.
¡Gracias, gracias, gracias, gracias! No sabes el impacto que generas en mi al explicar tan sencillo. Gracias por compartir conocimiento Carlos. Abrazo de un mexicano. PD. Saluda a un nuevo seguidor!
Gracias a ti Rob! Me alegra saber que te ha servido el vídeo :)
Excelente video, muchas gracias, no sé si yo estoy tonto pero me marcaba error en la línea para llamar la constante; aquí dejo otra forma de escribirlo por si a alguien más le pasa
xhr.open("GET", api + 'perros');
Muchas gracias Carlos...curso terminado
Genio Sebastián!! Espero que te hay servido!!
Le entendí muy bien a como explicas.
Muchisimas gracias! :) Me alegra que te sirviera mi explicación :)
Excelente contenido!! Gracias por el aporte Carlos!
Q bien el enfoq desde vanilla js ...pintando-apis...ingeniosa e atinada frase
Jejej y mejor comunidad 👉 carlosazaustre.es/discord
Acabo de consumir un API usando Javascript en produccion por primera vez. Solo me tomo mas de 8 horas para hacerlo bien jajaja pero tu video me ayudo bastante, de hecho hasta compre una de tus camisas, me subscribi y te di un like. Muchas gracias por tus videos sigue adelante. Bendiciones
Que grande Byron! Muchas gracias!!
Muy bien explicado Carlos te felicito, si me gustaria ver el video con react
Ya lo tienes! 😀
Cómo Consumir APIs en REACT como un PROFESIONAL
ruclips.net/video/6u1RHUoXIPI/видео.html
Genial me ayudaste bastante, sería genial lo de react y consumir con vue una API, al igual de como guardar los datos en una variable para usar dentro de otra funcion.
Muchas gracias.
Pedazo de video, seria genial verlo con react, saludos desde chile
Claro que si, un video consumiendo una api con react
A la orden :)
Excelente video Carlos. Gracias.
Buenas Carlos! Muy buen vídeo! No soy programador ni nada, sé html y lo básico de css y js. Estaría genial que compartieras el código js de tu documento. Quiero mostrar en una página web las reseñas de clientes a través de la API del programa que recoge las reviews y ando un poco perdido.
Gracias!
Gracias, me sirvio mucho ya que estoy aprendiendo fetch. Me gustaria aprender tambien como hacerlo en react.
Muchas gracias, al ppio no me funciono, pero le borre la const = tpl, y el enlace lo puse en fectch y ahi funciono.
Saludos !
Muy buen canal carlos muchas gracias por todo
Mil gracias por crear y compartir!
Oye muchas gracias, me sirvió para realizar un test para una vacante. Saludos
Que bueno!! Me alegro mucho
justo lo que necesitaba y recién salido del horno jaja
Excelente video, muy bien explicado, me gustaria que hicieras el video para react, Saludos
minuto 0:01 y le doy like porque sé que explica todo muy bien
Suscríbete aquí: ruclips.net/user/carlosazaustre
Y Sígueme tambien en:
▶ instagram.com/carlosazaustre
▶ twitter.com/carlosazaustre
▶ twitch.tv/carlosazaustre
Bien explicado, si es una buena idea que hagas el ejemplo, de como consumir el API con React, para ver las diferencias con JS puro. Gracias
Gracias Carlos excelente video, esperando al de APIs en React!!!!
Si pudieses hacer uno con ejemplos practicos de APis que incluya Async/await seria brutal!
Podemos mezclar ambas :)
Están muy buenos tus vídeos hombre, sería genial el ver cómo lo haces con react.
Gracias por el video, excelente.
Gracias por el excelente video!
6:31
Hubiera estado MUY BIEN que dijera que esos no eran comillas simples; sino: "backticks" o acentos graves. Ya decía yo que porqué no funcionaba xD
En este momento (8:54), en ese "user" que está antes del método .map: todavía no está rodeado ni de paréntesis ni de llaves, nada; y luego en este momento (9:08), ya aparece rodeado de... lo que, después de tantos intentos y revisiones a la documentación, descubriría que son unos malditos paréntesis: ese "user" es un parámetro: toda esa línea, descrita de izquierda a derecha es:
Una constante llamada "tpl" > uso de un método integrado en JavaScript llamada ".map" (que pone los valores retornados en un array sin modificar el array original) > el método ".map" tiene 3 parámetros, pero en este vídeo solo se usa 1 parámetro: la función de callback; como es una FUNCIÓN (anónima): ese "user" rodeado entre paréntesis es UN MALDITO PARÁMETRO.
Dios, me he tardado HORAS en comprender el porqué no funcionaba. Ese paréntesis rojo a mí me parecía unas llaves, entonces, rodeaba ese "user" con llaves, no con paréntesis.
Como recomendación para los próximos vídeos: estaría bueno que explique (después de terminar su código) lo que hace cada parte de su código de manera mucho más específica.
Tomo nota Laniakeam siento que te haya confudido. Gracias por tu feedback.
Que barbaro me llegó ti tutorial :)
me ayudo mucho gracias
Muy buen vídeo! Estaría muy bien que lo hicieras desde React. Mil gracias por compartir tus conocimientos!!
Gracias a ti por pasarte por aquí. Lo apuntamos!
Ese triple igual es demasiado 🤣, buen video!
Muy buen video, como todos!!!!!
Hola, excelente información. Me gustaría un vídeo usando Axios, he oído mucho de esta librería y quiero conocerla. Saludos.
muy buen video!!!
Gracias Carlos, me encanta tu contenido. Me ha ayudado mucho en el bootcamp que estoy haciendo. Podrías hacer un video relacionado con firebase :) saludos desde colombia :D
Enhorabuena Carlos y gracias!!! Una duda que me surge con lo de consumir una api. Imaginemos que tengo un frontend, proyecto hecho en html con javascript o react js o angular...entiendo que son proyectos separados no??? es decir, por un lado lo mejor es tener un proyecto con el frontend y luego otro proyecto con la configuración de la api: routes, models, app.js...etc...etc no? eso es correcto? Entiendo que sí para desacoplar cada capa y que por ejemplo si hay algún problema en la parte de backend: API, tocar solamente esa parte.
No tendría sentido juntarlo todo en 1 solo proyecto, es decir, tener el index.html y dentro del mismo proyecto las rutas, los modelos...etc...etc. ¿Qué opinas que es mejor? Soy un novato. Gracias!
Gracias hermano
Me interesa ver como consumir una api desde react, si fuera tan amable de mostrarnos el camino inicial, se lo agradecería mucho
Estaria genial ver como lo haces con ReactJS, quizas podrias hacer un video de como consumir la API de GoogleMaps y de GooglePlaces y de Facebook :D
Excelente video, me ayudó mucho! me gustaría poder hacer por ejemplo que cada elemento devuelto por la api se cliqueable, y luego generar otra pagina con mas datos de ese elemento específicamente, como deberia hacer? 😆
Gran Explicación Brother ;)
crees que puedas subir contenido por la parte front, viue y drupal???
Excelente, saludos.
gracias craaaack !
Muchas gracias, muy bien explicado, una pregunta que pasa si quiero limitar el numero de datos para traer, es decir solo quiero mostrar 20 registros en la tabla.
Muchas gracias por tus amplias y excelentes explicaciones, con el tema de las API´s me he encontrado con la aturizacion hawk? he intentado realizar la autenticacion para poder consumir la API pero no he tenido exito, en postman si sirve la API pero ya en Javascript no me funcionnan los codigos que he intentado, podrias hacer un video con ejemplos de autenticacion?
Nuevamente gracias por compartir conocimiento y espero me pueda apoyar
Buenas Carlos, me ha gustado mucho como lo explicabas, el caso es que me hubiera gustado que usaras una api key y ademas que mostraras como se puede esa api key para que no la puedan ver inspeccionando el codigo. Mas que nada porque llevo tiempo intentando hacer eso y no consigo encontrar informacion que explique bien como hacerlo.
Gracias! Buen apunte ese, me lo apunto para hacer un video sobre ello :)
@@CarlosAzaustre por fin alguien intenta ayudarme
GRACIAS! Muy buen aporte! Como siempre bien explicado! aprendo un monton con cada video, a la espera de Apis en React!!!! Como duda personal me gustaria un video aplicando estilos de forma asincrona ,despues del renderizado del DOM con la api ya cargada, ya que se me hace complejo mezclar la asincronia con el fetch , acabo en un mar d errores y undefineds XDDD!
excelente!
Pintar APIs usando Reactjs... Me encanta
Muy interesante y práctico, falta con async await y con react ✌️👨🏻💻
exelente video :)
Gracias, excelente. Una pregunta si no requiero prensentar un lista sono obtener el valor de las variable para colocarlo en un control asp
Supongo que si le pones type="module" puedes poner la etiqueta en el header y dejas el body mas limpio, ya que se ejecuta cuando se termina de cargar en el HTML.
La costumbre
Hola excelente video, sera que puedas hacer videos mas explicativos sobre el manejo del DOM
Lo tendré en cuenta. Un buen ejemplo es hacer un todolist, pero en JavaScript puro :)
Gracias crack
Estaría super que también lo hagas con react
Geniales tus videos!! Cómo sería consumir una API con jwt ?
Muchisimas gracias!!!
Muchas gracias a ti Sandra, por tu apoyo! :)
Carlos que buen video, un detalle, como le quitariamos las comas a la peticion del objeto xhr, quiero decir, cuando pintamos la data en el HTML se generan unas comas al final de cada elemento, como se le removeria esa coma?
Buenas, muy tarde pero podes hacer un join("") para convertir a string, ya que esas comas aparecen porque es una array. Seria algo asi:
const template = data.map(user => `${user.name}, ${user.email}`);
const templateToString = template.join('');
excelente video, me podrias decir que extensiones usas para autocompletar código?
Genial.
excelente
Una consulta que configuraciones tenes en tu vscode?
hola claro que necistamos ver como es con react js a la espera brot
claro con react super brutal
Profe tienes algun curso donde se consuma api con token y tirarlo al datatable, gracias
Buen video pero de que manera sería mejor? consumir un Api mediante web(Javascript) o por parte de un lenguaje de servidor (java,php)
Muchas gracias Carlos. Sabes cómo consumir servicio soap con respuesta xml y definición por wsdl desde javascript? Muchas gracias por considerarlo!
Ufff creo que en mis tiempos de universidad usé algo de eso, pero mi cabeza lo borró xD
Está muy bien la explicación, pero mi caso es algo diferente porque necesito leer la información de un API que está protegido por CORS, así que la respuesta que obtengo con el fetch es un error de cross-domain.
Cómo puedo hacer una consulta API con puro javascript cuando el servidor remoto me limita por cruce de d
ominios?
Hola!! Tienes uno de estos cursos pero haciendo una petición post?
Excekente video, pero tengo una consulta, con los dos primeros métodos me sale una coma (,) que no se como sacar, y en rl ultimo no sale. Como saco esa coma?
carlos como estas ? tengo una inquietud como agregaste el icono del buzon ?
Hola, 🖐️
Una consulta, si tengo un listado de registros (tabla) en mi página web, cómo puedo hacer para que se muestre de forma automática un registro que se acaba de insertar a la base de datos, pero sin refrescar la página...?? 🤔🤔
Saludos
AMIGO MUCHAS GRACIAS!!! TENDRÍAS ESTE MISMO EJERCICIO PERO PARA UN POST?? ENVIO DE UN JSON HACIA UNA API CON METODO POST
No entendí nada, pero buen video.
edit: no es que no sepas explicar, es que aún no llego a estos temas en mis cursos.
la api ahi es http, para un https que puedo poner ya que manda un error de access to script from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, https, ipns, chrome-untrusted, ipfs, data, chrome, chrome-extension.
Se puede proteger el apikey desde el frontend al consumir una api que requiera uso de una apikey?
porque el codigo me da problemas al reconocer el signo pesos "$" ???, si lo uso para agregar la url antes del /users , me tira el error de /$%7BAPI_URL%7D/user, pero si dejo entera la URL en ese parámetro ya encuentra la API.
Si ya puedo hacer eventos en el DOM , conosco las promesas, async function , se hacer peticiones por fetch y axios, puedo meterme a aprender react?
COMO USAR API CON REACT
Amigo necesito saber que es una apa y como se consumen eh visto varios videos ejercicios en paginas y eh buscadl en google pero todavía no tengo bien definido que es y como funciona el consumo de apis que me recomiendas hay?