Ahora que ya sabes lo que vas a construir, ¡es hora a preparar todas las herramientas que vas a necesitar!
Esta unidad te muestra cómo configurar tu entorno de desarrollo y desplegar en Netlify. Pasa a la Unidad 2 si ya te sientes cómodo con tu entorno y flujo de trabajo.
¿Quieres completar este tutorial en un editor de código en línea? Sigue las instrucciones a continuación para comenzar en Google IDX.
Usando Google IDX: ¡Sigue estas instrucciones y luego ve directamente a la Unidad 2! Configurar IDX
Sigue el enlace externo para abrir la plantilla “Empty Project” en un nuevo espacio de trabajo en IDX .
Sigue la indicación para iniciar sesión con tu cuenta de Google si aún no lo has hecho.
Ingresa un nombre para tu proyecto si deseas cambiarlo del predeterminado “Empty Project”. Haz clic en Create .
Espera a que se cree el espacio de trabajo. Esto puede tardar entre 30 y 60 segundos. Si todo va bien, verás el proyecto de Astro cargado en un editor de código en línea.
Espera a que IDX ejecute dos scripts: uno para instalar Astro y otro para iniciar el servidor de desarrollo. Ten en cuenta que puede aparecer brevemente un mensaje indicando que tu espacio de trabajo “no pudo encontrar Astro” si este se carga antes de que la instalación haya finalizado. Este mensaje puede ignorarse y cerrarse si no desaparece automáticamente.
Haz un cambio
Si todo va bien, deberías ver el código del archivo src/pages/index.astro abierto en pantalla dividida junto con una vista previa en vivo del sitio web. Sigue la instrucción para “Escribir tu primera línea de Astro” y realiza un cambio en este archivo.
Crea un repositorio de GitHub
Ve al elemento de navegación “Source Control” en la barra de menú vertical, o ábrelo con CTRL + SHIFT + G .
Selecciona la opción Publicar en GitHub . Esto creará un nuevo repositorio en tu cuenta de GitHub.
Sigue las indicaciones para iniciar sesión en tu cuenta de GitHub.
Una vez que hayas iniciado sesión, regresa a la pestaña de IDX y se te dará la opción de nombrar tu nuevo repositorio y decidir si quieres que sea privado o público. Puedes elegir cualquier nombre y tipo de repositorio para este tutorial.
IDX realizará un commit inicial y publicará el proyecto en tu nuevo repositorio de GitHub.
A partir de ahora, cada vez que tengas cambios para enviar a GitHub, el ícono de Source Control mostrará un número. Este indica la cantidad de archivos que han cambiado desde tu último commit . Navega a esta pestaña y realiza dos pasos (commit y publish ) para ingresar un mensaje de commit y actualizar tu repositorio.”
Despliega tu sitio
Si deseas implementar tu sitio en Netlify y tener una versión publicada en línea mientras trabajas, continúa en la Unidad 1 con Despliega tu sitio en la web .
De lo contrario, salta a la Unidad 2 para comenzar a crear con Astro.
En esta unidad, crearás un nuevo proyecto que estará almacenado online en GitHub y conectado a Netlify .
A medida que escribas código, enviarás periódicamente tus cambios a GitHub. Netlify utilizará los archivos de tu repositorio de GitHub para construir tu sitio web, y luego lo publicarás en Internet en una dirección única donde cualquiera podrá verlo.
Cada vez que envíes un cambio a GitHub, se enviará una notificación a Netlify. Entonces, Netlify automáticamente reconstruirá y volverá a publicar tu sitio en vivo para reflejar esos cambios.
Tutorials