Subscribe to receive notifications of new posts:

Anima tus sitios en Cloudflare Pages con Pages Functions - Disponibilidad general

11/17/2022

6 min read
Spice up static sites on Cloudflare Pages with Page Functions

Antes de que lanzáramos Pages en abril de 2021, sabíamos que sería el comienzo de algo mágico, una experiencia que parecía "perfecta". Imaginamos una experiencia muy simple, pero a la vez tan sencilla, que permitiera a los desarrolladores enviar un sitio web en segundos y añadir más funciones con la ayuda del resto de nuestro ecosistema Cloudflare.

Unos meses después, cuando anunciamos que Pages era una plataforma integral en noviembre de 2021, ese sueño se hizo realidad. La creación de una plataforma de desarrollo solo para sitios estáticos no era el final de nuestra trayectoria con Pages, y con Cloudflare Workers, que ya forma parte de nuestro ecosistema, sabíamos que había muchas posibilidades sin explotar. Con la incorporación de Pages Functions, permitimos a los desarrolladores añadir fácilmente contenido dinámico en un sitio estático con la eficacia de Cloudflare Workers.

En el último año, desde la versión beta abierta de Functions, exploramos a fondo qué tipo de funciones integrales buscan los desarrolladores en sus proyectos, y nos dispusimos a adaptar la experiencia de Functions en lo que es hoy.

¡Nos complace anunciar la disponibilidad general de Pages Functions!

Resumen de Functions

Aunque se llaman "Functions" en el contexto de Pages, estas funciones que se ejecutan en nuestra red son Cloudflare Workers "disfrazados". Pages aprovecha la eficiencia y la escalabilidad de Workers y las desarrolla para alinearlas con la experiencia de los desarrolladores de Pages.

Con Functions, puedes soñar con la posibilidad de añadir funcionalidades dinámicas a tu sitio, como la integración con soluciones de almacenamiento, la conexión a servicios de terceros, el uso de representación del lado del servidor con tus marcos de trabajo integrales favoritos y muchos más. Mientras Pages Functions abre sus puertas al tráfico de producción, exploremos algunas de las funciones interesantes que hemos mejorado y añadido en esta versión.

La experiencia

Implementación con Git

¿Te gusta codificar? Te lo dejamos a ti. Nosotros nos encargamos de la infraestructura.

Solo tienes que escribir una función JavaScript/Typescript e incluirla en un directorio de funciones, enviando tu código a tu proveedor de Git. Nuestro sistema CI ultrarrápido creará tu código y lo implementará junto con tus activos estáticos.

Carga de archivos directamente en Functions

¿Prefieres encargarte del desarrollo? ¿Tienes un proveedor de Git especial que aún no es compatible con Pages? ¡No hay problema! Una vez coloques Function en tu carpeta, podrás crear con tus herramientas de CI preferidas y luego cargar tu proyecto en Pages para implementarlo.

Depura tus Functions

Durante la versión beta, aprendimos que tú y tus equipos valoran la visibilidad por encima de todo. Al igual que en Cloudflare Workers, hemos creado una manera simple para que observes tus funciones conforme procesan las solicitudes. Cuanto más rápido entiendas un problema, más rápido podrás responder.

Ahora puedes ver fácilmente los registros de tus Functions "siguiendo" tus registros. Para obtener información básica, como el resultado y la IP de la solicitud, puedes navegar hasta el panel de control de Pages para obtener registros relevantes.

Para filtros más específicos, puedes usar

wrangler pages deployment tail

para recibir contenido en directo de la consola y los registros de excepción para cada solicitud que recibe tu Function.

Métricas de Functions en tiempo real

En el panel de control, Pages añade datos para tus Functions en forma de métricas de acierto/error de la solicitud y estado de invocación. Puedes consultar tu panel de control de métricas no solo para comprender mejor tu uso por proyecto, sino también para obtener un control del estado de tus Functions mediante la captura de volúmenes de acierto/error.

Rápida integración con el ecosistema de Cloudflare

Enlaces de almacenamiento

¿Quieres un sitio realmente integral? Sabemos que encontrar una solución de almacenamiento que se adapte a tus necesidades y a tu ecosistema no es algo fácil, ¡pero no tiene por qué ser así!

Con Functions, puedes aprovechar nuestra amplia gama de productos de almacenamiento, incluidos Workers KV, Durable Objects, R2, D1 y – muy pronto – Queues y Workers Analytics Engine. Solo tienes que crear tu espacio de nombres, depósito o base de datos y añadir tu enlace en el panel de control de Pages para poner en marcha tu sitio integral con solo unos clics.

Desde añadir un sistema de comentarios rápidos hasta implementar tu propia autenticación y crear sitios de comercio electrónico respaldados por bases de datos, la integración con productos existentes en nuestra plataforma de desarrollo desbloquea un conjunto exponencial de casos de uso para tu sitio.

Enlaces secretos

Además de añadir variables de entorno que están disponibles para tu proyecto tanto en tiempo de desarrollo como de entorno de ejecución, ahora también puedes añadir "secretos" a su proyecto. Estas son variables de un entorno encriptado que ninguna interfaz de panel de control puede ver y son un lugar excelente donde alojar datos confidenciales como tokens de API o contraseñas.

Integración con servicios de terceros

Nuestro objetivo con Pages es estar siempre a tu lado cuando necesites las herramientas que te encantan usar. Durante la versión beta, también observamos algunos patrones consistentes en la forma en que estabas empleando Functions en la integración con servicios comunes de terceros. Pages Plugins, nuestros fragmentos de código listos para usar, ofrecen una experiencia plug and play para que puedas desarrollar tu ecosistema preferido en torno a tu aplicación.

En resumen, un Pages Plugin es un fragmento de código de tiempo de ejecución reutilizable, y personalizable, que se puede incorporar en cualquier lugar de la aplicación Pages. Es una Pages Function "modular", que concede a los complementos toda la eficiencia de Functions (es decir, Workers), incluida la capacidad de configurar software intermedio, rutas parametrizadas y activos estáticos.

Con Pages Plugins, puedes integrar una gran cantidad de aplicaciones de terceros, incluidas las oficialmente compatibles: Sentry, Honeycomb, Stytch, MailChannels, entre otras.

Usa tus marcos integrales favoritos

Con el fin de responder a las necesidades actuales de los desarrolladores, también hemos tenido en cuenta los marcos de Javascript. Nuestro equipo, que es un gran defensor no solo de los marcos ampliamente adoptados, sino también de los marcos emergentes, trabaja con una gran cantidad de autores de marcos para crear oportunidades que te permitan jugar con su nueva tecnología e implementar en Pages desde el momento en que esté disponible.

¡Ahora compatible con Next.js 13 y más!

Recientemente, anunciamos la compatibilidad con aplicaciones Next.js que aplican al marco Edge Runtime. Hoy nos complace anunciar la compatibilidad con Next.js 13. Next.js 13 aporta algunos de los paradigmas modernos más solicitados al marco de Next.js, incluido el enrutamiento anidado, los componentes de servidor de React 18 y la transmisión.

¿Prefieres un marco diferente? No hay problema.

Usa la opción integral de Pages para aprovechar la representación del lado servidor (SSR) con uno de los muchos otros marcos compatibles oficialmente, tales como Remix, SvelteKit, QwikCity, SolidStart, Astro y Nuxt. Puedes consultar nuestra publicación del blog sobre la compatibilidad con SSR en Pages y la forma para empezar con algunos de estos marcos.

Mayor rapidez con el modo avanzado

Si bien Pages Functions funciona con la tecnología de Workers, entendemos que, en sentido literal, no son exactamente lo mismo. Sin embargo, para los usuarios que tal vez estén usando Workers y estén interesados en probar Cloudflare Pages, tenemos una ruta directa para que se pongan en marcha rápidamente.

Si ya tienes un Worker y deseas una forma fácil de optar por la opción integral de Pages, puede usar el "modo avanzado" de Pages Function. Crea un módulo Worker ES llamado _worker.js en el directorio de salida de tu proyecto ¡e implementa!

Puede ser una práctica especialmente útil si eres autor de un marco o si tienes un caso de uso más complejo que no encaja en nuestro enrutador basado en archivos.

Escalado sin límites

Así que hoy, que anunciamos que Functions está disponible de forma general, estamos emocionado de permitir a tu tráfico escalar. Durante la versión beta abierta, impusimos un límite diario de 100 000 solicitudes gratuitas por día para que probaras la función. Si bien 100 000 solicitudes al día sigue siendo el límite gratuito hoy en día, ahora puedes pagar para no tener ningún límite.

Dado que Functions solo son Workers "especiales", a raíz de este anuncio empezarás a ver el uso de Functions reflejado en tu factura, bajo la suscripción de Workers Paid o a través de tu contrato de Workers Enterprise. Al igual que Workers, cuando estás suscrito a un plan de pago, tienes la opción de elegir entre nuestros dos modelos de uso, agrupado o ilimitado, y se te facturará según corresponda.

Pages es el "regalo de Cloudflare para Internet", y por esa razón conseguirás solicitudes ilimitadas de activos estáticos gratuitos y se te facturará principalmente por solicitudes dinámicas. Puedes consultar más información sobre cómo funciona la facturación con Functions en nuestra documentación.

Empieza hoy mismo

Para empezar, consulta los documentos de Pages Functions y nuestro blog para conocer algunos de los mejores marcos para usar en la implementación de tu primera aplicación integral. Conforme empieces a desarrollar tus proyectos, haznos saber tu opinión en el canal #functions en Pages de nuestro servidor Discord de Cloudflare Developers. ¡Feliz desarrollo!

We protect entire corporate networks, help customers build Internet-scale applications efficiently, accelerate any website or Internet application, ward off DDoS attacks, keep hackers at bay, and can help you on your journey to Zero Trust.

Visit 1.1.1.1 from any device to get started with our free app that makes your Internet faster and safer.

To learn more about our mission to help build a better Internet, start here. If you're looking for a new career direction, check out our open positions.
Developer Week (ES)Cloudflare Pages (ES)Cloudflare Workers (ES)JAMstack (ES)Español

Follow on X

Nevi Shah|@nevikashah
Cloudflare|@cloudflare

Related posts

April 05, 2024 1:01 PM

Disponibilidad general de la API Browser Rendering, implementación de Cloudflare Snippets, SWR y, por último, Workers for Platforms, que ya está al alcance de todos los usuarios

La API Browser Rendering ya está disponible para todos los clientes de pago de Workers y hemos mejorado la gestión de sesiones...

April 04, 2024 1:05 PM

Nuevas herramientas para la seguridad de la producción: implementaciones graduales, correlaciones de código fuente, limitación de velocidad y nuevos SDK

Hoy anunciamos cinco novedades que te darán más poder: implementaciones graduales, seguimientos en Tail Workers, una nueva API de limitación de velocidad, la nueva API de SDK, y actualizaciones de Durable Objects, cada una pensada con servicios de producción esenciales...

April 03, 2024 1:30 PM

R2 añade notificaciones de eventos, compatibilidad para migraciones desde Google Cloud Storage y un nivel de almacenamiento de acceso ocasional

Nos complace anunciar tres nuevas funciones de Cloudflare R2: notificaciones de eventos, compatibilidad para migraciones desde Google Cloud Storage y un nivel de almacenamiento de acceso ocasional...