📝 Note

personal/website astro/architecture

Architecture — WebSite-Astro

Liens : Decisions · Journal

Vue d’ensemble

src/
├── components/     Header, Footer, Hero, BlogCard, ProjectCard, Search (TSX), ThemeToggle
├── content/
│   ├── blog/       Articles (MDX/MD)
│   ├── pages/      about.md
│   └── projects/   ~50 notes Obsidian
├── layouts/        BaseLayout, BlogLayout, NoteLayout
├── pages/          index, about, contact, blog/[slug], projects/[slug]
├── plugins/        remarkWikiLinks.mjs
└── styles/         global.css

Composants principaux

ComposantRôle
BaseLayout.astroShell HTML, meta OG, dark mode, orbes bg, ViewTransitions
NoteLayout.astroRendu notes Obsidian avec badges type/status/date
Search.tsxRecherche client-side (React + Fuse.js)
remarkWikiLinks.mjsTransforme [[lien]] en <a href="/projects/lien">

Flux de données

Obsidian vault → export MD → src/content/projects/
Astro build → getCollection() → pages statiques
Docker build → dist/ → nginx

Dépendances externes

  • Google Fonts (Inter, JetBrains Mono)
  • GitHub: github.com/FDUBX
  • LinkedIn: linkedin.com/in/francois-dubeaux-3a9145125/

Déploiement

FROM node:22-alpine AS builder  # pnpm build
FROM nginx:alpine               # sert dist/
EXPOSE 80