Vosotros que hacéis para que un useEffect no que se ejecute en el primer render ?
export const useDidMountEffect = (func, deps) => {
const didMount = useRef(false);
useEffect(() => {
if (didMount.current) func();
else didMount.current = true;
// eslint-disable-next-line
}, deps);
};
#662 Vale, es lo que vi y estaba utilizando. Me gustaría que hubiese otra manera, esta la veo un poco rara
#663 Necesitar este tipo de trucos indica muchas veces que no se esta enfocando bien el asunto. Pero más fácil es decirlo que hacerlo 
#665 A ver te pongo un ejemplo de para lo que lo use yo: Un select con diferentes opciones, por defecto el primer valor es Europa y te pinta las banderas de países europeos, pues la primera vez no quiero que se ejecute este effect, ya que los datos ya los tenia sin utilizar el useEffect pasándolos con getStaticProps por ejemplo, pues la siguiente vez que la opción cambie pues ahí ya se ejecuta.
No sé si ha quedado claro xD
@isvidal hoy he entendido el caso de uso del useMemo()
En teoria no tendria que hacer falta... pero tenia esta componente que se recargaba todo el rato y ni puta idea de que lo causaba.
Lo he puesto y adios.
Uso next btw, no se si importa.
Recomendais tooling para chrome? Creo que hay uno para dev tools que te muestra los hooks y el orden, eso me interesaria.
#667 React dev tools. Aqui hay una mini app a modo de showcase: https://react-devtools-tutorial.vercel.app
#666 yo creo que te funcionaria tambien con un
const [firstTime, setFirstTime] = useState(true);
useEffect(()=>{
if(!firstTime){
lo que quieras hacer
}else{
setFirstTime(false);
}
},
[dependencias])Escribo desde el móvil por lo que igual me he equivocado en algo pero algo así yo creo que te vale igual
@isvidal hoy he entendido el caso de uso del useMemo()
componente que se recargaba todo el rato y ni puta idea de que lo causaba.
Pick one Desu.
#670 porque la primera vez no queremos que se ejecute, así la primera vez se pone en false y ya no vuelve a entrar
Ah vale ya se por donde vas, que no habia leido todo el hilo y he ido a responder el problema de una. Tiene razon vidal. Esto se soluciona mas fácilmente asignado por defecto al estado ese valor que quieres la primera vez.
O sea:
El estado toma valor inicial lo que tú dices que tienes al principio.
Después ya modificas el estado con useEffect o como quieras, pero no te hace falta lo que planteas me parece.
#672 Une useEffect que no quieras que se ejecute en el primer render pero si en el resto es caso muy pero que muy poco comun. Es mas, yo ni recuerdo haber picado nunca ninguno. Otra cosa es un useEffect que solo se ejecutan la primera vez (Cuando por dependencias deberian hacerlo mas) si, a veces, muy pocas, puedes necesitarlo por X edge case, y es lo mas comodo hacerlo asi (No se deberia).
Pero un useEffect que no se debe ejecutar en el primer ciclo de renderizado pero si en los otros es algo muy muy raro.
Es decir, hay useEffects con condiciones, solo ejecuta el codigo de este useEffect si el usuario ha marcado este checkbox como true.
Pero un useEffect de "no tires este useEffect si este es el primer ciclo de renderizado". Es algo que tiene que ser muy muy especial, y lo mas posible es que lo esteis plantenado mal.
26 días después
He hecho esto estos dias, quizas a alguien le interese, es un template/starter de Vite con React, TypeScript, Tailwind... Y mas cosas que yo considero basicas para empezar un proyecto web ahora:
https://github.com/jvidalv/vital
Para usarlo como proyecto nuevo: npx degit jvidalv/vital my-vital-app
Luego yarn o npm install para instalar las deps, y ya yarn/npm start para levantar el web server y empezar a picar codigo.
La verdad es que muy pintón te ha quedado, tienes muy buen gusto por el diseño y eso se nota.
Por otro lado yo recuerdo hacer cosas asi pero al final siempre acabo haciendo el setup a gusto e invirtiendo el tiempo ya que no siempre quiero usar exactamente lo mismo, y te va a tocar andar updateando de cuando en cuando el proyecto y tienes que asegurarte que la manera de hacer setup no ha cambiado con un breaking change, etc, acaba cansando.
Pero vamos, que gj as always, ya sabes que si te planteas venirte pa fuera donde estoy.
#677 Yo creo que es lo suficiente lean con Vite como para no dar mucho por culo a la hora de upgradear. Pero si, el pain in the ass sera upgradear y mas si meto mas cositas que tengo planeadas meter quizas en formas de ramas storybook/cypress and co
esta muy chulo y la forma de utilizar tailwind me gusta bastante más así, no es que haya visto muchos proyectos con tw pero siempre los estilos los vi inline
Por cierto, que no se compartió por aqui pero hace unos dias sacaron la beta de las nuevas docs de React, y la verdad que son una puta maravilla, los conceptos muy bien explicados y quien hubiera podido tener esto en su dia cuando tocó aprender, creo que están dando en el clavo y se nota que está Dan detrás.
#683 Muchísimas gracias. Fíjate que venía ahora mismo a este hilo a preguntar una alternativa para aprender React xDDDD
PD: Si aún así conocéis más alternativas (libros, blogs, tutoriales, que no sean cursos) para complementar, os lo agradezco.
He hecho esto:
https://github.com/jvidalv/nextal
Es un template de Next con basicamente lo mismo que #676 , incluye algunas cosas extra como el Modo Oscuro.
Aqui la demo:
https://nextal.josepvidal.dev/
