116 lines
3.9 KiB
Markdown
116 lines
3.9 KiB
Markdown
# mariosant.dev
|
||
|
||
Personal site and writing log for [Marios Antonoudiou](https://mariosant.dev) — AI product engineer.
|
||
|
||
Migrated from a Nuxt 4 + `@nuxt/content` setup to **Astro 5** + **Tailwind CSS 4**, preserving every URL and the dark-mode design of the original.
|
||
|
||
## Stack
|
||
|
||
- [Astro 5](https://astro.build) — static site generation
|
||
- [Tailwind CSS 4](https://tailwindcss.com) — utility CSS
|
||
- [astro-icon](https://github.com/natemoo-re/astro-icon) — Iconify icons
|
||
- [astro-seo](https://github.com/jonasmerlin/astro-seo) — `<SEO>` component
|
||
- [@astrojs/sitemap](https://docs.astro.build/en/guides/integrations-guide/sitemap/) — sitemap
|
||
- [@astrojs/mdx](https://docs.astro.build/en/guides/integrations-guide/mdx/) — MDX content
|
||
- [Inter Variable](https://fontsource.org/fonts/inter) via `@fontsource-variable/inter`
|
||
|
||
## Scripts
|
||
|
||
```bash
|
||
pnpm install # install dependencies
|
||
pnpm dev # start the dev server at http://localhost:4321
|
||
pnpm build # build the static site to ./dist
|
||
pnpm preview # preview the built site locally
|
||
```
|
||
|
||
## Project structure
|
||
|
||
```
|
||
src/
|
||
├── components/ # Astro components
|
||
│ ├── home/ # Home page sections
|
||
│ ├── button.astro # Button primitive
|
||
│ ├── container.astro # UContainer equivalent
|
||
│ ├── footer.astro
|
||
│ ├── link.astro # ULink equivalent
|
||
│ ├── previous-role.astro
|
||
│ ├── project.astro
|
||
│ └── top-nav.astro
|
||
├── content/
|
||
│ └── articles/ # Markdown articles
|
||
├── content.config.ts # Content collection schema
|
||
├── layouts/
|
||
│ └── Layout.astro # Single layout (default + content)
|
||
├── pages/
|
||
│ ├── 404.astro
|
||
│ ├── index.astro
|
||
│ └── articles/
|
||
│ ├── index.astro
|
||
│ └── [...slug].astro
|
||
├── styles/
|
||
│ └── global.css
|
||
└── utils/
|
||
└── date.ts # "15th of June 2026" formatter
|
||
public/ # Static assets (avatar, logos, favicon)
|
||
```
|
||
|
||
## Authoring an article
|
||
|
||
1. Drop a new file in `src/content/articles/`, e.g. `2026-07-01-my-post.md`.
|
||
2. Add frontmatter that matches the schema in `src/content.config.ts`:
|
||
```yaml
|
||
---
|
||
title: My Post
|
||
date: 2026-07-01
|
||
coverImage:
|
||
author: Photographer Name
|
||
authorUrl: https://unsplash.com/@photographer # optional
|
||
url: https://images.unsplash.com/photo-...
|
||
---
|
||
```
|
||
3. Write the body in Markdown.
|
||
4. The new article will appear at `/articles/2026-07-01-my-post` and on the `/articles` index automatically.
|
||
|
||
## Deployment
|
||
|
||
The site is fully static. Build with `pnpm build` and deploy the `dist/` directory to any static host (Vercel, Netlify, Cloudflare Pages, GitHub Pages, etc.).
|
||
|
||
### Build settings (most hosts)
|
||
|
||
| Setting | Value |
|
||
|---|---|
|
||
| Build command | `pnpm build` |
|
||
| Output directory | `dist` |
|
||
| Node version | 20+ |
|
||
|
||
### Recommended cache headers
|
||
|
||
For `/_astro/*` (hashed bundles):
|
||
|
||
```
|
||
Cache-Control: public, max-age=31536000, immutable
|
||
```
|
||
|
||
For `/articles/*` (HTML, sitemap-referenced):
|
||
|
||
```
|
||
Cache-Control: public, max-age=3600, must-revalidate
|
||
```
|
||
|
||
Configure these via your host's preferred mechanism (`vercel.json`, `_headers` for Netlify, `_headers` for Cloudflare Pages, etc.).
|
||
|
||
### SEO surface
|
||
|
||
- `sitemap-index.xml` + `sitemap-0.xml` — auto-generated by `@astrojs/sitemap`, all 13 routes
|
||
- `robots.txt` — points at the sitemap
|
||
- `rss.xml` — feed of all articles
|
||
- JSON-LD `Person` schema on the home page
|
||
- JSON-LD `Article` + `BreadcrumbList` schema on each article page
|
||
- Open Graph + Twitter Card meta on every page
|
||
- Canonical URLs on every page
|
||
- `<link rel="alternate" type="application/rss+xml">` autodiscovery
|
||
|
||
### Open Graph image
|
||
|
||
The default OG image is `public/mariosant.webp` (a 512×512 avatar). For best display on Twitter/LinkedIn (1200×630 recommended), drop a `public/og-image.png` and update `src/utils/seo.ts`'s default or pass it explicitly to the `Layout`.
|