Aqui los que precionamos "Guardar e implementar" antes de configurar la variable de entorno JAJAJA

Llevar un proyecto Astro a producción en Cloudflare Pages es el paso que convierte tu código en un sitio público, rápido y compartible. Aquí verás cómo conectar tu repositorio de GitHub, configurar el despliegue, enlazar un dominio propio y aprovechar la integración nativa entre Astro y Cloudflare para servir contenido estático con caché optimizado.
¿Qué necesito antes de desplegar un proyecto Astro?
Antes de mover un solo archivo a Cloudflare, asegúrate de tener tu repositorio actualizado con todos los cambios locales. Si saltas este paso, el build remoto no incluirá tus últimas modificaciones.
npm run build para detectar errores antes del despliegue [3:53].¿Qué es Cloudflare Pages? Es un servicio de Cloudflare que permite alojar sitios web estáticos con integración directa a frameworks como Astro, soporte para server side render y un sistema de caché que acelera la entrega del contenido.
Ejecutar el build localmente es tu red de seguridad. Si TypeScript, ESLint o Prettier rompen la compilación, lo verás en tu terminal antes de que el servidor remoto falle.
¿Cómo conecto mi repositorio de GitHub a Cloudflare Pages?
Dentro del panel de Cloudflare, navega a la sección de Pages y crea un nuevo proyecto con la opción Connect to Git. Si manejas varias cuentas de GitHub, puedes autorizar una organización específica, como en el caso del repositorio astrobuild.tips alojado en la cuenta de Platzi.
Al autorizar la conexión, GitHub pedirá permisos de lectura sobre los repositorios y, en algunos flujos, escritura para pull requests y deployments. Si tienes activada la autenticación de dos factores, presta atención a la confirmación.
¿Qué configuración usa Astro en el panel de Pages?
Al seleccionar el repositorio, Cloudflare detecta el framework y propone valores por defecto. Selecciona Astro en la lista y mantén los comandos sugeridos a menos que hayas modificado la estructura del proyecto.
La integración nativa entre Astro y Cloudflare evita configuraciones manuales y aprovecha el sistema de caché del proveedor para mejorar la velocidad de carga.
¿Por qué necesito la variable de entorno NODE_VERSION?
Este es el detalle que más se pasa por alto. Antes de hacer clic en Save and Deploy, debes agregar una variable de entorno llamada NODE_VERSION con la versión que recomienda la documentación oficial de Astro para Cloudflare Pages [4:53]. Sin esta variable, el build remoto fallará aunque tu código esté impecable.
¿Qué pasa si no configuro NODE_VERSION? El proceso de build se detiene porque Cloudflare usa una versión de Node incompatible con Astro. Define la variable antes del primer despliegue para evitar errores silenciosos.
Una vez guardada la configuración, Cloudflare clona el repositorio, instala dependencias, ejecuta el build y publica el resultado. El log en vivo te muestra cada paso, desde la clonación hasta el mensaje de Operación exitosa [6:18].
¿Cómo conecto un dominio propio comprado en Namecheap?
La URL que entrega Cloudflare es funcional, pero un dominio personalizado le da identidad a tu proyecto. Para astrobuild.tips se usó Namecheap, un registrador con extensiones desde un dólar al año.
El dominio personalizado no es obligatorio. Si prefieres compartir la URL temporal de Cloudflare, puedes saltarte esta sección.
¿Qué pasos sigo para vincular el dominio con Cloudflare?
El flujo combina tu cuenta de Namecheap con el panel de Cloudflare para mover la administración de DNS al mismo ecosistema donde está el sitio.
La propagación puede tardar entre dos y 48 horas, aunque suele resolverse en un par de horas cuando todo el ecosistema vive dentro de Cloudflare.
¿Cómo asigno el dominio al proyecto en Pages?
Vuelve al panel de Pages, selecciona tu proyecto y entra a la pestaña de Custom Domains. Escribe el dominio (por ejemplo, astrobuild.tips) y Cloudflare configurará automáticamente el registro necesario.
Si gestionas el DNS fuera de Cloudflare, el sistema te dará las instrucciones manuales: crear un registro CNAME con @ como nombre y la URL del proyecto como contenido, dejando el TTL en automático [10:31].
Cuando el dominio vive dentro de Cloudflare, la integración es casi inmediata e incluye un certificado SSL emitido por la misma plataforma, lo que activa HTTPS sin pasos adicionales.
¿Qué sigue después del despliegue?
Tu sitio ya es público y compartible, pero el trabajo editorial apenas empieza. Hay textos por refinar, contenido por crear y detalles que diferencian un proyecto funcional de uno realmente terminado. ¿Cuál será el primer recurso que vas a publicar en tu sitio? Cuéntalo en los comentarios.
Llevar un proyecto Astro a producción en Cloudflare Pages es el paso que convierte tu código en un sitio público, rápido y compartible. Aquí verás cómo conectar tu repositorio de GitHub, configurar el despliegue, enlazar un dominio propio y aprovechar la integración nativa entre Astro y Cloudflare para servir contenido estático con caché optimizado.
Antes de mover un solo archivo a Cloudflare, asegúrate de tener tu repositorio actualizado con todos los cambios locales. Si saltas este paso, el build remoto no incluirá tus últimas modificaciones.
npm run build para detectar errores antes del despliegue [3:53].¿Qué es Cloudflare Pages? Es un servicio de Cloudflare que permite alojar sitios web estáticos con integración directa a frameworks como Astro, soporte para server side render y un sistema de caché que acelera la entrega del contenido.
Ejecutar el build localmente es tu red de seguridad. Si TypeScript, ESLint o Prettier rompen la compilación, lo verás en tu terminal antes de que el servidor remoto falle.
Dentro del panel de Cloudflare, navega a la sección de Pages y crea un nuevo proyecto con la opción Connect to Git. Si manejas varias cuentas de GitHub, puedes autorizar una organización específica, como en el caso del repositorio astrobuild.tips alojado en la cuenta de Platzi.
Al autorizar la conexión, GitHub pedirá permisos de lectura sobre los repositorios y, en algunos flujos, escritura para pull requests y deployments. Si tienes activada la autenticación de dos factores, presta atención a la confirmación.
Al seleccionar el repositorio, Cloudflare detecta el framework y propone valores por defecto. Selecciona Astro en la lista y mantén los comandos sugeridos a menos que hayas modificado la estructura del proyecto.
La integración nativa entre Astro y Cloudflare evita configuraciones manuales y aprovecha el sistema de caché del proveedor para mejorar la velocidad de carga.
Este es el detalle que más se pasa por alto. Antes de hacer clic en Save and Deploy, debes agregar una variable de entorno llamada NODE_VERSION con la versión que recomienda la documentación oficial de Astro para Cloudflare Pages [4:53]. Sin esta variable, el build remoto fallará aunque tu código esté impecable.
¿Qué pasa si no configuro NODE_VERSION? El proceso de build se detiene porque Cloudflare usa una versión de Node incompatible con Astro. Define la variable antes del primer despliegue para evitar errores silenciosos.
Una vez guardada la configuración, Cloudflare clona el repositorio, instala dependencias, ejecuta el build y publica el resultado. El log en vivo te muestra cada paso, desde la clonación hasta el mensaje de Operación exitosa [6:18].
La URL que entrega Cloudflare es funcional, pero un dominio personalizado le da identidad a tu proyecto. Para astrobuild.tips se usó Namecheap, un registrador con extensiones desde un dólar al año.
El dominio personalizado no es obligatorio. Si prefieres compartir la URL temporal de Cloudflare, puedes saltarte esta sección.
El flujo combina tu cuenta de Namecheap con el panel de Cloudflare para mover la administración de DNS al mismo ecosistema donde está el sitio.
La propagación puede tardar entre dos y 48 horas, aunque suele resolverse en un par de horas cuando todo el ecosistema vive dentro de Cloudflare.
Vuelve al panel de Pages, selecciona tu proyecto y entra a la pestaña de Custom Domains. Escribe el dominio (por ejemplo, astrobuild.tips) y Cloudflare configurará automáticamente el registro necesario.
Si gestionas el DNS fuera de Cloudflare, el sistema te dará las instrucciones manuales: crear un registro CNAME con @ como nombre y la URL del proyecto como contenido, dejando el TTL en automático [10:31].
Cuando el dominio vive dentro de Cloudflare, la integración es casi inmediata e incluye un certificado SSL emitido por la misma plataforma, lo que activa HTTPS sin pasos adicionales.
Tu sitio ya es público y compartible, pero el trabajo editorial apenas empieza. Hay textos por refinar, contenido por crear y detalles que diferencian un proyecto funcional de uno realmente terminado. ¿Cuál será el primer recurso que vas a publicar en tu sitio? Cuéntalo en los comentarios.
Aqui los que precionamos "Guardar e implementar" antes de configurar la variable de entorno JAJAJA

Hoy 22-02-2024 no es necesario colocar el nombre de la variable, dejala por defecto!
Cloudflare es una plataforma de servicios web que proporciona una variedad de herramientas y servicios para mejorar el rendimiento, la seguridad y la confiabilidad de los sitios web. Entre sus servicios más destacados se encuentran la red de entrega de contenido (CDN), protección DDoS, administración de DNS y optimización del rendimiento.
Cloudflare puede mejorar significativamente la experiencia de usuario y la seguridad de tu sitio web desarrollado con Astro.
Mejora del Rendimiento:
CDN: Cloudflare tiene una amplia red de servidores en todo el mundo. Al utilizar su CDN, el contenido de tu sitio web se almacena en caché en servidores cercanos a tus usuarios, reduciendo el tiempo de carga de las páginas.
Optimización de imágenes: Cloudflare puede optimizar automáticamente las imágenes de tu sitio web, reduciendo el tamaño de los archivos y acelerando el tiempo de carga.
Seguridad:
Protección DDoS: Cloudflare protege tu sitio contra ataques DDoS, que pueden causar interrupciones significativas.
Firewall de Aplicaciones Web (WAF): Filtra y bloquea el tráfico malicioso para proteger tu sitio web de amenazas comunes.
Certificados SSL: Cloudflare proporciona certificados SSL gratuitos, asegurando que el tráfico entre tu sitio web y tus usuarios esté cifrado.
Fiabilidad:
Redundancia: Cloudflare mejora la disponibilidad de tu sitio web al distribuir el contenido en múltiples servidores.
Balanceo de carga: Redirige el tráfico a diferentes servidores en función de la carga y la disponibilidad, asegurando que tu sitio web se mantenga accesible incluso durante picos de tráfico.
Administración de DNS:
Configuración del DNS:
Implementación de Astro en Cloudflare Pages:
Cloudflare Pages es una plataforma de alojamiento estático gratuita que se integra perfectamente con Astro.
Puedes desplegar tu sitio Astro directamente en Cloudflare Pages, aprovechando la integración con GitHub y otras características de desarrollo continuo (CI/CD).
Crear un Proyecto en Cloudflare Pages:
Ve a la consola de Cloudflare y selecciona "Pages".
Crea un nuevo proyecto y conecta tu repositorio Git (por ejemplo, GitHub).
Configurar el Proyecto:
npm run build y el directorio de salida es dist.Desplegar el Sitio:
Cloudflare es una herramienta poderosa que puede mejorar la velocidad, seguridad y fiabilidad de tu sitio web desarrollado con Astro. Utilizando servicios como CDN, protección DDoS, administración de DNS y Cloudflare Pages, puedes asegurarte de que tu sitio web tenga un rendimiento óptimo y esté bien protegido contra amenazas.
lol por ansioso le di a "Guardar e implementar" antes de crear la variable de entorno, eso me enseñara a primero terminar de escuchar la explicación
Parece que el link de la documentacion de Cloudflare esta roto.
Hola tengo una pregunta: Si quiero crear un dashboard para un blog, donde subo mis articulos de forma dinamica; como puedo realizarlo con Astro?
Hola , tengo una consulta. Como puedo subir el proyecto a un hosting por medio de ftp? intenten subirlo pero no funciona el sitio. gracias
yo tengo hostinger sabe si se puede subir alli
y que piensan de vercel?
!Ayuda! 🙏
(pongo " , " en vez de " . ")
Compré un dominio y me di cuenta que no incluye "www" al igual que el profe https://astrobuild.tips
Decidí investigar y descubrí que podía agregarlo a través de Cloudflare, añadiendo un nuevo registro
Esto hizo que mi dominio fuera accesible mediante https//www,dominio,com, pero deja de funcionar sin "www" dominio,com Me explico: si solo escribo dominio,com, como se suele hacer las búsquedas, ejemplos (platzi,com, google,com, netflix,com, etc.), mi página no carga. Para acceder a mi sitio web, es necesario escribir www.midominio,com si no, aparece que no existe y solo existe con "www".
