Portfolio Web - Asis Ferrer

Portfolio profesional desarrollado con Astro, Tailwind CSS y TypeScript. Presenta experiencia, habilidades, proyectos y datos de contacto de Asis Ferrer, SysAdmin y Desarrollador Web Full Stack.

🚀 Estructura del Proyecto

/
├── public/
├── src/
│   ├── assets/
│   ├── components/
│   │   ├── About.astro
│   │   ├── Experience.astro
│   │   ├── Footer.astro
│   │   ├── Header.astro
│   │   ├── Hero.astro
│   │   ├── Projects.astro
│   │   ├── Skills.astro
│   │   └── ui/
│   ├── data/
│   │   └── index.ts
│   ├── icons/
│   ├── layouts/
│   │   └── Layout.astro
│   ├── lib/
│   ├── pages/
│   │   └── index.astro
│   └── styles/
│       └── global.css
├── astro.config.mjs
├── biome.json
├── Dockerfile
├── package.json
├── pnpm-lock.yaml
├── pnpm-workspace.yaml
├── tsconfig.json
└── README.md

🛠️ Tecnologías principales

Astro: Framework para sitios web rápidos y modernos.
Tailwind CSS: Utilidades CSS para diseño responsivo y moderno.
TypeScript: Tipado estático para JavaScript.
Docker: Contenedores para desarrollo y despliegue.
Biome: Formateo y linting de código.

✨ Funcionalidades

Presentación profesional con sección de héroe.
Experiencia laboral detallada.
Habilidades técnicas con iconos y tooltips.
Sección "Acerca de mí".
Footer con información de autor y año.

🔨 Desarrollo en entorno DevContainer

Este proyecto incluye configuración para desarrollo en contenedor usando DevContainer.

Abre el proyecto en VS Code y selecciona "Reopen in Container".
El entorno instalará dependencias automáticamente (pnpm i) y lanzará el servidor de desarrollo (pnpm dev).
El puerto 4321 estará disponible para acceder a la app desde tu navegador.

Personalización del DevContainer

Archivo de configuración: .devcontainer/devcontainer.json
Extensiones recomendadas: Astro, Tailwind CSS, Biome
Usuario: node

📦 Instalación y uso manual

Instala dependencias:
```
pnpm install
```
Inicia el servidor de desarrollo:
```
pnpm dev
```
Compila para producción:
```
pnpm build
```
Previsualiza el sitio compilado:
```
pnpm preview
```

🚢 Crear imagen Docker y desplegar

Construye la imagen Docker:
```
docker build -t portfolio-astro .
```
Ejecuta el contenedor:
```
docker run -p 8080:80 portfolio-astro
```
Accede a la web en http://localhost:8080

La imagen usa Apache para servir el contenido estático generado en dist/.

🧑‍ Scripts útiles

Comando	Acción
`pnpm install`	Instala dependencias
`pnpm dev`	Inicia servidor local en `localhost:4321`
`pnpm build`	Compila el sitio en `./dist/`
`pnpm preview`	Previsualiza el sitio compilado
`pnpm astro ...`	Ejecuta comandos CLI de Astro
`pnpm astro -- --help`	Ayuda sobre la CLI de Astro
`pnpm biome:format`	Formatea el código con Biome
`pnpm biome:lint`	Linting del código con Biome
`pnpm biome:all`	Formatea y linting con Biome

👤 Autor

Nombre: Asis Ferrer
Título: SysAdmin & Desarrollador Web Full Stack
Bio: Apasionado por la tecnología y el desarrollo, SysAdmin con sólida experiencia en administración de sistemas y redes, adentrándose en el desarrollo web full stack.
Email: info@aferrer.dev
LinkedIn: linkedin.com/in/asis-ferrer

4.1 KiB Raw Blame History Unescape Escape