En mi caso antes de agregar react-router-dom ya lo habia desplagado en GitHub Pages, lo que hice fue subir los cambios nuevos con git push y posterior a se corren 2 comandos, para actualuzar GitHubPages.
npm run build
npm run deploy
Fundamentos de navegación en la web
¿Cuándo necesitas React Router?
SSR vs. Single Page Applications
Versiones de React Router: ¿Por qué son tantas? ¿Cuál elegir?
Introducción a React Router DOM 6
Instalación de React Router DOM 6
BrowserRouter vs. HashRouter
Route: componentes de navegación
Link vs. NavLink
useParams: rutas dinámicas
useNavigate: historial de navegación
Outlet: nested routes
Fake authentication con React Router DOM 6
useAuth: login y logout
Menú con rutas públicas y privadas
Navigate y redirects: protegiendo rutas privadas
Roles y permisos
Reto: composición de componentes con navegación
Reto: UX de login y logout
Reto: roles complejos
React Router en TODO Machine
Integrando React Router a proyectos en React
Creando las rutas de TODO Machine
Botón de editar TODOs
Generador automático de IDs
Cambiando modales por navegación
Obtener y editar TODOs
useLocation: transferencia de datos por navegación
Deploy con React Router en GitHub Pages
Próximos pasos
Reto: página de búsquedas con navegación
Reto: TODO Machine con React Router DOM 5
Reto: PlatziMovies con React Router
Reto: crea tu propio React Router
Espera más cursos de React.js
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
Iniciar sesión
Deploy con React Router en GitHub Pages
25/30Recursos
Aportes 9
Preguntas 0
Ordenar por:
uyyy, yo nunca lo pude hacer con gh-pages, preferí desplegarlo con netlify o vercel, es un millon de veces más facil y rapido
Me ha pasado muchas veces el error XD. Así que comparto mis notas de cómo hacer el deploy en gh-pages. Recomendacion
paso 1.
npm instal gh-pages -D
…
paso 2.
En package.json después de “devDependencies”: { } agregar la siguiente línea
"homepage": “https//<nombre usuario>.github.io/<nombre repositorio>”
…
paso 3.
agregar en scripts lo siguiente
"predeploy": “npm run build”,
“deploy”:“gh-pages -d build”
…
paso 4.
correr npm run deploy
…
Si hay algun error
cambiar la linea
** “deploy”: “gh-pages-clean gh-pages -d build”**
correr :
npm run deploy
cambiar la línea de nuevo a
** “deploy”:“gh-pages -d build”**
…
correr
npm run deploy
…
Después de horas y horas de hacer debug por horas y de fallo con el gh-pages, pude hacer el deploy correctamente jsjsj
Dejo mi TODO app hasta éste punto del curso 😄
En mi caso, tuve un problemita al desplegar en github pages, se solucionó corriendo el siguiente código para eliminar el anterior origen remoto antes de ligar mi repositorio local a mi repositorio en github
git remote remove origin
Para los que necesiten un resumen de la clase paso a paso, con todos los comandos. Solo denle clic 👇
Desplegando la app
En mi caso hice lo siguiente:
Para proyectos ya desplegados podemos hacer lo siguiente:
Correr los comandos en la terminal
npm run build
npm run deploy
Y si no actualiza los cambios hacer los siguiente :
En el archivo package.json
En el scripts escribir: “deploy”: "gh-pages-clean gh-pages -d build"
Luego corremos en la terminal el siguiente comando
npm run deploy
Luego borrar gh-pages-clean en el package.json y correr nuevamente el comando npm run deploy en la terminal
Luego vamos a nuestro GitHub y ya podemos ver nuestra rama gh-pages ya desplegada…. sigue los pasos de Juan DC paso a paso y lo lograras.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?
o inicia sesión.