Página personal de presentación de Sergio C. Orozco Torres
Practicar el desarrollo front-end para fortalecer habilidades y tener una plantilla base en caso que requiera iniciar otro desarrollo similar
Desarrollar un sitio web informativo que demuestre los conocimientos y habilidades en desarrollo web de Sergio Orozco Torres
- Presentarme como persona y desarrollador web
- Compartir todo lo que he aprendido ya sea a traves del blog o del portafolio de experiencias
- Demostrar buenas practicas a través del código fuente de la página
En este enlace al archivo contributing.md puedes ver como contribuir con el mejoramiento de este proyecto
En este enlace al archivo security.md puedes ver como puedes reportar un issue de seguridad
Copyright 2023 Scot3004. Este código es lanzado bajo licencia MIT, también puedes ver los términos de la licencia MIT traducidos al español
Puedes ejecutar estos comandos en la carpeta raíz del proyecto:
| Command | Action |
|---|---|
npm install |
Instala las dependencias |
npm run dev |
Ejecuta el dev server en localhost:4321 |
npm run build |
Construye el sitio para produccion en ./dist/ |
npm run preview |
Previsualiza la compilacion localmente |
npm run astro ... |
Ejecuta commandos de Astro CLI como astro add, astro check |
npm run astro -- --help |
Obtener ayuda sobre Astro CLI |
Primero actualizar astro que su script de actualización ayuda para actualizar configuraciones
npx @astrojs/upgrade
Actualizar otros paquetes
npx npm-check-updates -u
Integración Continua (Playwright + Netlify)
- Runner script: El pipeline invoca
node .github/scripts/wait-netlify-runner.js, que llama internamente arunAndExit()del scriptwait-netlify.jssólo cuando se ejecuta directamente. Esto evita problemas con exports mutables y mejora testabilidad. - COMMIT_ID: El workflow inyecta
COMMIT_IDcon el SHA del PR (o del push).wait-netlifyusaCOMMIT_IDpara encontrar el deploy que coincide con el commit y exportaNETLIFY_PREVIEW_URLal entorno de GitHub Actions. - Requisitos: El runner requiere Node >= 20 (según
engines.nodeenpackage.json) para el soporte global defetcho que esté disponible en el entorno.
Ejecutar localmente:
| Command | Acción |
|---|---|
npm run test |
Ejecuta las pruebas E2E (Playwright/Cypress según configuración) |
npm run test:unit |
Ejecuta las pruebas unitarias con Vitest |
En CI el workflow Tests corre dos jobs en paralelo:
unit-tests: ejecutavitest --run --coveragey sube el artifactvitest-coverage/(contienelcov.info)e2e-tests: ejecuta las pruebas E2E con Playwright y sube el reporteplaywright-report/
Así las unit y las E2E corren en paralelo y la cobertura la genera únicamente el job unit-tests.
Cómo ejecutar E2E localmente con variables de entorno
npm run test:e2e— Ejecuta Playwright directamente (npx playwright test). Este comando no carga.envautomáticamente; si necesitas pasarNETLIFY_PREVIEW_URLu otras variables, expórtalas en la misma línea o en tu entorno.npm run test:e2e:env— Ejecuta Playwright conenv-cmdvíanpxy la opción-f .env. Esta opción carga.envautomáticamente y evita tener que exportar variables manualmente.
Ejemplos rápidos:
- Exportar en shells POSIX y ejecutar (no requiere
env-cmd):
NETLIFY_PREVIEW_URL=https://preview.example.com npm run test:e2e- En PowerShell:
$Env:NETLIFY_PREVIEW_URL = 'https://preview.example.com'
npm run test:e2e- Usar el script que carga
.envconenv-cmd(no requiere instalación global):
npm run test:e2e:envNota: test:e2e:env usa npx env-cmd para cargar .env; test:e2e es minimalista y ejecuta Playwright directamente.
Si prefieres ejecutar las pruebas dentro del devcontainer, abre una terminal del contenedor y ejecuta una sola vez:
npx playwright install --with-depsEsto instala los navegadores y las dependencias del sistema necesarias para que Playwright ejecute tests dentro del contenedor. Después de esto puedes usar npm run test:e2e desde la terminal del devcontainer sin pasos adicionales.