Cómo hacer el deploy de una aplicación ReactJS en GitHub Pages

แชร์
ฝัง
  • เผยแพร่เมื่อ 23 ธ.ค. 2024

ความคิดเห็น • 36

  • @agussoria8150
    @agussoria8150 7 หลายเดือนก่อน +2

    Por fin alguien que tira la posta. Algo tan simple como pasar por alto el deploy en el terminal, hizo que estuviera horas buscando informacion para resolver el 404 de github pages

    • @LeonardoCastillo79
      @LeonardoCastillo79  7 หลายเดือนก่อน +1

      Que bien que ha sido útil el video!

  • @williamscamacaro6697
    @williamscamacaro6697 8 หลายเดือนก่อน

    Genial Muchas gracias capo , justo ayer subi mi primer trabajo de react y no encontraba como subirlo completo y el profe me paso este link .

    • @LeonardoCastillo79
      @LeonardoCastillo79  8 หลายเดือนก่อน +1

      Excelente! Que bueno que haya sido de utilidad el vídeo.

  • @orianagomez5013
    @orianagomez5013 5 หลายเดือนก่อน +1

    Gracias por la explicación, lo que necesitaba 🎉🎉

    • @LeonardoCastillo79
      @LeonardoCastillo79  5 หลายเดือนก่อน

      Que genial que haya sido de utilidad

  • @jeffrysantiagomontesdeoca4574
    @jeffrysantiagomontesdeoca4574 7 หลายเดือนก่อน +1

    Bendiciones, muchas gracias y excelente explicacion.

    • @LeonardoCastillo79
      @LeonardoCastillo79  7 หลายเดือนก่อน

      Muchas gracias a ti por las palabras.

  • @angelher9608
    @angelher9608 6 หลายเดือนก่อน +2

    excelente vídeo, me salió y publiqué mi proyecto pero el problema que tengo parece estar relacionado con la diferencia entre cómo se configuran las rutas para un proyecto local versus un proyecto desplegado en GitHub Pages. Cuando trabajo en mi proyecto localmente, puedo usar rutas relativas como /home, pero cuando despliego en GitHub Pages, no funciona, ¿que puedo hacer para arreglarlo?

    • @LeonardoCastillo79
      @LeonardoCastillo79  6 หลายเดือนก่อน

      Angel, tu ruta al iniciar / queda absoluta al dominio de github, en ese caso debes definir el homepage en el package.json, indicando la ruta que github pages generó de tu repositorio.

    • @angelher9608
      @angelher9608 6 หลายเดือนก่อน

      @@LeonardoCastillo79 sigue sin funcionar 🫣

  • @jorgearandapantoja3761
    @jorgearandapantoja3761 4 หลายเดือนก่อน +1

    Gracias, me ayudo!!

    • @LeonardoCastillo79
      @LeonardoCastillo79  4 หลายเดือนก่อน

      Que bueno. Me alegra mucho que haya sido de utilidad.

  • @ElTripaSeca100
    @ElTripaSeca100 8 หลายเดือนก่อน +1

    muy buena explicacion bro primer video que me jalo al 100

  • @ElGu4n
    @ElGu4n 7 หลายเดือนก่อน +1

    Hola, una duda, yo tengo en mi repositorio dos ramas, main, donde tengo un proyecto construido con HTML, CSS y JavaScript y otra rama donde construí el mismo proyecto (con algunos cambios) desde cero con React usando Vite. ¿Que debería hacer primero? Un merge o un deploy de la segunda rama para posteriormente hacer el merge?

    • @LeonardoCastillo79
      @LeonardoCastillo79  7 หลายเดือนก่อน +1

      En tu caso me parece que quieres publicar el proyecto hecho en react, si es así, debes hacer deploy es de la rama correspondiente, pero te sugiero separarlos en 2 repositorio, siendo que los desarrollos siendo del mismo proyecto son hechos de 2 formas totalmente distintas, en el sentido de la forma de disponer el código varia mucho de un proyecto HTML+CSS+JS de uno hecho en React

    • @ElGu4n
      @ElGu4n 7 หลายเดือนก่อน

      @@LeonardoCastillo79 Tienes toda la razon, ayer llegué a la misma conclusión y decidí nunca mas complicarme la vida teniendo dos ramas tan diferentes en un mismo repositorio. Muchas gracias por la respuesta y por el tutorial tan claro que hiciste!

  • @DavidVeraAlvarez
    @DavidVeraAlvarez 4 หลายเดือนก่อน +1

    Gracias, muy bueno el video, me funciona bien cuando react está en la raiz del repositorio... Pero tengo otro proyecto donde react se encuentra en una carpeta dentro de la raiz y ahi no logro hacerlo funcionar. ¿algun consejo?

    • @LeonardoCastillo79
      @LeonardoCastillo79  4 หลายเดือนก่อน

      Hola, que bueno el video ha sido de utilidad. Cuando tu aplicación está en una subcarpeta debes indicarlo en la propiedad home del archivo package.json. No es algo de gitpages, sino del deploy normal de react. Intenta colocar la ruta que gitpages te genera en esa propiedad home del package.json, que probablemente vas a tener que agregarla porque por defecto no esta declarada.

  • @Nodoubthost
    @Nodoubthost 6 หลายเดือนก่อน +1

    Muchas gracias por enseñar!!!!

    • @LeonardoCastillo79
      @LeonardoCastillo79  6 หลายเดือนก่อน +1

      Es un gusto contribuir con la comunidad

  • @osca0000
    @osca0000 29 วันที่ผ่านมา

    Hola, estimado. Excelente tu carisma para enseñar lo que sabes, y me gustaría saber cuál fue la ruta que utilizaste para las imágenes, ya que casi todo me funciona, pero la ruta parece que no está bien. He intentado con:
    src={${process.env.PUBLIC_URL}/img/${image}.jpg}
    src={/img/${image}.jpg}
    src={img/${image}.jpg}
    Aclaración: cuando hice el npm run build y lo subí a Netlify, funcionó; pero ahora que intento con GitHub, no he podido. Cualquier aporte es de provecho.

    • @LeonardoCastillo79
      @LeonardoCastillo79  28 วันที่ผ่านมา

      Hola. Gracias por las palabras. En el caso del ejemplo las imagenes vienes con ruta absoluta de la API. Si tienes imagenes locales mi recomendación es importarlas dentro del código de react, lo otro es colocarlo en la carpeta public, dentro crear img y allí llamarlo como lo indicaste el inicio
      src={${process.env.PUBLIC_URL}/img/${image}.jpg}
      Ojo que parece que tu recibes esos valores de image de algún servicio de datos, seria esa la forma, siempre que tentas PUBLIC_URL definida en tu .env

  • @marcospirchio6267
    @marcospirchio6267 22 วันที่ผ่านมา

    Hola leonardo como estas? muchas gracias por el video, parece muy simple aunque aun tengo problemas. Primero no tengo el archivo vite.config.js, nose si crearlo y copiarlo tal cual el tuyo. Siguiendo con el problema, mi aplicacion de react (no se mucho sobre react nose si fue la mejor practica) no tiene un index.html, en cambio utilizo un App.js, y al hacer el deploy, ejecuta una especia de index.html , de fondo blanco con el nombre del repo y la descripcion de el mismo, pero nada de lo que yo puedo visualizar al ejecutarlo localmente con el npm start. Que podria hacer para solucionarlo? Entiendo que si en el local lo puedo ejecutar, visualizar y funcionar bien, deberia poder hacer lo mismo en el github. De antemano muchas gracias por tu ayuda!

    • @LeonardoCastillo79
      @LeonardoCastillo79  22 วันที่ผ่านมา

      Hola Marcos, por lo que me indicas, tu creates la aplicación con create-react-app, el video está hecho para aplicaciones creadas con vite. Lo que puedes hacer para publicar tu app en gitpages es hacer en local tu build y subir lo que te genere dentro de la aplicación en otro repo de git. Recuerda que al hacer el build react te va a generar html + js que al final es posible subir a gitpages.

  • @EduardoLariosEspinoza
    @EduardoLariosEspinoza 8 หลายเดือนก่อน +1

    Muchas gracias.

  • @nicolasgutierrezcristranch4624
    @nicolasgutierrezcristranch4624 3 หลายเดือนก่อน +1

    gracias bro

  • @aguusgarcia777
    @aguusgarcia777 4 หลายเดือนก่อน +2

    Hola nose si seguis respondiendo, te hago una consulta, resulta que yo subi el proyecto lo mas bien por este video muchas gracias primero que nada !!! jkajaja resulta que esta en github pages pero quiero realizar cambios tambien en pages y solo se me actualiza el repo con un git add, commit y push
    como puedo hacer para actualizar el gh pages? tengo que hacer un nuevo deploy o algo asi? Muchas graciasss

    • @LeonardoCastillo79
      @LeonardoCastillo79  4 หลายเดือนก่อน

      Hola. En teoría deberia estarse actualizando cada vez que hagas un commit. Salvo que este generando algun error los WF de github. Cuando subas un commit revisa si al lado del commit tiene algun boton tipo X o rojo, eso significa que github no logró actualizar el deploy. Tendrias que ver que está causando el problema, pero lo esperado es que apenas hagas el commit en la rama publicada, deberia github actualizar lo publicado.

  • @abrahan844
    @abrahan844 6 หลายเดือนก่อน +1

    hola saludos, hice una prueba con tu tutorial y efectivamente si se subio pero la app no funciona es una app en react super sencilla es de clima y consume una api esta hecha en vite, no hace busquedas y no carga la imagen de fondo, lo mismo me pasa en netlify, sabes que podria ser, pienso q puede ser xq estoy usando un archivo .env, gracias de antemano

    • @LeonardoCastillo79
      @LeonardoCastillo79  6 หลายเดือนก่อน +1

      Hola Abrahan, es por las variables de entorno. Cae en un caso excepcional. En ese caso tienes que ir a settings del repo y luego en secrets and variables.

    • @abrahan844
      @abrahan844 6 หลายเดือนก่อน

      ​@@LeonardoCastillo79ok lo intentaré

  • @StrongScript
    @StrongScript 5 หลายเดือนก่อน +1

    me sale pagina en blanco

    • @LeonardoCastillo79
      @LeonardoCastillo79  5 หลายเดือนก่อน

      En la consola del navegador te muestra algo?