astro portfolio

? Esta es una plantilla gratuita para crear el sitio web de su cartera utilizando Astro 4.0 + Tailwind CSS .

modo oscuro

Modo de luz

Informe del faro

Tabla de contenido

• Manifestación
• Características
• Estructura del proyecto
• Comandos
• Contribuyendo
• Créditos

Manifestación

? https://astro-fe-portfolio.netlify.app/

Características

✔️ Integración con Tailwind CSS (@astrojs/tailwind) que admite el modo oscuro .

✔️ Utiliza las siguientes integraciones:

• @astrojs/mdx
• @astrojs/imagen
• @astrojs/tailwind - con un complemento de clasificación de clases más bonito
• @astro-icono
• @astro-seo
• @astro-navbar

✔️(@Playwright) Se configuran las pruebas e2e.

Blog con frontmatter (título, descripción, autor, fecha, imagen, etiquetas) y feed RSS, mapa del sitio y robots.txt

página de error 404

Estructura del proyecto

Dentro de su proyecto Astro, verá las siguientes carpetas y archivos:

 /
├── public/
│   └── favicon.ico
|   ├── hero.png
|   └── ...
├── src/
|   ├── assets/
|   |   ├── images/
│   │   |   ├── hero.png
|   |   |   └── ...
│   ├── components/
│   │   ├── ui/
│   │   |   ├── BackToTop.astro
|   |   |   └── ...
│   │   ├── About.astro
│   │   ├── Contact.astro
|   |   └── ...
│   ├── content/
│   │   ├── projects/
│   │   │   ├── project-1.md
│   │   │   ├── project-1.md
│   │   │   └── ...
│   │   └-- config.ts
│   ├── layouts/
│   │   ├── Layout.astro
│   ├── pages/
│   │   ├── index.astro
│   ├── tests/
│   │   ├── index.spec.ts
├── package.json
├── astro.config.mjs
└── ...

Astro busca archivos .astro , .md o .mdx en el directorio src/pages/ . Cada página se expone como una ruta según su nombre de archivo.

src/components/ es donde colocamos los componentes de Astro y de manera similar src/layouts/ para los diseños.

Las imágenes se pueden colocar en src/images/ .

El contenido del blog y la documentación se crean como colecciones de archivos Markdown o MDX en src/content .

Cualquier activo estático, por ejemplo. imágenes, se pueden colocar en el directorio public/ .

Comandos

Todos los comandos se ejecutan desde la raíz del proyecto, desde una terminal:

Dominio	Acción
yarn	Instala dependencias
yarn dev	Inicia el servidor de desarrollo local en localhost:3000
yarn build	Construya su sitio de producción en ./dist/
yarn preview	Obtenga una vista previa de su compilación localmente, antes de implementarla
yarn astro ...	Ejecute comandos CLI como astro add , astro preview
yarn astro --help	Obtenga ayuda para usar Astro CLI
yarn test:e2e	Ejecutar pruebas de dramaturgo

Contribuyendo

Si tiene alguna idea, sugerencia o encuentra algún error, no dude en abrir una discusión, un problema o crear una solicitud de extracción. Esto sería muy útil para todos nosotros y estaremos encantados de escucharlo y actuar.

Créditos

Activos diseñados por (Freepik)[www.freepik.com].