Está siendo ahora en vivo y en directo la Vercel Ship.
Está anunciando un montón de novedades desde Nexty S15, novedades para Vercel,
y tienen muy buena pinta porque tiene algo que ver conmigo.
Bueno, a ver, no es que yo haya sido el culpable, o a lo mejor sí.
Ahora me lo vais a decir vosotros, a ver si es que sí o si es que no, ¿vale?
Pero ahora os voy a comentar por qué, amigos, os puedo anunciar que acaban de anunciar
que el agente de Vercel añade Vercel Firewall para bloquear tráfico por user-agent,
para loguear todas las peticiones según los paths, para hacer rate limit de cualquier recurso,
para hacer un challenge del tráfico para que no tengas ataques como el que tuve yo en la velada en Vercel.
Y además, gratis para todos los planes.
Amigos y amigas, ya hace tiempo que estoy, desde que tuve los ataques de la web de la velada,
pues si no te has enterado te lo comento rápidamente,
tuvimos unos problemitas en la web de la velada que estaba hospedada en Vercel.
¿Y qué pasa? Pues que alguien con mucho tiempo libre empezó a atacar la web de la velada.
Y yo tenía todos los proyectos en Vercel, y la velada también.
Y el problema es que en Vercel no había herramientas para poder parar este ataque.
No había ningún tipo de herramienta.
Y un día dije, bueno, basta ya, voy a mover todos mis proyectos de Vercel.
Los voy a mover y ya está.
Lo dije aquí, en este tuit.
Estoy sacando mis proyectos de Vercel, explicaré las razones la semana que viene con detalle.
Por ahora toca emigrar un montón de proyectos.
Y desde entonces, pues han pasado muchas cosas.
Entre ellas que estuve hablando con la gente de Vercel de este problema.
¿Qué es lo que yo hubiera esperado?
¿Qué es lo que me hubiera gustado que tuviese Vercel?
Y tal, ¿no?
Y entonces una de las frases que yo les dije,
que no digo que hayan sacado de ahí la frase, ¿vale?
Pero una de las frases que yo les dije es que quería que Vercel fuese seguro por defecto.
Que necesitaba que fuese, que Vercel fuese seguro por defecto.
Que no quería tener que utilizar, no quería tener que utilizar nada, ¿vale?
Tenía que ser Vercel que tuviese todo arreglado.
Y amigos, ¿qué han anunciado?
Secure by default.
¿Puede ser casualidad?
No voy a decir que esto me lo han quitado.
Ya se lo preguntaremos a Guillermo.
Porque Guillermo me ha dicho que vendrá un día a hablar con nosotros
para comentarnos todas las novedades de Vercel, entre estas.
Pero tengo que decir que yo en la charla les incidí con esta frase.
La de secure by default.
Les dije, es que tiene que ser secure by default, secure by default.
Y la verdad es que estaban así como, sí, sí, sí, sí, sí, sí, sí, sí.
Y bueno, hoy justamente están haciendo ahora la conferencia de Vercel.
Están anunciando un montón de novedades.
NextGS 15, novedades para Vercel, que ahora los vamos a comentar, ¿vale?
Y un montón de cosas más.
Y además están anunciando el firewall que van a poner.
De forma que, fijaos, firewall.
Que no sé si lo tenéis ya disponible.
Si no, os lo puedo enseñar.
No sé si en exclusiva porque ya estará para todos.
A ver, si vamos a un proyecto, a la velada, por ejemplo.
En la velada, ahora deberíamos tener aquí una nueva pestaña que se llama Firewall.
Y esto tiene muy buena pinta.
Porque, fijaos, uno, aquí tenéis como el tráfico que sí que ha podido llegar correctamente.
Tráfico normal.
Challenge mode.
Esto significaría el tráfico que se le ha hecho challenge.
Todo esto son cosas que yo les comenté que necesitaba.
Porque me dijeron, bueno, pero ¿qué necesita de tal?
Bueno, pues yo necesito esto, esto y esto.
Y tengo que saber cuando...
O sea, quiero tener visibilidad de estos datos.
De cuántos challenges se han hecho.
Cuántos ataques se han mitigado.
Cuántos se ha bloqueado.
Yo quiero saber estos datos porque si no, no me sirve.
No me sirve.
No me puedes decir luego que no he hecho nada si yo no tengo estos datos para tomar acciones.
Así que ahora han puesto todos estos datos.
Bueno, me parece fantástico.
Y además de esto, tenéis aquí el attack challenge mode para activarlo.
Pero además, ¿veis que aquí hay configure?
Todavía le faltan unas cosas que yo les he pedido.
Pero bueno, estoy muy contento porque hay cosas que ya han ido añadiendo.
Les dije que había unos cuantos filtros y esto.
Me imagino que irán añadiendo más cositas.
En configure, ¿vale?
Para configurar, tenéis aquí...
Aquí podéis poner reglas.
Podéis desde bloquear por IP, que esto antes era enterprise.
Este IP...
O sea, bloquear por IP.
Esto antes era solo de enterprise.
Y yo les dije que no podía ser enterprise esto.
No puede ser enterprise algo tan básico, ¿vale?
Y entonces me dijeron, lo vamos a hacer gratuitos para todos.
Para todos.
Y me parece bien que para free, esto, el IP blocking lo tienes.
Y también el rate limit, ¿veis?
Cuando hagáis new rule, aquí vais a tener la posibilidad de, según la petición, el método, el user agent, un montón de cosas, podéis hacer que tenga el challenge.
Podéis hacer bloquearlo directamente para que si un user agent, por ejemplo, que contenga la palabra Python, pues podéis decir, vale, pues esto quiero hacer un challenge.
Y a partir de esto, le tenéis que poner bloquear Python scripts, ¿vale?
Para que los Python scripts no me ataquen tan fácil.
LOL.
Guardáis esta rule y ya tenéis una regla en la que directamente estáis bloqueando todos los user agents.
Esto es gratuito para todo el mundo.
Esto, amigos, esto...
Os voy a decir una cosa.
O sea, yo he sido siempre transparente cuando tuve los problemas de Vercell, os dije, oye, esto no me gusta, esto no sé qué.
Tengo que decir que como empresa es impresionante lo rápido, lo rápido que se han puesto las pilas.
O sea, yo les dije, desde el día que les dije y todo esto, y les dije, oye, esto no está bien, os lo comenté a vosotros, nos pasamos a Cloudflare, lo hicimos en Cloudflare.
Y os dije toda la historia de qué es lo que yo hice, qué es lo que yo esperaba de Vercell y tal.
Y tengo que reconocer que me parece espectacular que en tan poco tiempo, en tan poco tiempo, se han puesto las pilas tan rápido.
O sea, me parece increíble.
Me parece muy bien y estoy muy contento de que realmente hoy podamos decir que en menos de dos meses tengamos esto ya en producción y además que lo tengamos para todos los planes.
Que es otra cosa que yo les dije. Les dije, es que esto no puede ser de pago. O sea, tiene que ser para todo el mundo porque la seguridad debería ser innegociable.
Y me dijeron que sí, que tenía razón, que tenía que ser innegociable. Y les dije, secure by default, secure by default. Bueno, pues aquí lo tenéis.
Luego entonces, nada, hacéis una review, lo publicáis y ya tenéis ahí el firewall. Y tenéis todavía más cositas que podéis hacer, ¿eh?
Y lo van a ir mejorando todavía más. Así que nada, ¿ves? Aquí tenéis custom rules y te va a decir de las custom rules cuántas veces la han puesto.
O sea, me encanta. O sea, me encanta. Me encanta. Y aquí sí que podemos decir que esto es un feedback que se han llevado rápidamente a producción.
No sé, o sea, voy a ser sincero, yo no sé si realmente esto lo tenían ya previsto. Quizás lo tenían previsto y todo ha sido casualidad.
O sea, tampoco me voy a poner yo aquí la medallita porque, no sé, puede pasar de todo.
Pero me alegro un montón de que realmente haya llegado porque es que lo necesitaba Vercell. Lo necesitaba y punto.
Así que vamos a hacer un repaso, si os parece, ya que ha pasado, a volver a Vercell.
A ver, sinceramente, yo os lo dije, es que lo necesita totalmente, ¿eh? Necesita totalmente, necesitaba esto.
Es que no tenía sentido que no estuviera esto en Vercell porque si no necesitabas otra cosa para hacerlo.
¿Cuándo explicarás cómo utilizar estas nuevas funcionalidades con un ejemplo práctico?
Bueno, pues la verdad es que ya con Ejemplo Prato lo hicimos con La Velada, pero igual un día lo hacemos y aprovechamos que vendrá Guillermo, que vendrá un día.
Como vendrá, pues igual ese mismo día lo podemos explicar y ya está.
Chambeando más que el CTO de Vercell.
Hombre, no, porque el CTO de Vercell que es bastante crack.
Hostia, os voy a enseñar esto de la Keynote porque ha habido un momento muy divertido.
Ahora ya están con un panel hablando de inteligencia artificial, pero en el inicio ha habido un momento muy divertido del bueno de Guillermo aquí.
Es que ya me he visto la Keynote, yo me la he estado viendo.
Y aquí está el bueno de Guillermo, fijaos.
Están en Nueva York.
Y dice que ya tienen la NextGS Conf, que ahora van a hacer la Vercell Sheep.
Van a hacer dos conferencias a partir de ahora al año, una para NextGS y otra más para Vercell.
Y aquí habla que él siempre ha apostado por la web.
Y fijaos en lo que dice.
Dice, en mi vida entera he estado apostando por la web.
Y si vamos para atrás, fijaos.
¡Ay, qué bueno!
Y dice, bueno, ¿qué hay diferente?
Que tenía mucho pelo.
Y bueno, que ha cambiado mucho Vercell y tal.
Que antes tenía como dos líneas de comando y tal.
Está bastante interesante la Keynote.
Es muy cortita, ¿eh?
Tampoco os penséis que es muy larga.
Lo único que comenta, pues lo típico.
Unos cuantos números.
Un millón de usuarios activos.
Todo lo que está ganando dinero.
100 millones en revenue.
Que han hecho el front-end cloud.
Que ahora, fijaos.
Aquí están como todos los pasos que iban a estar hablando.
Y estaban añadiendo el de secure.
Para tener eso de secure by default.
Y estaba bastante interesante.
Bastante interesante.
También han hablado de inteligencia artificial.
De V0.
Ha estado bastante bien.
Aunque bueno, tampoco aquí no han anunciado nada nuevo.
Pero sí que más adelante es cuando han empezado ya los anuncios.
Desde la novedad del SDK de Vercel.
Ya hay una nueva versión.
Lo de poner comentarios.
Que esto ya estaba.
Pero que han añadido algunas mejoras para convertirlo directamente en Isus.
Esto también está muy chulo.
Cuando trabajas en equipo.
De que puedes ver la página web y puedes hacer un montón de comentarios.
Hasta ahí está bien.
Pero es que ahora lo han mejorado más todavía.
Para ver, por ejemplo, los metadatos de la página.
Y también que puedas convertirlo, creo que, en Isus directamente.
O algo así.
Tiene muy buena pinta.
¿Ves? El Vercel Flags.
Ah, Feature Flags.
Esto está muy chulo, amigos.
Esto está muy chulo.
Joder, es que la verdad es que Vercel, tío, se está poniendo las pilas.
Mira, Feature Flags en Vercel.
Ahora en beta.
Puedes ver qué flags están activados para analíticas, para eventos de analíticas o logs.
Y están experimental para Next.js y para Svelkit.
Oye, para las dos cosas.
O sea que no es solo para Next.js, también para Svelkit.
Me encanta.
O sea, no solo lo han hecho para Next.js.
Las Feature Flags, ¿para qué sirve?
Básicamente esto lo que te va a permitir es poder activar o desactivar funcionalidades de tu página.
Esto es una cosa de las cositas nuevas.
Esto está muy chulo.
Esto está muy chulo.
Fijaos, puedes activar o desactivar funcionalidades de una página, ¿vale?
Aquí, con estas opciones aquí.
¿Ves?
Lo activas y entonces, de repente, te activa la nueva landing.
Es como una condición para ver nuevas features de una página.
Y tú le pones en un if y ya lo tienes.
Y esto totalmente integrado con Vercel.
Y encima, esto está muy chulo porque todas las métricas, todas las métricas, ya te viene para que lo puedas filtrar si tienes la Feature Flag activada o activada.
Y puedas hacer, te sabe.
No entiendo.
Pues básicamente es un if.
Es que tú puedes tener una funcionalidad de tu página activada o desactivada.
Y la activas cuando tú quieras.
Imagínate que tú tienes una página web, por ejemplo, lavelada.es, ¿vale?
Tenemos esta web.
Pero le quieres cambiar directamente, le quieres cambiar esto, ¿vale?
Dice, ¿hasta cuánto dura el ad?
Pues durará hasta que me dé la gana.
Dornob, si no te gusta, te puedes ir.
A ver, amigos, no es un ad, pero me parece que es súper interesante para todo el mundo el tema de Vercel, ¿eh?
Pero si no os gusta el ad, pues, tío, te puedes marchar y ya está.
¿Qué quieres que te cuente?
O sea, te puedes ir por la puerta que está aquí.
Ahí está la puerta.
Por eso te puedes ir.
Si no os gusta Vercel, ¿qué queréis contigo?
Pero al final creo que es uno de los hostings más importantes, que es una novedad bastante importante.
O sea, que si no os gusta Vercel o lo odiáis a muerte, pues, veremos la conferencia de Netlify también.
No os preocupéis para tenerlo.
De hecho, Netlify creo que también tenía feature flags.
¿No los tenía?
¿O sí los tenía?
Porque me suena que los tenía.
Pero creo que era más con el despliegue, que no los podías activar o desactivar, ¿no?
Termina de explicar.
Venga, terminamos de explicar.
Imagínate que tú tienes una funcionalidad.
Le quieres cambiar este header, quieres poner otro totalmente diferente, ¿vale?
Pues, puedes activarlo o desactivarlo a partir de este sitio de aquí.
Lo puedes activar aquí.
Obviamente, lo puedes hacer desde una configuración.
Y si no, lo puedes activar o desactivar aquí.
Y esto está muy chulo porque así tú puedes hacer un despliegue a producción,
pero desactivando esa nueva feature.
Y esto es una cosa muy interesante porque tú despliegas el código,
pero no ves la nueva feature hasta que no lo actives.
Así lo puedes probar o puedes hacer que eso se active para un usuario en concreto.
Por ejemplo, para que alguien dentro del equipo de forma totalmente interna lo pueda activar y ya está.
¿Es como un AB Testing?
Sí, es como un AB Testing.
Lo que pasa es que el AB Testing sería más bien lo que haces después.
El Feature Flag sería para activar o desactivar la funcionalidad.
El AB Testing sería como el paso después de, a través de las analíticas,
ver cuál de las funcionalidades funciona mejor.
Por ejemplo, es una tontería, pero un ejemplo que podemos ver,
que esto seguro que lo habéis visto alguna vez.
Imagínate Amazon.
Tú estás aquí en Amazon y en Amazon pues dices, venga, añadir aquí a la cesta.
Venga, pues añades a la cesta este libro.
Pero esto de añadir a la cesta lo puedes hacer que sea de color amarillo o de color rojo.
Entonces tienes como A y B, el rojo y el amarillo.
Y tú lo que vas a querer ver es cuál de los dos funciona mejor.
Y el que funcione mejor a través de las analíticas, pues ya lo tenéis.
No uso Vercell, pero aprendo las opciones que tiene.
Conocimiento gratis.
O claro, porque al final, aunque no utilice la Feature Flag...
A ver, las Feature Flags no es una cosa que ha inventado Vercell.
De hecho, yo durante mucho tiempo y de forma totalmente gratis, si os interesa,
podéis utilizarlo con Optimizely.
Optimizely, o al menos antes lo tenía, Optimizely tiene Feature Flags
y los podéis utilizar totalmente gratis y está muy chulo.
No sé si ahora los han puesto de pago, pero antes eran gratis y limitados.
Lo digo por si no utilizáis Vercell y queréis utilizar otra cosa.
Pues, ah, hostia, Full Stack, Future Experimentation.
¿Ves? Mira, es un setting.
O sea, los están quitando.
Están quitando Feature Flags, me parece.
Me da la sensación.
Que, o sea, los Feature Flags gratis.
¿Ves?
Ah, no, pues sí, sí que está, ¿no?
Feature Experimentation, Free Future Flagging, Rollout Features and Provide.
Es que esto está muy chulo, porque al final esto te permite, tú puedes ir trabajando en un código
y activarlo cuando quieras.
Perdón, no entiendo lo que es un Feature Flag.
Un Feature Flag es un if.
Ya está, marquitos.
Eso es lo que es, un if.
Y tú le cambias cuando la condición es true o es false.
Pero esa funcionalidad iría en mi código, ¿no?
Sí, yo no sé por qué os complicáis mucho con el Feature Flag, pero básicamente, os voy a enseñar lo que es el Feature Flag, porque igual.
Is new search enabled true.
If is new search enabled, return new search.
Es esto, ¿vale?
All search.
Creo que así lo vais a entender más fácil.
Y esto es el Feature Flag.
Feature Flag.
Es que básicamente es esto.
Lo que pasa es que en lugar de tener esta parte en tu código y tener que pasarlo a true o false,
imagínate tenerlo en la nube donde tú puedas con un clic cambiar el valor de este a true o false, ¿vale?
True o false.
Bueno, pues esto, amigos, es el Feature Flag.
Y lo más interesante es que, aunque está en beta, Vercell lo está añadiendo para todo el mundo.
Y además que lo tengáis ahí totalmente integrado.
No sé, me parece muy interesante.
Mira, aquí podemos ver un poco de código.
Un poquito de código.
¿Veis?
¿Veis cómo es el Feature Flag?
¿Veis que el Feature Flag es un if?
Un if.
Imagínate un Feature Flag que puede ser un descuento especial, una nueva landing, un nuevo componente, lo que sea.
Y es tan fácil como esto.
Y claro, está bastante chulo porque, queráis o no, esto habilita un montón de cosas.
¿Las Feature Flags son mejor que manejar código en un env bar en el repositorio?
Hombre, José Ávila, claro que sí.
Claro que sí, José.
Joder, José.
José.
Claro que sí.
¿Por qué?
Si tú tienes una variable de entorno, significa que para cambiar el valor de la Feature Flag vas a tener que hacer un despliegue.
José, si tienes que hacer un despliegue cada vez que quieras cambiar el valor de una Feature Flag, no es algo que sea muy cómodo.
Porque tú lo que quieres de una Feature Flag es poder activarla o desactivarla lo más rápido posible.
Si lo tienes como una variable de entorno, lo que va a pasar es que tienes que hacer un despliegue completo.
Te voy a poner un ejemplo para que lo entiendas que te va a gustar.
¿Sabes que hay mucha gente que no le gusta desplegar en viernes?
Por lo que sea pudieses desplegar en viernes y que desde la página web de Vercell con un clic pudieras arreglar alguna cosa que no funciona bien.
¿Preferirías eso a tener que volver a desplegarlo todo?
Claro que sí, ¿no?
Tú lo que quieres básicamente es que con un solo clic, con un clic e inmediatamente, que sea instantáneo, puedas volver atrás al componente anterior.
En lugar de tener que hacer todo el despliegue.
Así que esa es la idea.
O sea, que Vercell leerá el código para ese if.
El código no.
Lo que tú leerás, tú leerás el valor de esta variable.
O sea, tú lo que leerás es el valor de esta variable.
No es que va a leer el código Vercell porque esto, total, ya lo lee, ¿no?
O sea, ya lo está haciendo.
¿La feature flag son solo para frontend o no?
No, no tiene nada que ver.
Puede ser para frontend y para backend.
Puede ser para las dos cositas.
NextGS 15 Release Candidate.
RC significa Release Candidate, que es la versión candidata para ser lanzada.
Y en la Release Candidate significa que está muy cerca de lanzarla, pero todavía no está del todo estable.
¿Qué es lo que trae?
Soporte para React 19.
Claro, NextGS 15 va a ser con funcionalidad de React 19.
Con soporte para el compilador de React, ¿vale?
Soporte para el compilador de React experimental.
O sea, que ojo, cuidado.
Y mejoras en los errores de hidratación, que lo vamos a ver.
Hay un breaking change importante para la gente que utilice NextGS.
Y es que se termina el tema del catching.
Peticiones fetch ya no se van a cachear por defecto.
Antes se cacheaban por defecto, pues esto lo van a quitar.
Y luego tendríamos también que las navegaciones del cliente de Get, ¿veis?
Tampoco están cacheadas por defecto.
Esto no será tanto romper funcionalidad, sino que sería más bien que algo te podría salir más caro.
Así que tenedlo en cuenta.
Luego tendríamos experimental partial pre-rendering.
Tenemos una nueva funcionalidad que es para ejecutar código después de que se haya lanzado una respuesta.
Esto está muy chulo y ahora os comentaré por qué.
Hay un nuevo diseño y un nuevo flag para utilizar Turbo Pack en desarrollo local.
De hecho, lo vamos a poder...
No sé si lo podemos ahora probar.
Este es el nuevo diseño, mucho más sencillo, mucho más limpio.
Mira, lo tenemos aquí.
Así que lo podemos ver en un momento.
El nuevo diseño, fijaos.
Vamos con el arroba RC, con guión guión turbo y aquí le damos que sí.
Y ahora, ¿cuál es tu proyecto?
Next 15 RC.
Vamos a utilizar TypeScript con Slim, Tailwind, Source.
Vale, decimos que sí a todo.
Y ahora lo que vamos a ver es que han cambiado la demo que aparece al principio.
La han hecho mucho más sencilla.
Además, la han hecho que salga en modo claro y en modo oscuro.
Y que además se pueda utilizar Turbo Pack por defecto.
Que antes no era por defecto.
Tenías que poner los guiones.
Así que nada, cuando termine la instalación, si es que termine algún día, lo enseño.
¿Y qué tal de velocidad?
Pues más rápido.
Obviamente va a ser mucho más rápido.
Hombre, si se llama Turbo.
Imagínate que se llame Turbo y que se llama Lento.
Sería como uno de los grandes fails totales.
Next 15 RC.
Vamos a poner NPM Run, NPM Run Depth.
¿Ves que ya le ha puesto el Turbo ahí por defecto?
Y, bueno, mucho más rápido.
Mucho más rápido.
Aquí hay unos cuantos warnings.
Y este es el nuevo diseño.
¿Qué os parece el nuevo diseño?
Mucho más sencillo que el que había antes.
Mucho, mucho más sencillo.
Mucho más minimalista.
Lo cual yo, la verdad es que lo aprecio.
Porque ahora aquí vamos a poder simplificar.
Que antes esto tenía un montón.
Va a ver que tampoco tiene mucho menos.
Pero es verdad que tiene menos contenido para eliminar.
El otro a lo mejor era, dicen por aquí que el otro era más bonito.
Puede ser, pero este debe tener mucho menos CSS.
Que al final es la idea.
Aunque, por otro lado, han añadido fuentes.
Que ahora también habrá que eliminar.
Pero bueno, no pasa nada.
Tampoco pasa nada.
El tema es que ahora tenemos este nuevo.
Un poquito más sencillo.
Y que podemos utilizar Turbo por defecto.
¿Qué más?
¿Qué más hay por aquí?
Hay una mejora para hacer optimización de empaquetamiento.
De empaquetar los paquetes externos.
Mira, aquí tenemos con React 19 la posibilidad de utilizar el compilador.
Esto es experimental todavía.
Lo podéis probar, pero solo está en la Release Candidate.
Aquí te explican cómo se haría.
¿Vale?
Hay que poner experimental, el compiler.
Esto va a ser bien bello, amigos.
Cuando lo tengamos ya estable totalmente.
Va a ser bastante, bastante bonito.
¿Cómo se migra un proyecto de Next 14 a 15?
Pues aquí también tienes...
Aquí en el artículo te lo explican perfectamente.
Next 15 Upgrade Guide.
Pues aquí lo tienes.
Y aquí te explican paso a paso cómo lo tienes que hacer.
Le echas un vistazo y te lo van a comentar todo, ¿eh?