Cómo consumir una API con React | Rick and Morty App

Поделиться
HTML-код
  • Опубликовано: 24 окт 2024

Комментарии • 63

  • @karinabelenescobar951
    @karinabelenescobar951 3 года назад +21

    Hola, solo pasaba a comentar que me fue muy útil el video, estoy reforzando cosas que ya se y este mini proyecto me vino genial para repasar. Gracias por compartirlo!

    • @MonkeyWit
      @MonkeyWit  3 года назад

      Me alegro de poder ayudar. Gracias por comentar!!

  • @kollycr
    @kollycr 3 месяца назад

    Que increible tu forma de enseñar, solo a usted le entendi como consumir Apis, un genio! Gracias por compartir estos videos

  • @r4nd0m-k2z
    @r4nd0m-k2z Год назад

    Buenas. Hay personas que tienen el don de la ensenanza, y usted es una de ellas mi amigo. Esta en cada detalle y por sobre todo con excelentes metodologias de practica. Felicidades, este video es un deleite.

  • @Andrea_Pinzon
    @Andrea_Pinzon 23 дня назад

    Me encanto el video, muchas gracias!

  • @camilogenoud9582
    @camilogenoud9582 11 месяцев назад

    Like y suscribo. Muy didactico!!! Gracias x tu aporte

  • @jaazielmartinez1107
    @jaazielmartinez1107 11 месяцев назад +1

    te amo bro, gracias!!

  • @javiermendoza1357
    @javiermendoza1357 Год назад

    Venia a algo basico y miré todo el proyecto, sinceramente es magistral. muchas gracias

  • @demavares
    @demavares 2 года назад +1

    Gran video me sirvió como base para mis proyectos. Tengo una duda cada API tiene su forma para ser consumida o cada API tiene una base que es constante??

  • @alvarezfeli
    @alvarezfeli 9 месяцев назад

    Gran video, muchas gracias.

  • @javiermendoza1357
    @javiermendoza1357 Год назад

    MAGIIISTRAAALLL sos grande amigo muchisimas gracias

  • @kentha1462
    @kentha1462 2 года назад +2

    Simplemente genial, gracias por el video !

  • @federicoaldana5952
    @federicoaldana5952 3 года назад +1

    Se puede usar la misma estructura de módulos para consumir apis diferentes? ya es a imaginación de uno si?

  • @cristianmunoz3373
    @cristianmunoz3373 3 года назад +3

    Puedes realizar la misma aplicación pero consumiendo con axios para notar sus diferencias, buen video saludos desde Ecuador

    • @MonkeyWit
      @MonkeyWit  3 года назад +2

      Hola, claro que si. Lo tendré en cuenta para un proximo video. Gracias por tu comentario. Abrazo!

    • @jhonestiwarrodriguezcorrea6663
      @jhonestiwarrodriguezcorrea6663 3 года назад

      Yo lo estaba haciendo a la par con axios pero llegué hasta la parte donde hace esto: .then((data) => {
      setCharacters(data.results)
      setInfo(data.info)
      })
      desde ahí no me funcionó la paginación con axios

    • @maximilianodelacruzb8445
      @maximilianodelacruzb8445 2 года назад +1

      @@jhonestiwarrodriguezcorrea6663 axios es la forma vieja de hacerlo, aunque se siga usando en mas practico usar fetch.

    • @luisfernandosierra5871
      @luisfernandosierra5871 2 года назад

      como se haria con axios y utilizando una api que contenga token?

  • @McLovin_JS
    @McLovin_JS 2 года назад +1

    si quisiera mostrar ademas del nombre y la ubicacion, el eipisodio (ojo, pero no mostrar la URL, mostrar el nombre correspondiente al episodio) como le harias?

  • @renatoalcedom.7467
    @renatoalcedom.7467 Год назад

    Excelente muy bien explicado, con este tipo de prácticas es dnde uno realmente aprende, gracias por el aporte

  • @dhario6383
    @dhario6383 Год назад

    Muchas gracias, eres muy genial.

  • @urielsolorzanojulio903
    @urielsolorzanojulio903 3 года назад +2

    hola excelente video. por que los componentes los colocas formato JS y no JSX ?

    • @gabrielquintero689
      @gabrielquintero689 Год назад

      eso es porque con create react app no es necesario usar jsx, caso contrario si usas vite si necesitaras usar jsx

  • @jufa5765
    @jufa5765 2 года назад

    Hola buenas tengo una consulta en el minuto 21:26 porque se coloca url en el pasaje de parametros del fetch y no el initialUrl gracias.

  • @johnherrera5913
    @johnherrera5913 2 года назад

    Master! Gracias Crack por compartir tus conocimientos, Que bien explicado

  • @m4nuel007
    @m4nuel007 2 года назад

    Hola, gracias por el contenido, estaría bueno un video de Bootstrap

  • @Luciano_ib
    @Luciano_ib 3 года назад +1

    Gracias por el video, muy bueno y bien explicado. Te dejo mi like y me suscribo.

  • @hortmanjoj
    @hortmanjoj 2 года назад

    Muchas gracias por compartir tus conocimientos !!!

  • @guidojuliano
    @guidojuliano 2 года назад

    Hola buenas noches te consulto como podría hacer lo de la paginación si yo consumo la API con axios y no con fetch, al momento de pasarle los parametros onNext y onPrevious no se como hacerlo.

  • @AroVS
    @AroVS 2 года назад

    Excelente video para poner en practica todo lo aprendido. Muchas gracias!

  • @MrLukiiTa
    @MrLukiiTa 2 года назад

    Hola, tengo una api que me da 10 personajes de stars wars.. como puedo hacer para que me renderice los personajes en 3 paginas? porque me muestra los 10 al comienzoo sea 4 personajes en la pagina 1, 4 en la pagina 2 y 2 en la pagina 3?

  • @ChusenOne
    @ChusenOne 2 года назад

    Que extension es la de los snippets?

  • @lucassoria6934
    @lucassoria6934 2 года назад

    Hola! genial video, me sirvio mucho, me gustaria aprender como hacer esto igual pero tambien agregarle un buscador, es posible no?

  • @johanramirez6309
    @johanramirez6309 3 года назад

    Lo acabo de terminar muy buen video me ayudo mucho en mi desarrollo
    Gracias amigo bien explicado

  • @Arcad345
    @Arcad345 2 года назад

    Hola! ¿Cómo podría solo renderizar los 20 primeros personajes filtrando por ID (del 1 al 20) ?

  • @juanda3396
    @juanda3396 3 года назад

    como no encontre este video antes, excelente video espero sigas subiendo mas cosas :D

  • @jhonatancastanocalero59
    @jhonatancastanocalero59 3 года назад

    Excelente, gracias por el video!

  • @pepinoperez5988
    @pepinoperez5988 3 года назад

    Muchas gracias explicas muy bn funciono todo ok 👌

  • @elgrego3849
    @elgrego3849 2 года назад

    Una pregunta, al momento de crear un componente estaba aconstumbrado a hacerlo con
    class Text extends Component, pero veo que tú lo haces const Personajes = ({ characters = [] })
    Hay algunas diferencia ? o donde podria investigar para empaparme del tema, un saludo, gracias

    • @MonkeyWit
      @MonkeyWit  2 года назад

      Hola gracias por comentar. Dentro de la playlist de React en el canal tengo un video sobre eso: ruclips.net/video/pbfRoqnuvRY/видео.html

  • @LuisacnyBaudin
    @LuisacnyBaudin Год назад

    cual puede ser la razón por la que la API no me trae la imagen ni se ve nada en pantalla?

  • @federicoaldana5952
    @federicoaldana5952 3 года назад

    la sintaxis no me sigue el patron, tienes alguna extencion o algo?

  • @antoniogalleguillos4269
    @antoniogalleguillos4269 3 года назад

    Muy bien explicado, muchas gracias! Suscrito!

  • @r.w.s.2402
    @r.w.s.2402 3 года назад

    Muy chula gracias!!

  • @Triplea_AFK503
    @Triplea_AFK503 Год назад

    Hola gracias por el video de donde eres bro

  • @franciscoagustincastro6994
    @franciscoagustincastro6994 3 года назад

    Hola buen día, tengo una pregunta, hice mi app y estoy buscando alguna forma de consumir los 671 personajes que tiene la.api, pero que no se encuentran en /characters, como podría hacerlo? Intente armando varios bucles y añadiendo las iteraciones de i al final del la ruta de la api pero por sentido común, los bucles no funcionan en archivos JSON, si alguno sabe me ayudaría un montón

  • @sergiomoyano3104
    @sergiomoyano3104 3 года назад

    Hola Monkey, que tengo que hacer para que me salgan las pestañas y los archivos resaltados con color como lo tienes tu? es una extension?
    Muy bueno el video merecido like y suscripcion!

    • @MonkeyWit
      @MonkeyWit  3 года назад

      Hola, gracias por comentar. En relacion al tema uso Dracula, es una extension. Y el status de los archivos modificados es la extension de Git que los resalta.

  • @carlosarreola275
    @carlosarreola275 Год назад

    Que hizo que se hiciera responsive?? bootstrap???

    • @MonkeyWit
      @MonkeyWit  Год назад +1

      Hola, sí aprovechando las classes de bootstrap se aplican estilos a nuestros componentes incluyendo responsividad a través de un Grid.

  • @federicoaldana5952
    @federicoaldana5952 3 года назад

    se podria hacer un buscador?

  • @simonmontenegro181
    @simonmontenegro181 Год назад

    Buen video

  • @lourdesfrontenddev7794
    @lourdesfrontenddev7794 3 года назад

    Muy bueno!!!

  • @mauroandressosa1342
    @mauroandressosa1342 2 года назад

    Muy bueno ! me suscribo :)

  • @mariacecilialuna5595
    @mariacecilialuna5595 2 года назад

    me salvaste!!!!!!!!!!!!

  •  Год назад

    Te amo

  • @KarlosCeja
    @KarlosCeja 2 года назад

    gracias :)

  • @jeffersondavila8658
    @jeffersondavila8658 Год назад

    Hola, primero que nada agradecer porque me ha sido muy útil el tutorial.
    Ahora, tengo una duda, al usar la página del ejemplo (la de rick and morty) me funciona perfecto, sin embargo estoy tratando de implementar el consumo del API a una página de mi trabajo hecha en wordpress, sin embargo al poner la url (xxxx/wp-json/wp/v2/profesor) el estate del hook me da como resultado "undefined", pero la página del ejemplo me funciona perfecto. Porque me pasa esto :c

  • @jhonestiwarrodriguezcorrea6663
    @jhonestiwarrodriguezcorrea6663 3 года назад +1

    Hola, excelente video!!
    Yo lo estaba haciendo con axios pero no me funcionó cuando llegaste a la paginación, ¿qué debería agregarle a esta parte sabiendo que el resto del codigo está como en el video?
    const loadCharacters = async(ulr) => {
    const res = await axios(initialUlr)
    setCharacters(res.data.results)
    setInfo(res.data.info)
    console.log(res.data.info)
    }
    Muchas gracias de antemano. ¡Desde ya suscrito y con la campanita activa!

    • @MonkeyWit
      @MonkeyWit  3 года назад +2

      Hola Jhon, gracias por comentar. El problema es que no estas usando el debido método http dentro de la instancia de axios. Es decir, deberias usar: axios.get(url)... Usa el método get

    • @jhonestiwarrodriguezcorrea6663
      @jhonestiwarrodriguezcorrea6663 3 года назад

      @@MonkeyWit Sigue sin funcionar, pero vale, voy a buscar que más puede ser, muchas gracias!!

    • @MonkeyWit
      @MonkeyWit  3 года назад +1

      @@jhonestiwarrodriguezcorrea6663 que extraño, yo probé aqui con axios y funcionó perfectamente. Actualicé el pryecto en github con axios. Puedes verlo aqui: github.com/monkeywit/Rick-and-Morty-App

    • @jhonestiwarrodriguezcorrea6663
      @jhonestiwarrodriguezcorrea6663 3 года назад

      @@MonkeyWit Perfecto, voy a ver en qué estoy fallando, muchas gracias.