[React] Hilo General - Una librería para atraerlos y atarlos a todos

MisKo

Pues voy a pasar mis pruebas a nextJS 10 a ver que tal.

¿Sabeis si hay que hacer algo especial para actualizarlo? xD

EDIT: Vale, creo que solo esto xD

npm install next@latest react@latest react-dom@latest

1 respuesta
Ranthas

Cada día que paso tocando NextJS me hace reflexionar por qué he gastado casi 4 años en AngularJS/Angular.

MisKo

Para empezar, el "next/image" no me tira xD

1 respuesta
Axtrix

#333 Eso te pasa por usar npm

1 respuesta
MisKo

#334 :'(

1
isvidal

#331 Pasate a yarn premoh

1 respuesta
MisKo

#336 Esto no lo arregla yarn xD

Ni idea de pq pasa esto la verdad xD

EDIT: arreglado, por defecto el path es path: '/_next/image', y como lo estaba sirviendo desde una subcarpeta, he tenido que especificarlo path: '/gest/_next/image',

Con eso ya tira xD

Martita-

Me he comprado el curso del gran maximillian, igual el doy un tiento a React, aunque soy Reactcia a el por usar librerias externas, y me gusta mucho Angular.

1 1 respuesta
MisKo

#338 Yo me he pegado con Angular2+, Vue y ahora estoy con React y Angular2+ lo ponía a la cola de los 3 xDDD

3 respuestas
Martita-

#339
No dudo que react sea bueno eh, pero me he acostumbrado demasiado a Angular creo yo.

De todas formas no esta de mas comprobar por mi misma porque React sube tanto y poder tener una opinion mejor fundada, no simplemente porque me guste Angular y ya.

MisKo

Pues he de decir que el next/image funciona de lujo.

He puesto una imagen de prueba de 4500px (900kb JPG) , la he puesto al final del todo despues de una lista enorme (para q no cargue al principio si no cuando se llegue a verla),

Me ha mostrado cuando he llegado una imagen de 768px de ancho, 22,28kb y WEBP.

Le había especificado un ancho de 500px, así que entiendo que ha cogido lo más cercano (por encima) a la configuración que tiene por defecto:

deviceSizes: [320, 420, 768, 1024, 1200],

1 respuesta
Axtrix

#341 Tendre que echarle un ojo, a ver si actualizamos el proyecto de next del curro a la nueva version a ver que tal.

¿Alguien de aquí ha trabajado con la API de NextJS? ¿Hay algún motivo/caso por el cual usar la API de Next es mejor que montarte una con Express (dejando de lado el tema de tener que montar otro proyecto, etc..)?

MisKo

Despues de unas cuantas pruebas más, deciros que para generar con NextJS los htmls estáticos (y servirlos tal cual), el ´next/image´ no tira. Supongo que utilizará nodejs para generar las imágenes en tiempo real y, al servir simplemente contenido estático no funciona.

Para quien lo utilice en producción con el npm run start ( o yarn run start :P ) le valdrá, para el resto no xD

Para las versiones estáticas, os valdría una web ajena que haga lo mismo que ellos, segun pone en su propia documentación:

1 1 respuesta
VonRundstedt

Me estáis dando ansiedad cabrones, no entiendo la mitad de lo que estáis hablando. :disappointed:

1 respuesta
MisKo

#344 Pues pregunta :P

Básicamente, han puesto por la página anterior que ha salido NextJS v10 ( framework de React ).

Una de las cosas que tiene NextJS v10 es un componente propio ( Image ) que implementa:

  • Lazy Loading
    • No se carga la imagen hasta que se vea en el navegador, lo que mejora la carga de la web.
  • Optimización de imágenes
    • Analiza la imagen y el navegador y genera imágenes optimizadas en base a las caracteristicas de la imagen y el navegador.
  • Además de otras cosas.

El tema es que esto ya era posible con varias web existentes, pero te cobraban. Por ejemplo, esta: https://cloudinary.com/ y ahora te lo hace el propio framework.

El tema, es que esta funcionalidad solo está disponible si sirves la página usando el propio framework ( es decir, usando nodejs y con el comando npm run start o yarn run start ) o subiendo el proyecto a Vercel (https://vercel.com/).

Si lo que haces con NextJS es generar contenido estático (solo htmls, css y js y toda la funcionalidad se hace en el navegador del usuario), esta funcionalidad no la tienes disponible y te dicen que uses una de esas páginas de terceros, como la que te he puesto yo.

Y si es cualquier otra cosa la que desconoces, pregunta :D

1 1 respuesta
isvidal

#343 yarn start, el run no hace falta con yarn jaja

1 respuesta
Axtrix

#345 #346 con npm tampoco

MisKo

Yo acostumbro a poner siempre el comando entero

🤣🤣

Thor

No sabia que habia tema de React y con movimiento aun por encima, por aqui me quedo 😀

isvidal

Si ha alguien le interesa, el a;o pasado hice un proyectito para tener un blog personal, lo hice de cero, con un CRM en el backend con PHP y el blog en si puro React, el blog soporta articulos, categorias, tags, autores, relacionados, multiples idiomas, temas y mas cosas.

Como me he cansado de mantener el servidor, y planeo montar mi pagina con el blog con NextJs, lo he reconvertido a fully offline ( Pues es un proyecto al que tengo mucho cari;o, y entre otras cosas, me abrio las puertas del curo que tengo ahora ).

La data esta toda en local, ya no tira ninguna peticion fuera, eso quiere decir que incluso se puede rehusar por otros (juejj).

El blog y como luce en local en github-pages:
https://jvidalv.github.io/vvlog

Y el codigo fuente donde explico todo el rollo:
https://github.com/jvidalv/vvlog

El codigo no esta mal, un poco fumado, he mejorado mucho el modelo mental desde que lo empece. Os lo dejo a ver que os parece.

1 respuesta
B

.

VonRundstedt

#350 Supongo que lo que más curro te llevó de ahí el cambio de idioma, no?

Te apellidas igual que yo, primos lejanos de Nacho pollones ahí.

1 respuesta
isvidal

#352 Creo que lo que mas por culo me dio fue que los snippets de codigo se vieran guay con Prism.Js veniendo como venian de una api con HTML a pelo.

El meme de nacho vidal me persiguio todo el instituto hasta bien entrada la edad adulta.

Pizzelio

Hay alguna forma de modificar un useState hook desde una componente externa a la que lo tiene declarado?

2 respuestas
JuAn4k4

#354 A su valor te refieres? No, useState es interno al componente.

1 respuesta
isvidal

#354 Depende, si es el mismo componente/hijo que lo declara puedes devolver por referencia el setState y hacer lo que quieras con eso.

Si está en otra jerarquía padre/paralelo, entonces es imposible.

1 respuesta
MTX_Anubis

#339 que opinas vue vs react?

No he tocado react pero lo que veo de código siempre me da cancer de sida.

3 respuestas
Axtrix

#357 Reac > Vue, no he probado la version 3 de Vue, pero estuve un tiempo trabajando con Vue antes de empezar React y no volveria a Vue por nada la verdad (y eso que Vue me gusta mucho y mantengo un projecto en Vue)

1 2 respuestas
Zoko

Vue está bien pero tiene bastante más DSL que React, que creo que no es bueno en general si quieres luego poder trasladar tus conocimientos a otro lenguaje.

1 respuesta
MisKo

#357 No llevo mucho tiempo con React y seguro que me faltan 178236198273698123 cosas por saber, pero ahora mismo me parece muchísimo más limpio y sencillo Vue xD

De todas formas, lo mejor es tocarlo uno mismo para tener una opinión con fundamento, coge cualquier proyecto pequeño y migra completamente a React, es lo que estoy haciendo yo xD

EDIT: veo que mi opinion es diferente de todos los demás. Yo llevo varios años con Vue y NuxtJS, supongo que de ahí la diferencia xD

1 respuesta