Les comparto mi proyecto como Plus tiene instalado StoryBook como una guía de los componentes:
LINK REPOSITORIO: https://github.com/GinnioSarabia/primerReact
.
Bienvenida al curso
Todo lo que aprenderás sobre React Router y Redux
¿Qué es React Router? y Aplicarlo en tus proyectos
¿Qué es React Router y cómo instalarlo?
Crear nuestro archivo de Rutas
Container: Login
Container: Register
Container: 404 Not Found
Componente: Layout
Manejando enlaces y configuraciones
¿Qué es Redux?
Qué es Redux
¿Qué es Redux? Profundizando en la herramienta
Instalación de Redux
Creando el Store de Redux
Aplicando Redux a nuestra aplicación
Creando los reducers
Finalizando reducers y eliminar favoritos
Debuggeando nuestro proyecto (agregando validaciones a nuestro componente card)
Crear Formulario de Login
Formulario de Login con Redux
Creando un Servicio para Gravatar
Uso de gravatar en nuestro proyecto
Validación para LogIn LogOut
Register
Register con Redux
Vista general del player
Arreglando la funcionalidad del player
Terminando de detallar nuestro player
Validaciones
Validaciones de UI
Debug con Redux Devtools
Cierre del curso
Cierre del Proyecto
Si estás empezando la escuela de JavaScript desde este curso deberás crear una copia del repositorio de Platzi Video:
git clone https://github.com/platzi/PlatziVideo.git
Una vez tienes listo el repositorio vas a crear una nueva rama para trabajar en ella a lo largo del curso:
git checkout -b feature/router-redux
Ya que nos encontramos dentro de la rama vamos a instalar React Router, la librería que nos va a permitir manejar rutas dentro de nuestra aplicación:
npm install react-router-dom --save
Aportes 54
Preguntas 18
Les comparto mi proyecto como Plus tiene instalado StoryBook como una guía de los componentes:
LINK REPOSITORIO: https://github.com/GinnioSarabia/primerReact
.
Estimados indico los pasos para implementar desde 0
git clone https://github.com/platzi/PlatziVideo.git
git checkout -b feature/router-redux
npm config set strict-ssl false
npm install react-router-dom --save
npm audit fix
npm install json--server -g
json-server initialState.json
npm run start
::-webkit-scrollbar{ dispaly:none; }
espero sea de ayuda.
El detalle es que este curso es del 2019.
El último commit que se le hizo a la rama feature/react es del 11 de julio del 2019, por lo que algunas de sus dependencias se encuentran desactualizadas.
Esto lo puedes ver al entrar a la carpeta PlatziVideo desde la terminal y ejecutar
npm outdate
Al día de hoy (17/12/2020) la lista nos aparece así
Para actualizar las dependencias a la version Wanted vamos a ejecutar
npm update
Al terminar las actualizaciones nos aparecerá que tenemos vulnerabilidades
Para parcharlas ejecutamos el comando que nos sugieren
npm audit fix
Enseguida, por temas de compatibilidad, cambiamos la version de nuestras dependencias webpack, webpack-cli y webpack-dev-server. Esto con el siguiente comando:
npm install webpack@4.41.5 && npm install webpack-cli@4.2.0 && npm install webpack-dev-server@3.11.0
Volvemos a ejecutar npm audit fix
para parchar posibles vulnerabilidades
Ahora abrimos nuestro editor con el comando code .
y editamos el script “start” de nuestro package.json
Lo reemplazmos por:
"start": "webpack serve --mode development"
Guardamos cambios y en una segunda terminal ejecutamos nuestro json-server:
json-server --watch initialState.json
Creamos nuestra rama para el feature curso
git checkout -b feature/router-redux
Instalamos React Router
npm install react-router-dom --save
Y por último iniciamos nuestra app con
npm run start
Para todos los que tienen problemas clonando el repositorio e instalando los paquetes, yo lo solucioné de la siguiente manera:
npm install -g npm-check-updates
ncu -u
npm install
webpack serve --open --mode development
Me metí a esta clase que dice “¿Qué es React Router…” para saber qué es y no dicen que es :v
QUÉ ES REACT-ROUTER?
react-router es una librería para crear rutas en nuestra aplicación de React, cuenta con una versión para Web y otra para desarrollo mobile con React Native, pero en el curso veremos la versión Web.
Usa enrutamiento dinámico, A diferencia de el enrutamiento estático, que define las rutas cuando nuestra aplicación es iniciada, este toma lugar en el momento en que nuestra aplicación se está renderizando. Esto gracias a que react-router hace uso de componentes para definir sus rutas.
react-router nos provee todos los componentes necesarios para hacer que nuestra SPA (single page application) se mantenga en sincronía con nuestra locación actual. Y tranquilo, los verás a lo largo del curso 😉
Los componentes más conocidos que usa son
Que es React Router?
La posibilidad de movernos entre las diferentes partes de nuestra aplicación, bien sea cuando le damos clic a un botón, una imagen, un menu, etc o cuando colocamos un link.
Creo que es algo muy basico, pero es bueno tenerlo en mente para no estancarse mas adelante en el curso (me paso a mi)
Para instalar esa funcion tan chula de abrir el VSCode desde la terminal con “code .” seguir los siguientes pasos:
Open Visual Studio Code and press Command + Shift + P then type Shell in command palette now you are able to find this option like Shell Command : Install code in PATH from suggested list in command palette. Select that options.
Buenas! Dejo un enlace por si quieren setear una nueva url al repositorio remoto que creen para este curso.
Exitos!
https://help.github.com/en/articles/changing-a-remotes-url
Al hacer el clone y el install me encontró 181 vulnerabilidades, las que arreglé con
npm audit fix
Luego de probar las soluciones propuestas (que ninguna anduvo) estos pasos me terminaron funcionando en agosto2021:
CLONAR EL PROYECTO
git clone https://github.com/platzi/PlatziVideo.git
BORRAR EL PACKAGE-LOCK.JSON
EJECUTAR
npm install
npm install -g json-server
npx json-server --watch initialState.json
ESE ULTIMO COMANDO DEBERIA MOSTRAR ESTO EN CONSOLA
"{^_^}/ hi!
Loading initialState.json
Done
Resources
localhost:3000/initalState
Home
localhost:3000
Type s + enter at any time to create a snapshot of the database
Watching…
GET /initalState 200 34.649 ms - -"
EJECUTAR PARA CREAR OTRA RAMA
git checkout -b feature/router-redux
EJECUTAR
npm install react-router-dom --save
npm run start
SE VE LA CONSOLA EN localhost:8080/
Este curso maneja versiones viejas, deberían actualizarlo ya estamos en 2022, si tienes problemas usa npm ci despues de ello elimina package-lock.json y procede a npm i
https://app.gitbook.com/@fernan942/s/react-router-and-redux/
Chicos, les dejo este link donde están mis apuntes del curso, espero y les sirva. No son perfectos, pero sirven de guía. Saludos!
con solo poner
git branch NOMBREDELARAMA
te la crea
y si queires cambiarte y tienes la ultima version de git
solo tienes que hacer
git switch NOMBREDELARAMA
Siento que es mas facil porque el checkout sirve para muchas otras cosas mas ,Git lo que ha estado tratando de hacer delegar estas funciones que tiene checkout
Tuve muchos problemas al instalar esto hoy (abril 2022), estoy usando ubuntu y tuve que cambiar la version de mi npm, aqui los pasos:
Instalar la versión 12.22.10
n 12.22.10
Yo tenia la version 16 por lo cual hice switch entre la versión de esta manera.
n use 12.22.10
instalas dependencias en tu proyecto:
npm install
por ultimo corres el json-server,
npx json-server --watch initialState.json
corres el proyecto
npm run start
Me encanto el curso, aprendí mucho y espero que las imágenes del proyecto con una pequeña modificación con la temática de anime los motive 😎
(https://www.youtube.com/watch?v=oELFNug8drU)
Puede ver el proyecto aquí: (https://animevideoplatzi-jorge-vicuna.vercel.app/)
Repositorio : (https://gitlab.com/proyecto-reactjs/react-platziescuelajs-practico-ot/platzivideo)
Si están teniendo problemas para instalar dependencias, a mi me funciono cambiar la versión de node, con la 12.22.10 me esta funcionando bien
Bien ahi va para los que les gusta respuestas resumidas:
React Router es una librería que nos permite crear rutas en nuestra aplicación.
Para implementarlo a nuestra aplicación necesitamos instalarla con:
npm i react-router-dom
Les comparto mi repositorio https://github.com/AndresCaro189/ProyectoDePLatzyVideo
ya empece con errores, me pueden ayudar porfis
Después de clonarlo, quizá quieras probar si funciona…
además del
npm run start
no olvidemos
json-server <file.json>
Tengo el siguiente problema
> [email protected] install /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-sass
> node scripts/install.js
Downloading binary from https://github.com/sass/node-sass/releases/download/v4.12.0/linux-x64-83_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.12.0/linux-x64-83_binding.node":
HTTP error 404 Not Found
Hint: If github.com is not accessible in your location
try setting a proxy via HTTP_PROXY, e.g.
export HTTP_PROXY=http://example.com:1234
or configure npm proxy via
npm config set proxy http://example.com:8080
> [email protected] postinstall /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-sass
> node scripts/build.js
Building: /usr/bin/node /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok
gyp verb cli [
gyp verb cli '/usr/bin/node',
gyp verb cli '/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-gyp/bin/node-gyp.js',
gyp verb cli 'rebuild',
gyp verb cli '--verbose',
gyp verb cli '--libsass_ext=',
gyp verb cli '--libsass_cflags=',
gyp verb cli '--libsass_ldflags=',
gyp verb cli '--libsass_library='
gyp verb cli ]
gyp info using [email protected]
gyp info using [email protected] | linux | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
gyp verb `which` failed at getNotFoundError (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:13:12)
gyp verb `which` failed at F (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:68:19)
gyp verb `which` failed at E (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:80:29)
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:89:16
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/index.js:42:5
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/mode.js:8:5
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:183:21)
gyp verb `which` failed python2 Error: not found: python2
gyp verb `which` failed at getNotFoundError (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:13:12)
gyp verb `which` failed at F (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:68:19)
gyp verb `which` failed at E (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:80:29)
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:89:16
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/index.js:42:5
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/mode.js:8:5
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:183:21) {
gyp verb `which` failed code: 'ENOENT'
gyp verb `which` failed }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb `which` failed Error: not found: python
gyp verb `which` failed at getNotFoundError (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:13:12)
gyp verb `which` failed at F (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:68:19)
gyp verb `which` failed at E (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:80:29)
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:89:16
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/index.js:42:5
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/mode.js:8:5
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:183:21)
gyp verb `which` failed python Error: not found: python
gyp verb `which` failed at getNotFoundError (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:13:12)
gyp verb `which` failed at F (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:68:19)
gyp verb `which` failed at E (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:80:29)
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:89:16
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/index.js:42:5
gyp verb `which` failed at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/mode.js:8:5
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:183:21) {
gyp verb `which` failed code: 'ENOENT'
gyp verb `which` failed }
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack at PythonFinder.failNoPython (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-gyp/lib/configure.js:484:19)
gyp ERR! stack at PythonFinder.<anonymous> (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-gyp/lib/configure.js:406:16)
gyp ERR! stack at F (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:68:16)
gyp ERR! stack at E (/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:80:29)
gyp ERR! stack at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/which/which.js:89:16
gyp ERR! stack at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/index.js:42:5
gyp ERR! stack at /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/isexe/mode.js:8:5
gyp ERR! stack at FSReqCallback.oncomplete (fs.js:183:21)
gyp ERR! System Linux 4.19.128-microsoft-standard
gyp ERR! command "/usr/bin/node" "/mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /mnt/d/mateo/profesional/Platzi/escuela-webdesign/intermedio/react-router/PlatziVideo/node_modules/node-sass
gyp ERR! node -v v14.15.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
Build failed with error code: 1
npm WARN [email protected] requires a peer of [email protected]^4.19.1 || ^5.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of [email protected]^4.19.1 || ^5.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] No description
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] postinstall: `node scripts/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/matespinosa09/.npm/_logs/2020-11-16T14_49_21_959Z-debug.log```
Para que solo copien y peguen:
npm install react-router-dom --save
a
yo lo que hice fue crear una rama para dejar lo que hice anterior mente en ella y continue trabajando en master
Listo para aprender de este gran curso.
Es un declarador de rutas; muy similar a expressjs
.
Hacemos git clone [email protected]:platzi/PlatziVideo.git
; entramos cd PlatziVideo
.
Con git checkout -b feature/router-redux
para la nueva rama.
Con npm install react-router-dom --save
tenemos las librerías necesarias.
Con code .
o subl .
abrimos nuestro editor.
super, que emoción*.*
ME saliron muchas vulnerabilidades, es recomendable que use el comando que me recomienda “npm audit fix” o podria causar poblemas en el desarrollo del curso?
Espero aprender mucho en este curso, es un buen profesor el que lo da.
Excelente Profe!!!
Repositorio del curso
https://github.com/platzi/PlatziVideo/tree/feature/router-redux
React-Router es una librería para gestionar rutas en aplicaciones que utilicen React JS.
Excelente clase
que buen inicio…
Recomiendo mucho esta lectura sobre React Router: Click Aqui
Ahora si a empezar, motivacion al 100%
listo!
Alguien mas esta teniendo problemas par instalar json-server??
JAJAJA oye viejo jamás mencionas ¿Qué es React Router? y está en el título…
Espero poder utilizar los conocimientos que se adquieren en este curso para un proyecto que realizo en base a lo aprendidi en los curso de React y Practico 💪💪
Tuve algunos inconveniente al momento de correr la aplicación, así que me fije con que versión estaba trabajando Oscar y le instale la misma.
npm install [email protected] --save
[email protected] start C:\Users\Toshiba\Desktop\React Proyects\PlatziVideo-feature-react
webpack-dev-server --open --mode development
internal/modules/cjs/loader.js:968
throw err;
^
Error: Cannot find module ‘C:\Users\Toshiba\Desktop\React Proyects\PlatziVideo-feature-react\node_modules\webpack-dev-server\bin\webpack-dev-server.js’ at Function.Module._resolveFilename (internal/modules/cjs/loader.js:965:15)
at Function.Module._load (internal/modules/cjs/loader.js:841:27)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
at internal/main/run_main_module.js:17:47 {
code: ‘MODULE_NOT_FOUND’,
requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: webpack-dev-server --open --mode development
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Toshiba\AppData\Roaming\npm-cache_logs\2020-10-01T04_27_32_840Z-debug.log
Si a alguien le da un hermoso error cuando ejecutan el comando
npm install react-router-dom --save
Hermoso error:
gyp ERR! build error
gyp ERR! stack Error: not found: make
gyp ERR! stack at getNotFoundError (/home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/which/which.js:13:12)
gyp ERR! stack at F (/home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/which/which.js:68:19)
gyp ERR! stack at E (/home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/which/which.js:80:29)
gyp ERR! stack at /home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/which/which.js:89:16
gyp ERR! stack at /home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/isexe/index.js:42:5
gyp ERR! stack at /home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/isexe/mode.js:8:5
gyp ERR! stack at FSReqCallback.oncomplete (fs.js:176:21)
gyp ERR! System Linux 4.4.0-19041-Microsoft
gyp ERR! command "/usr/bin/node" "/home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /home/usuario/escuela-javascript/react-router-redux/platzivideo/node_modules/node-sass
gyp ERR! node -v v14.5.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
Build failed with error code: 1
npm WARN [email protected] requires a peer of [email protected]^4.19.1 || ^5.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of [email protected]^4.19.1 || ^5.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] No description
npm WARN [email protected] No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] postinstall: `node scripts/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/usuario/.npm/_logs/2020-08-16T22_52_48_707Z-debug.log
Lo pueden solucionar así:
sudo apt-get update
sudo apt-get install build-essential
Luego ya pueden hacer tranquilamente:
npm install react-router-dom --save
Al instalar react-router-dom la consola me arroja unos errores al final del proceso. Ayuda
<gyp ERR! build error
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack at ChildProcess.onExit (/home/vidad/platzi/curso-router-redux/PlatziVideo/node_modules/node-gyp/lib/build.js:262:23)
gyp ERR! stack at ChildProcess.emit (events.js:315:20)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:276:12)
gyp ERR! System Linux 5.4.0-26-generic
gyp ERR! command "/usr/bin/node" "/home/vidad/platzi/curso-router-redux/PlatziVideo/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd /home/vidad/platzi/curso-router-redux/PlatziVideo/node_modules/node-sass
gyp ERR! node -v v14.4.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
>
hey! como esta? al tratar de instalar react router me lanza este error
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected]4.12.0 postinstall: `node scripts/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected]4.12.0 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Daniel\AppData\Roaming\npm-cache\_logs\2019-10-31T15_12_46_971Z-debug.log```
me pueden ayudar??
les recomiendo correr el comando npx npm-check-updates -u
y luego npm install
luego de haber clonado el repositorio,
trate de hacerlo de la forma sugerida aca abajo en los comentarios pero me seguia retornando el mismo error una y otra vez al momento de instalar el router, esta en cambio me funciono
con muchas expectativas.
¿Que es React Router?
React Router es la biblioteca de enrutamiento estándar para React. “React Router mantiene su interfaz de usuario sincronizada con la URL. Tiene una API simple con funciones poderosas como carga diferida de código, coincidencia dinámica de rutas y manejo de transición de ubicación integrado. Haga de la URL su primer pensamiento, no un pensamiento posterior ".
Les comparto el link de Uso con React Router de la web principal de REDUX
React Router es una librería para gestionar rutas en aplicaciones que utilicen React JS.
Tengo una pregunta, para la configuración del entorno que se hizo en el curso de React Practico, es necesario hacerla de nuevo si se utiliza esta nueva carpeta en una nueva ubicación? O se puede hacer sin configurar el entorno con react, webpack y demás?
Súper, muy práctico. 😉
Súper, muy práctico. 😃
¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.