Fixed gluetun version

The pinned nuxt ^3.14.159 never resolved a fuse.js version satisfying
@vueuse/integrations' optional peer dependency (fuse.js ^7), used by
Docus's search component. A clean install would crash rendering any
page. Matching main's nuxt version pulls in @nuxt/cli's own fuse.js
^7.4.2, which npm hoists and that satisfies the peer.

.eslintrc.cjs

@@ -0,0 +1,14 @@
+module.exports = {
+  root: true,
+  extends: ['@nuxt/eslint-config'],
+  ignorePatterns: [
+    'dist',
+    'node_modules',
+    '.output',
+    '.nuxt'
+  ],
+  rules: {
+    'vue/max-attributes-per-line': 'off',
+    'vue/multi-word-component-names': 'off'
+  }
+}

.gitea/workflows/trigger-build.yml

@@ -1,27 +0,0 @@
-name: Trigger container build
-
-on:
-  push:
-    branches: [main]
-    paths:
-      - 'content/**'
-      - 'app/**'
-      - 'public/**'
-      - 'server/**'
-      - 'nuxt.config.ts'
-      - 'content.config.ts'
-      - 'tsconfig.json'
-      - 'package.json'
-      - 'package-lock.json'
-
-jobs:
-  trigger:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Dispatch docudjeex-build
-        run: |
-          curl -sf -X POST \
-            -H "Authorization: token ${{ secrets.BUILD_REPO_TOKEN }}" \
-            -H "Content-Type: application/json" \
-            -d "{\"ref\":\"main\",\"inputs\":{\"source_sha\":\"${{ github.sha }}\"}}" \
-            "https://git.djeex.fr/api/v1/repos/Djeex/docudjeex-build/actions/workflows/build.yml/dispatches"

.gitignore

@@ -1,44 +1,12 @@
-# Nuxt dev/build outputs
-.output
-.data
-.nuxt
-.nitro
-.cache
-dist
-
-# Node dependencies
 node_modules
-
-# Logs
-logs
-*.log
-
-# Misc
-.DS_Store
-.fleet
+*.iml
 .idea
-.eslintcache
-
-# Local env files
+*.log*
+.nuxt
+.vscode
+.DS_Store
+coverage
+dist
+sw.*
 .env
-.env.*
-!.env.example
-
-# npm pack
-*.tgz
-
-# Temp files
-.tmp
-.profile
-*.0x
-
-#VSC
-.history
-.wrangler
-
-# Python
-__pycache__
-*.pyc
-
-# Scratch/demo files (not part of the site)
-scratch
+.output

.npmrc

@@ -0,0 +1 @@
+strict-peer-dependencies=false

CUSTOMIZATIONS.md

@@ -1,83 +0,0 @@
-# Customizations over base Docus
-
-This project starts from the `docus` i18n starter template (`extends: ['docus']` in `nuxt.config.ts`, Docus v5.x on Nuxt ^4.4.8). This file tracks everything added or changed on top of that base, and *why*, so a future contributor doesn't have to diff `node_modules/docus` to find out.
-
-## Packages
-
-- **`better-sqlite3`** — Nuxt Content v3 stores all parsed markdown content in a local SQLite database (`.data/content/contents.sqlite`) using its own DB layer (`db0`) rather than reading files at request time. `db0` needs an actual SQLite driver to talk to that file, and lists `better-sqlite3` as a *peer* dependency (alongside alternatives like `sqlite3` or `@libsql/client`) — peer dependencies aren't auto-installed by npm, so without declaring it explicitly, `@nuxt/content` has no driver to write to and the local content database silently fails to build.
-- **`@nuxtjs/i18n`** module added explicitly in `nuxt.config.ts`. The starter ships an i18n-*shaped* content structure (`content/en/`, `content/fr/`) out of the box, but that's just a folder convention — nothing routes `/fr/...` URLs, switches locales, or auto-detects the browser's language unless the module itself is registered.
-
-## `nuxt.config.ts`
-
-- **Git-based page contributors.** `getContributors()` runs `git log --format=%an --follow -- <file>` for each markdown file and dedupes the author list, injected into the page's content via the `content:file:afterParse` hook. This was chosen over the Gitea/GitHub API because it needs no access token, no network call, and no rate limiting — the info is already in the checkout. The trade-off: CI must do a **full** (non-shallow) `git checkout`, otherwise `git log` only sees one commit per file and every page shows just its most recent author instead of everyone who ever touched it.
-- **`@nuxt/image` dir is always an absolute path.** An earlier revision branched this on `nuxi dev` vs a production build, passing the plain relative string `'public/'` in production on the theory that an absolute path there broke the `/_ipx` route's SVG `Content-Type`. In production that relative path doesn't reliably resolve to the project root at the moment the prerender crawler actually requests an `/_ipx/*` URL. The real-world result was every single image on the site 404ing (`IPX_FILE_NOT_FOUND`) in a from-scratch production build, not a content-type quirk on some of them. Always resolving the absolute path (`fileURLToPath(new URL('./public', import.meta.url))`) fixed it in both modes; since the whole site is prerendered to static files anyway, each image's correct extension is what actually decides its serving content-type, not this setting.
-- **`icon.serverBundle.collections`.** Every icon collection referenced dynamically (built from a variable/string at runtime rather than written as a literal `i-xxx` somewhere) has to be listed here explicitly, or Nuxt Icon's static usage scanner never finds it and falls back to a live `api.iconify.design` request at prerender time, which times out (`[Icon] loading icon X timed out`) wherever outbound network access is restricted, exactly as it was on the actual deployment host. Two places build icon names this way: `app/app.config.ts`'s `ui.prose.codeIcon` map (`simple-icons`, `lucide`) and `app/components/content/FileTreeNode.vue`'s per-extension file-type icons (`vscode-icons`). Add any new collection here the moment a new dynamic icon source is introduced. Check it's actually installed first with `ls node_modules/@iconify-json/`.
-- **`components:` array: keep `'~/components'` as the first entry.** Passing a `components` array to Nuxt *replaces* its default `~/components` auto-scan instead of adding to it. Every local override in `app/components/` (`AppHeaderCenter`, `DocsAsideLeftTop`, etc., all documented below) was silently shadowed by the docus layer's originals the moment a custom array was added without also re-listing the default scan. The override files were still there, just never picked up. The second entry, `{ path: '~/components/prose', pathPrefix: false, global: true }`, exists because `ProseNote`/`ProseTip`/`ProseWarning`/`ProseCaution` are *only* ever resolved dynamically by name from Nuxt Content's MDC tag map (`note` → `ProseNote`, etc.), and nothing statically writes `<ProseNote>` in a template, so Vite's production build tree-shook all four out of both the client and server bundles entirely, and every admonition on the live site rendered as a raw, unstyled `<ProseNote icon to="...">` tag instead of the actual callout. `nuxt dev` never surfaces either of these: it doesn't tree-shake, and it resolves components on demand regardless of the scan config.
-- **Custom icon collection.** `icon.customCollections` registers a `brand` prefix pointing at `app/assets/brand-icons/`, so logos for the user's other projects (Instameex, Lumeex) can be referenced from content as `i-brand-instameex` etc., exactly like any Iconify icon — without needing to publish them to an actual Iconify icon set first.
-- **Markdown highlight.** Forces the `github-dark` Shiki theme for *both* the light and dark slots, because the site never actually offers a light mode (see `docus.colorMode: 'dark'` below) — maintaining two highlight themes for a mode nobody sees would just be dead config. The extra languages (`nginx, properties, php, toml, console, sh, yaml`) were added because the tutorial content includes config-file snippets and terminal output in all of these syntaxes, and none of them are in Shiki's minimal default bundle for Nuxt Content.
-- **`darkreader-lock` meta tag.** The Dark Reader browser extension rewrites elements' inline `style` attributes on the client, after Nuxt has already server-rendered them — so any component using an inline `style` (like the cyan "·" separator spans) ends up with mismatched HTML between server and client, and Vue logs a hydration-mismatch warning on every page load for any visitor running that extension. This meta tag is Dark Reader's own opt-out signal, telling the extension to leave the page alone instead of trying to work around the mismatch after the fact.
-- **301 redirects (`routeRules`).** The old site (pre-rewrite, on the separate `docudjeex` repo's `main`/`french` branches) served English at the site root with no locale prefix (`/serveex/introduction/`) and French under `/fr/` with French-language slugs (`/fr/serveex/coeur/installation/`). This rewrite moved every URL under an explicit `/en/`/`/fr/` prefix with English-based slugs on both, which would otherwise break every external link, bookmark, and search-engine ranking built up on the old URLs. All 72 mappings use `statusCode: 301` explicitly, since Nitro's default redirect status is 307 (temporary), which search engines don't treat as "please re-index this at the new URL" the way a 301 (permanent) does. French pages whose old slug already matches the new one (`dozzle`, `immich`, and similar words that are spelled the same in both languages) are deliberately absent, since a rule there would redirect the page to itself. See the warning callout above this section: none of these 72 rules produce a real 301 on the actual production host, only a `location =` block in that host's nginx config does.
-- **`site.trailingSlash: true`.** The site builds as a static export (`nuxt build`, deployed as static files on a web server) and the production host 301-redirects a bare `path` request to `path/` (verified against `docu.djeex.fr`), so canonical/og:url/sitemap URLs need to already carry the trailing slash — otherwise the canonical tag points at the very URL the server redirects away from, a loop that keeps the page out of search results. This is documented, official behavior for the wider Nuxt SEO ecosystem (`nuxtseo.com`'s "Trailing Slashes" guide), but Docus doesn't depend on `nuxt-seo-utils` for its canonical/og:url logic — it hand-rolls its own in `useSeo.ts` via a plain `joinURL(site.url, route.path)` that never checks this setting. That gap is why the items below exist alongside it.
-- **`nitro.prerender.autoSubfolderIndex: true`.** Docus sets this to `false` in its own `nuxt.config.ts`, which writes every route as `path.html` instead of `path/index.html` — the exact opposite of what the trailing-slash setup above needs, since the host would then redirect `/path` to `/path/` and find no directory there. Restoring the Nitro default puts the files back where the advertised URLs actually point.
-- **`nitro.prerender.routes: ['/', '/robots.txt']`.** Docus's `nitro:config` hook seeds one prerender route per locale (`/en`, `/fr`) and `/sitemap.xml`, but never `/robots.txt`. It exists as a server route yet was never written to the static output, so it 404s on a static host and loses the `Sitemap:` line that points crawlers at the sitemap. `/` is listed too, though it turns out this doesn't actually matter: Nitro's crawler always visits `/` on its own regardless (it's the crawl's entry point), confirmed by removing it from this array and finding it prerendered anyway. `@nuxtjs/i18n`'s `detectBrowserLanguage` never actually runs on this static host: `/` is baked as a static `<meta http-equiv="refresh">` stub whose target is a fixed string decided once at build time (`defaultLocale: 'en'`), not read per visitor, and Nitro bakes *any* route carrying a `redirect` routeRule the same way, with no real HTTP status. The real 301 for `/` lives in the production host's nginx config instead, see the warning callout above.
-- **`experimental.defaults.nuxtLink.trailingSlash: 'append'`.** The native Nuxt-core (not `@nuxtjs/i18n`'s own, separate `trailingSlash` option — that one only affects `switchLocalePath()` and double-appends the slash on hreflang alternate links) way to make every `<NuxtLink>` href, including the ones i18n's `switchLocalePath` builds for hreflang tags, resolve with a trailing slash already, matching both `site.trailingSlash` and the directory-style files on disk.
-
-> **Do not add a global trailing-slash redirect middleware here.** An earlier revision had `app/middleware/trailing-slash.global.ts` 301-redirecting bare paths to their slash form. It broke the production build outright: Nitro's prerender crawler seeds on `/en` and `/fr`, the middleware turned both into redirect responses, and since Nitro extracts no links from a redirect the crawl stopped immediately — 31 routes and 22 HTML files instead of 557 and 146, with every content page missing. The host already performs that redirect server-side, so the middleware bought nothing.
-
-> **A `routeRules` redirect can't produce a real HTTP redirect on this deployment.** The production host serves this site as plain static files (nginx `root` + `try_files`, no `proxy_pass` to a running Nuxt/Nitro process at all). Any route with a `redirect` rule still gets crawled and prerendered like any other page, but since a static file can't carry a custom HTTP status, Nitro bakes it as a client-side `<meta http-equiv="refresh">` stub instead. That's invisible to anything that doesn't execute the page (search-engine link-equity, most link-preview tools, `curl`). This was tried for `/` (redirecting to `/en/`) and reverted after confirming the real 301 only appears when running `node .output/server/index.mjs` directly, never through the actual production nginx config. The 72 legacy-URL redirects in `routeRules` below have the exact same limitation: they were made real 301s by adding matching `location = /path { return 301 ...; }` blocks directly in the site's nginx config, outside this repo entirely, not by anything in `nuxt.config.ts`. If this project ever moves to a host that runs the Nitro server itself instead of serving `.output/public` as static files, all of this becomes unnecessary and `routeRules` redirects will work as real 301s on their own.
-
-## `server/routes/sitemap.xml.ts`
-
-Overrides Docus's own `sitemap.xml` route (`node_modules/docus/server/routes/sitemap.xml.ts`), for two reasons:
-
-- Docus's version resolves the site URL via `inferSiteURL()`, which only reads deployment-platform env vars (Vercel/Netlify/Cloudflare Pages, or `NUXT_PUBLIC_SITE_URL`/`NUXT_SITE_URL`) — never the `site.url` set in this project's `nuxt.config.ts`. In `nuxt dev` none of those env vars exist, so every `<loc>` came out as a bare relative path instead of an absolute URL, which is invalid per the sitemap spec.
-- Even where that env var happens to be set, Docus's version builds each `<loc>` with plain string concatenation and has no concept of `site.trailingSlash` at all, so it could never match the trailing-slash canonical/og:url above.
-
-This override is otherwise a straight copy of Docus's route, with the URL-building swapped for `createSitePathResolver()` (from `nuxt-site-config`), which resolves from the same `site` config as canonical/og:url and honors `trailingSlash` correctly.
-
-## `content.config.ts`
-
-Nuxt Content validates every page's frontmatter against a Zod schema per collection, and **silently drops any key that isn't declared in that schema** — it doesn't error, the field just isn't there at render time. This file reimplements docus's own `createDocsSchema()` (not something the `docus` package actually exports, so it has to be copied rather than imported) and extends it with the custom frontmatter toggles the page template relies on:
-
-- `hideHeader` — skip the title/description block on a page (used for pages that want a custom hero instead of the standard header).
-- `hideCopyPage` — hide the "Copy page" button group (for pages where "copy as markdown for an LLM" doesn't make sense).
-- `hideToc` — hide the right-hand table of contents (for short pages where a TOC would be mostly empty space).
-- `contributors` — the array populated by the `getContributors()` hook above; without this line in the schema, the hook's output would be computed and then thrown away.
-
-This was a real bug during development: `hideHeader`/`hideCopyPage` did nothing at all until this schema was extended, because the fields were being stripped before the page component ever saw them.
-
-## `app/app.config.ts`
-
-The old production site (`docu.djeex.fr`) has an established visual identity that a "generic Nuxt UI theme" migration would have lost. These overrides were measured directly against the live old site (colors picked from its actual computed styles, not eyeballed) so the new stack keeps the same look rather than just being *a* documentation theme:
-
-- `docus.colorMode: 'dark'` — the old site never had a light mode either; hard-locking it here removes the need for the toggle UI and light-theme variants entirely, rather than half-supporting a mode nobody uses.
-- `ui.colors`: primary `cyan`, neutral `zinc` — the site's brand accent color and its neutral gray scale.
-- `ui.prose.card` / `ui.prose.pre` / `ui.header` / `ui.contentSearchButton` / `ui.contentSurround` / `ui.kbd`: exact background/border hex values (a shared `rgba(12,13,12,0.8)` translucent-dark family, e.g. `#121110` borders) matching the old site's card, code-block, header, search button, and prev/next-link chrome, since Nuxt UI's defaults use a different neutral scale that didn't match.
-- `ui.prose.callout.compoundVariants`: exact colors for all four admonition severities (info/success/warning/error), overriding Nuxt UI's default callout palette so `::note`, `::tip`, `::warning`, `::caution` render in the same colors the old site's `::alert` boxes used, rather than Nuxt UI's stock blue/green/amber/red.
-- `toc.bottom.links` / `toc.bottom.title` — no component override needed for this one: Docus's own `DocsAsideRightBottom.vue` already reads `appConfig.toc?.bottom?.links` and renders them via `UPageLinks` under the right-hand table of contents, it's just never set by default. This surfaces the same "other projects" links (git.djeex.fr, Lumeex, Instameex) shown on the landing page's "Other dumb things" section, at the bottom of every doc page's TOC too, instead of only being visible from the homepage.
-
-## Custom / overridden components (`app/components/`)
-
-Nuxt's convention is that a file at `app/components/<any-subfolder>/<ExactComponentName>.vue` overrides a layer's (here, docus's) auto-registered component of the same name — no explicit registration needed, just matching the filename. Each one below was diffed against the actual stock file in `node_modules/docus` to confirm it's a real, deliberate change and not an accidental untouched copy:
-
-- **`app/AppHeader.vue`** — added a Gitea social icon link alongside the stock GitHub link. The project's canonical repository lives on the user's self-hosted Gitea instance; GitHub is only a mirror, so a GitHub-only link would point visitors to the secondary copy.
-- **`app/AppHeaderCenter.vue`** — the most heavily rewritten component. Stock Docus sizes the header's nav menu to the header's own container width, but this site's actual docs pages use a narrower, off-center content column (a two-level 10-column grid: an outer sidebar column plus an inner article/TOC split) — so the stock menu didn't visually line up under the content it was supposed to sit above. This override renders the nav as an absolutely-positioned overlay that replicates that exact two-level grid, so it lines up with the real article column instead of the header's own slot. Also fixes a real bug found during development: `pointer-events-auto` was originally applied to the full-width wrapper div, which silently blocked clicks on the logo and the right-side icons (search, color mode, socials) everywhere *except* the homepage (a different code path with an empty nav). It's now scoped to only the innermost column div that actually contains clickable content.
-- **`app/AppHeaderBottom.vue`** — emptied to a no-op `<div />`. Once navigation moved into `AppHeaderCenter` above, the stock second nav row would have shown the same links twice and wasted vertical space in the header.
-- **`docs/DocsAsideLeftBody.vue`** — the left doc-tree sidebar is now collapsible and closed by default (stock: always fully expanded, not collapsible). With this site's number of nested sections, a fully-expanded tree was one very long scrollable list on every page load; collapsed-by-default lets a visitor see the top-level structure first and open only the section they need.
-- **`docs/DocsAsideLeftTop.vue`** — added a full-width search button above the sidebar for the header-based subnav mode (stock rendered nothing there in that mode, only in the "aside" subnav mode). Without it, visitors on pages using header-mode subnav had no visible way to open search from the sidebar area at all.
-- **`docs/DocsPageHeaderLinks.vue`** — gave the "Copy page" button group the same translucent-dark card styling used everywhere else on the site. Purely cosmetic: the stock Nuxt UI button styling didn't match the rest of the page chrome and stood out as an unstyled default.
-- **`prose/ProseNote.vue`, `ProseTip.vue`, `ProseWarning.vue`, `ProseCaution.vue`** (new files, no stock equivalent to override against — these are thin wrappers around Nuxt UI's own `Callout.vue`). Nuxt UI's admonition icon is normally set once, globally, per icon slot — there's no built-in way to omit it on just one specific admonition without changing it for every admonition of that type site-wide. These wrappers read an optional `icon` prop so a single instance can hide its icon (`::note{icon=""}`) when the emoji or leading text already conveys the same meaning, while every other `::note` on the site keeps its default icon.
-- **`content/Ellipsis.vue`** (new; no Docus or Nuxt UI equivalent exists at all). The old site had a decorative blurred gradient glow behind section headers, and reproducing the content 1:1 meant this cosmetic effect needed *some* markdown-usable component to exist, since neither Docus nor Nuxt UI ships anything similar. Registered as the inline MDC component `:ellipsis{left= width= top= blur= zIndex=}`, used across content wherever the old site had that effect.
-- **`OgImage/Docs.takumi.vue`** — overrides Docus's default `og:image` template used for every doc page's social-preview image. Stock Docus renders it on a generic `bg-neutral-950` with a plain white corner flare, in whatever font the takumi renderer defaults to; this swaps in the site's actual near-black background (`#0B0A0A`, matching `app.css`), a blurred oval reproducing the exact colors and diagonal gradient of the site's own `:ellipsis` component instead of the white flare, **Roboto** as the font (the site itself renders in the browser's own `system-ui`, which can't be embedded server-side since it resolves to a different, non-redistributable font per OS — Roboto was picked as Android's system font, the single most common one), and the site's own logo (bottom-left) in place of the plain site-name text. Two non-obvious takumi rendering gotchas found in the process: an injected SVG's XML prolog and comments render as literal visible text instead of being silently ignored like a browser's `innerHTML` would, and a `<style>` block's CSS class rules aren't resolved at all (paths fell back to default black fill) — both needed stripping/inlining by hand in `fetchLogoSvg()` before the SVG string reaches `v-html`. `content/en/index.md` and `content/fr/index.md` skip this template entirely via the `seo.ogImage` frontmatter key (Docus's `landing.vue` checks for it and falls back to a fixed `/img/social.png` instead of generating one), since the homepage's own hero doesn't fit this per-doc-page layout.
-- **`content/FileTree.vue` + `content/FileTreeNode.vue`** (new; no Docus or Nuxt UI equivalent exists at all). Every install guide used to show its folder layout as a plain ASCII-art code fence (`└──`/`├──`); this renders the same information as an actual tree with per-entry folder/file icons instead, reusing the exact filename/extension icon lookup `CodeIcon.vue` already does for labeled code fences, so a `.env` or `.conf` gets the same icon here as in a fence header. Registered as the container component `::file-tree`, fed through a YAML props block (`remark-mdc`'s `---\n...\n---` syntax) rather than a nested markdown list, since the data (name, whether it's a folder, its children) doesn't map cleanly onto list semantics otherwise. A trailing `/` on a plain string marks an otherwise-childless folder (a mapping key is unambiguously a folder already); a trailing `" # comment"` on either form renders as a dimmed, italic aside, matching a real code comment without being one (an actual unquoted YAML `#` would just be stripped by the parser before the component ever saw it). The header doubles as a collapse toggle (`collapsed` prop sets the initial state only), and clicking any row copies that entry's full path to the clipboard.
-
-## Page-level features (`app/pages/[[lang]]/[...slug].vue`)
-
-This catch-all page isn't a docus override (docus doesn't ship one to override — this project defines its own), but it layers frontmatter-driven behavior on top of stock Nuxt Content rendering:
-
-- `hideHeader` / `hideCopyPage` / `hideToc` — read the three frontmatter toggles declared in `content.config.ts` above and conditionally skip rendering each block.
-- **Contributors + history block.** Below the "Edit this page" / "Report an issue" links, renders "Contributor(s): <names>" from the `contributors` frontmatter field (populated by the git-log hook), with the names linking to that specific file's Gitea commit history. The goal is to give credit to everyone who's worked on a page — not just whoever last edited it — and let a reader jump straight to the full history of a page without leaving the site or knowing the underlying file path.
-
-## License
-
-MIT (see `LICENSE`), same as the Docus theme this project is built on.

FUNCTIONAL-CHANGELOG.md

@@ -1,71 +0,0 @@
-# Functional changelog: site redesign (September 2026)
-
-This document lists every change a visitor would actually notice between the old version of docu.djeex.fr and the new one. It does not cover technical implementation details, only what changed in the content and in using the site.
-
-## New articles
-
-- **"Linux tips for dummies" section** (under General): three new beginner-friendly articles on the Linux terminal.
-  - *CLI basics*: how a Linux command is built, with worked examples, plus a cheat-sheet table explaining where each common command's name comes from (`cd` for *change directory*, `ls` for *list*, and so on).
-  - *Filesystem*: Debian's folder and partition layout, and good practices around it.
-  - *Handy tools*: installing and using `btop`, `duf`, `ncdu`, `tldr`, `lazydocker`, and `ufw` (firewall).
-- **Jellyfin**: new media server article, now the default recommendation in place of Plex (Plex is still documented, see below).
-- **TinyAuth**: new article on this lightweight forward-auth proxy, for putting a login page in front of an app.
-- **Pocket ID**: new article on this self-hosted OIDC provider, letting you log in with a passkey instead of a password.
-- **File Browser Quantum**: new article on this modernized fork of File Browser, replacing the original as the recommended choice (see below).
-- **Forgejo**: new article on this self-hosted Git platform, now the default recommendation in place of Gitea (Gitea is still documented, see below).
-- **Arcane**: new article on this more advanced Docker management UI than Dockge, with support for multiple remote hosts and OIDC login.
-- **"Confirm before deleting" tip**: new article documenting a Bash function that asks for confirmation before any `sudo`-run `rm`, to help avoid accidental deletions.
-- **Section summary pages**: the General, Nonsense, and Recycled sections each now have a landing page listing their contents.
-
-## Replaced or archived articles
-
-Some apps are no longer the top recommendation, but their article stays available for anyone already using them or who prefers that alternative:
-
-- **Plex** has been replaced by **Jellyfin** as the recommended choice. The Plex article is kept under a new "Alternatives" section, along with its related qBittorrent and Servarr variants.
-- **Gitea** has been replaced by **Forgejo** as the recommended choice, following Gitea's governance change to a for-profit company. The Gitea article remains available under "Alternatives."
-- **File Browser** has been replaced by **File Browser Quantum**. Unlike the two cases above, this one comes with an active warning rather than just being an alternative: the original project accumulated several serious security vulnerabilities (including one allowing full admin account takeover) and was officially abandoned by its maintainers in September 2026. The article is now marked deprecated with an explicit warning not to install it.
-- **Overseerr** has been replaced by its successor **Seerr** in the automation (Servarr) article, following the merger of the Overseerr and Jellyseerr projects.
-
-## Navigation reorganization
-
-- **WireGuard** moved from the "Security" section to "Core": it's now treated as a basic infrastructure building block rather than an optional security tool.
-- **Authentik** moved to a new **"Advanced"** section, alongside Arcane, for more complex setups aimed at users already comfortable with self-hosting.
-- The "Security" section now only contains Cloudflare, TinyAuth, and Pocket ID.
-- Deprecated or replaced articles (Plex, the old File Browser, Gitea, the old WireGuard setup) are now grouped under a new **"Recycled"** section, itself split into "Deprecated" (to avoid) and "Alternatives" (valid choices, just not the default recommendation).
-
-## Content rewritten or substantially expanded
-
-- **Debian installation**: heavily expanded article.
-  - Explains how to enable Wake-on-LAN and automatic restart after a power outage, directly in the BIOS.
-  - SSH connection instructions now split by operating system (macOS, Windows, Linux), with the exact commands for each.
-  - A note on temporarily re-enabling SSH password login when connecting a new machine to the server.
-  - A brand new section on waking the server up remotely (Wake-on-LAN from outside the local network), with a concrete port-forwarding example.
-  - A new section on keeping the system up to date, laid out step by step, plus a one-line command tip for fully automatic updates.
-  - A clear prerequisite added at the top: being comfortable with basic terminal commands, linking to the new "CLI basics" article.
-- **Docker**: the introduction has been fully rewritten to explain what a container actually is and why this approach helps, instead of jumping straight into installation. The list of compatible apps is now presented as a set of examples (not exhaustive), each one linked.
-- **Single sign-on**: several existing articles (Immich, Nextcloud, Forgejo, Pingvin, Vaultwarden) gained a new section explaining how to log in directly with Pocket ID, alongside the already-documented TinyAuth method.
-- **TinyAuth protection**: added as a new section to many articles that didn't have it yet (monitoring, media, files, development), for putting these apps behind a login page.
-
-## User experience (UX) changes
-
-- **New look and feel**: the site was rebuilt from the ground up on a new component library, while keeping the old site's visual identity (colors, dark by default).
-- **Navigation menu** repositioned to properly line up with the article content column (previously misaligned at some screen widths).
-- **Collapsible sidebar**: the article tree on the left can now be collapsed, and starts collapsed by default instead of showing everything at once, easier to scan given how many sections there are.
-- **Search button** added above the sidebar, visible on every page.
-- **Step-by-step instructions**: nearly every install and configuration procedure is now visually numbered, instead of running paragraphs of text, much easier to follow.
-- **Interactive folder trees**: folder structures shown in install guides are now real visual trees with folder/file icons, instead of ASCII-art text. Clicking a row copies that path to the clipboard.
-- **Named, illustrated code blocks**: every code block now shows the real file name it belongs to, with a matching icon (for example, a YAML icon for a `compose.yaml`).
-- **Callout boxes (notes, tips, warnings)**: colors matched to the old site's palette; some callouts can now be clicked entirely when they only contain a link to another article, instead of a plain inline text link.
-- **Contributors shown at the bottom of every article**: lists everyone who has worked on a page (not just the last editor), linking to the full edit history.
-- **"Other projects" links** (Gitea, Lumeex, Instameex) now also shown at the bottom of every article's table of contents, not just on the homepage.
-- **Improved mobile layout**: homepage buttons, image, and spacing reorganized for small screens; "edit"/"report an issue" links now stack properly instead of overflowing on mobile.
-
-## URL changes
-
-- Every page now lives under an explicit language prefix, `/en/...` or `/fr/...`. Previously only French had a prefix (`/fr/...`), while English sat at the site root with no prefix at all.
-- French URLs now use the same wording as their English counterparts (for example `/fr/general/networking/nat/` instead of the old `/fr/generalites/reseau/nat/`), so both languages share the exact same structure.
-- **Every old link still works**: a bookmark, a link shared elsewhere, or a search-engine result pointing at an old address automatically redirects the visitor to its new equivalent.
-
-## English/French parity
-
-The French version is now a complete, faithful mirror of the English one: same articles, same organization, same formatting (same callouts, same numbered steps), with only the text translated. That wasn't the case before, where the two versions had drifted apart over time (articles present in one language but missing from the other, different organization).

LICENSE

@@ -1,6 +1,5 @@
 MIT License
-
-Copyright (c) 2026 Djeex
+Copyright (c) 2025 > Djeex
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -19,9 +18,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
-
----
-
-This project is built on the Docus theme (https://docus.dev), also MIT
-licensed (Copyright (c) the Docus authors), which is compatible with and
-distributed under the same terms above.

README.md

@@ -1,69 +1,43 @@
 <p align="center">
-<img src="public/img/global/docudjeex-home.svg" align="center" width="700">
+<img src="https://git.djeex.fr/Djeex/DjeexLab/raw/branch/main/docs/files/img/global/lab.svg" align="center" width="700">
+
+
+[![docu.djeex.fr](https://img.shields.io/badge/Docu·djeex-00b0f0?style=for-the-badge&logoColor=white&logo=materialformkdocs)](https://docu.djeex.fr/) [![Uptime-Kuma](https://stats.djeex.fr/api/badge/23/status?style=for-the-badge)](https://docu.djeex.fr/) 
 
-[![docu.djeex.fr](https://img.shields.io/badge/Docu·djeex-00b0f0?style=for-the-badge&logoColor=white&logo=materialformkdocs)](https://docu.djeex.fr/)
-[![Uptime-Kuma](https://stats.djeex.fr/api/badge/23/status?style=for-the-badge)](https://docu.djeex.fr/)
 </p>
 
-# 🔧 Homelab docs & other dumb things
+# 🔧 De la doc, encore de la doc
 
-**Docu·djeex** is first and foremost a personal project aimed at self-hosting as many everyday services as possible, without relying on proprietary platforms (Google, Apple, Netflix, etc.).
-This documentation site is built using [Nuxt.js](https://nuxt.com/), on the [Docus](https://docus.dev) theme (Nuxt UI + Nuxt Content).
+**Docu·djeex** c'est avant tout un projet personnel visant à héberger chez soi le plus de services possibles du quotidien sans passer par des plateformes propriétaires (Google, Apple, Netflix...). Cette doc utilise [Nuxt.js](https://nuxt.com/)
 
-This repository contains everything you need to edit pages, apply your changes, and redeploy the site. See [CUSTOMIZATIONS.md](CUSTOMIZATIONS.md) for everything added on top of the base Docus theme.
+Ce repo contient de quoi modifier les pages, ajouter vos changements, et redéployer le site.
 
-## Requirements
+## Setup
 
-- Node.js 20 or later
-- npm
+Installer les dépendances
 
-## Getting started
-
-Install dependencies:
-
-```bash
+```sh
 npm install
 ```
 
-Start the dev server:
+## Environnement de dévelopment (port 3000)
 
-```bash
+```sh
 npm run dev
 ```
 
-The site will be available at `http://localhost:3000`.
+## Génération des pages statiques
 
-## Build
-
-```bash
-npm run build
+```sh
+npm run generate
 ```
 
-This builds the production site (pointed at `https://docu.djeex.fr` via `NUXT_SITE_URL`) into `.output`. Run it with:
+Les fichiers HTML seront générés dans le dossier .output/public et prêts à être déployés sur n'importe quel hébergement compatible avec un site statique.
 
-```bash
-node .output/server/index.mjs
+## Preview build
+
+Si vous voulez voir immédiatement le résultat de la génération du site vous pouvez lancer un serveur de preview :
+
+```sh
+npm run preview
 ```
-
-## Project structure
-
-```
-content/
-├── en/          # English content, served at /en/...
-└── fr/          # French content, served at /fr/...
-
-app/
-├── components/  # Custom components and overrides of Docus's own components
-└── pages/       # The catch-all docs page
-
-content.config.ts   # Content collections and frontmatter schema
-nuxt.config.ts       # Nuxt/Docus/i18n configuration
-app/app.config.ts    # Theme, colors, branding
-```
-
-## Languages
-
-- English (`en`) — default locale, served under `/en`
-- French (`fr`) — served under `/fr`
-
-Visiting `/` redirects to `/en` or `/fr` based on the visitor's browser language (or a previous choice, remembered via cookie).

app.config.ts

@@ -0,0 +1,81 @@
+// https://github.com/nuxt-themes/docus/blob/main/nuxt.schema.ts
+export default defineAppConfig({
+  css: ['~/assets/css/extra.css'],
+  colorMode: { 
+    preference: 'dark',
+    fallback:'dark',
+    },
+  content: {
+     highlight: {
+      langs: [
+        'console',
+        'nginx',
+      ]
+    }
+  },
+
+   mdc: {
+     highlight: {
+       theme: 'github-dark',
+       langs: ['ts','console','nginx'],
+       wrapperStyle: true
+    }
+   },
+  
+  docus: {
+    title: 'Docudjeex',
+    description: 'La doc de mes expériences',
+    url: 'https://docu.djeex.fr/fr',
+    image: '/img/social.png',
+    socials: {
+      github:'',
+      Language: {
+        label: 'En',
+        icon: 'ri:english-input',
+        href: 'https://docu.djeex.fr'
+      },
+      Gitea: {
+        label: 'Gitea',
+        icon: 'cib:gitea',
+        href: 'https://git.djeex.fr/Djeex/docudjeex',
+      },
+      Github: {
+        label: 'Github',
+        icon:'cib:github', 
+        href: 'https://github.com/Djeex',
+      }
+    },
+    github: {
+      baseUrl:'https://git.djeex.fr',
+      dir: 'content',
+      branch: 'src/branch/master',
+      repo: 'docudjeex',
+      owner: 'Djeex',
+      edit: false
+    },
+    aside: {
+      level: 0,
+      collapsed: false,
+      exclude: []
+    },
+    main: {
+      padded: true,
+      fluid: true
+    },
+    header: {
+      logo: true,
+      showLinkIcon: true,
+      exclude: [],
+      fluid: false
+    },
+
+    footer: {
+      credits: {
+        icon: '',
+        text: '',
+        href: '',
+        }
+    }
+
+  },
+})

app/app.config.ts

@@ -1,140 +0,0 @@
-export default defineAppConfig({
-  docus: {
-    locale: 'en',
-    colorMode: 'dark',
-  },
-  navigation: {
-    sub: 'header',
-  },
-  header: {
-    title: 'Docudjeex',
-    logo: {
-      light: '/img/logo.svg',
-      dark: '/img/logo.svg',
-      alt: 'Docudjeex',
-    },
-  },
-  socials: {
-    gitea: 'https://git.djeex.fr/Djeex/docudjeex',
-  },
-  github: {
-    url: 'https://github.com/Djeex/docudjeex',
-  },
-  toc: {
-    bottom: {
-      title: 'Other dumb things',
-      links: [
-        {
-          icon: 'i-cib-gitea',
-          label: 'git.djeex.fr',
-          to: 'https://git.djeex.fr',
-          target: '_blank',
-        },
-        {
-          icon: 'i-brand-lumeex',
-          label: 'Lumeex',
-          to: 'https://lumeex.djeex.fr',
-          target: '_blank',
-        },
-        {
-          icon: 'i-brand-instameex',
-          label: 'Instameex',
-          to: 'https://instameex.djeex.fr',
-          target: '_blank',
-        },
-      ],
-    },
-  },
-  ui: {
-    colors: {
-      primary: 'cyan',
-      neutral: 'zinc',
-    },
-    prose: {
-      card: {
-        slots: {
-          base: 'bg-[rgba(12,13,12,0.8)] border-[#121110]',
-        },
-      },
-      // Custom code-block header icons. Full labels (```text [Arborescence])
-      // match by exact lowercase filename; bare extensions (no filename
-      // match) fall back to matching any ```lang [*.ext] label.
-      codeIcon: {
-        'arborescence': 'i-lucide-folder-tree',
-        'directory tree': 'i-lucide-folder-tree',
-        'ini': 'i-lucide-settings',
-        'conf': 'i-lucide-settings',
-        'service': 'i-lucide-settings',
-        // Used as ::code-group tab labels when a command differs per OS.
-        'macos': 'i-simple-icons-apple',
-        'linux': 'i-simple-icons-linux',
-        'windows': 'i-simple-icons-windows',
-      },
-      pre: {
-        slots: {
-          base: 'bg-[#121110] border-[#201e1b] rounded-lg',
-          header: 'bg-[#121110] border-[#201e1b]',
-        },
-      },
-      // Exact colors measured on the old site's ::alert boxes (note=info,
-      // tip=success, warning=warning, caution=danger/error).
-      callout: {
-        compoundVariants: [
-          {
-            color: 'info',
-            class: {
-              base: 'border-[#002235] bg-[#00131D] text-[#64C7FF]',
-              icon: 'text-[#64C7FF]',
-            },
-          },
-          {
-            color: 'success',
-            class: {
-              base: 'border-[#002817] bg-[#00190F] text-[#3CEEA5]',
-              icon: 'text-[#3CEEA5]',
-            },
-          },
-          {
-            color: 'warning',
-            class: {
-              base: 'border-[#292100] bg-[#1B1500] text-[#FFDC4E]',
-              icon: 'text-[#FFDC4E]',
-            },
-          },
-          {
-            color: 'error',
-            class: {
-              base: 'border-[#340A01] bg-[#1C0301] text-[#FFA692]',
-              icon: 'text-[#FFA692]',
-            },
-          },
-        ],
-      },
-    },
-    header: {
-      slots: {
-        root: 'bg-[rgba(12,13,12,0.8)] backdrop-blur-[20px] backdrop-saturate-200 border-b border-default h-(--ui-header-height) sticky top-0 z-50',
-      },
-    },
-    contentSearchButton: {
-      slots: {
-        base: 'bg-[rgba(12,13,12,0.8)] hover:bg-[rgba(18,17,16,0.9)] border border-[#121110]',
-      },
-    },
-    contentSurround: {
-      slots: {
-        link: 'bg-[rgba(12,13,12,0.8)] border-[#121110] hover:bg-primary/10 hover:border-primary',
-        linkLeading: 'bg-[rgba(12,13,12,0.8)] ring-1 ring-[var(--ui-text-highlighted)]/50 group-hover:bg-primary/10 group-hover:ring-primary/50',
-      },
-    },
-    kbd: {
-      compoundVariants: [
-        {
-          color: 'neutral',
-          variant: 'subtle',
-          class: 'ring-[#121110] bg-[rgba(12,13,12,0.8)] text-default',
-        },
-      ],
-    },
-  },
-})

app/app.css

@@ -1,37 +0,0 @@
-/* Restore the old site's near-black dark background (#0B0A0A) instead of
-   Nuxt UI's default zinc-900 */
-.dark {
-  --ui-bg: #0B0A0A;
-  /* Same border color used on cards, applied sitewide (header, separators,
-     the horizontal nav menu row, etc.) for a consistent look */
-  --ui-border: #121110;
-}
-
-/* Old site's container was 1280px with 24px padding each side (1232px of
-   actual content). Nuxt UI's container uses a bigger lg:px-8 (32px) padding,
-   so the max-width is bumped to 81rem (1296px) to land on the same 1232px
-   content width rather than reproducing the outer 1280px figure verbatim. */
-:root {
-  --ui-container: 81rem;
-}
-
-/* Docus hardcodes --ui-header-height to 112px (64px header + 48px sub-nav
-   bar) whenever navigation.sub is 'header', regardless of what's actually
-   in that bar. Our horizontal menu now lives in the main header row itself
-   (AppHeaderCenter.vue) and the sub-nav bar (AppHeaderBottom.vue) is empty,
-   so the header is back to a single 64px row. */
-@media (min-width: 1024px) {
-  .docus-sub-header {
-    --ui-header-height: 4rem !important;
-  }
-}
-
-/* A screenshot inside a list item (the step-by-step install guides) is
-   rendered as a bare <img> child of the <li> and gets no margin at all, so it
-   ends up glued to the text above and below it. The same image in a paragraph
-   is wrapped in a <p> that carries the prose spacing. Give it that spacing
-   back so illustrated steps stay readable. */
-li > img {
-  margin-block: 1.25rem;
-}
-

app/assets/brand-icons/instameex.svg

@@ -1,141 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 1000 1000">
-  <!-- Generator: Adobe Illustrator 30.7.0, SVG Export Plug-In . SVG Version: 2.1.4 Build 114)  -->
-  <defs>
-    <style>
-      .st0 {
-        fill: url(#Dégradé_sans_nom_5);
-      }
-
-      .st1 {
-        fill: url(#Dégradé_sans_nom_264);
-        stroke: url(#Dégradé_sans_nom_334);
-      }
-
-      .st1, .st2, .st3, .st4, .st5, .st6, .st7, .st8, .st9, .st10, .st11, .st12 {
-        stroke-miterlimit: 10;
-      }
-
-      .st2 {
-        fill: url(#Dégradé_sans_nom_262);
-        stroke: url(#Dégradé_sans_nom_332);
-      }
-
-      .st3 {
-        fill: url(#Dégradé_sans_nom_269);
-        stroke: url(#Dégradé_sans_nom_339);
-      }
-
-      .st4 {
-        fill: url(#Dégradé_sans_nom_263);
-        stroke: url(#Dégradé_sans_nom_333);
-      }
-
-      .st5 {
-        fill: url(#Dégradé_sans_nom_265);
-        stroke: url(#Dégradé_sans_nom_335);
-      }
-
-      .st6 {
-        fill: url(#Dégradé_sans_nom_268);
-        stroke: url(#Dégradé_sans_nom_338);
-      }
-
-      .st7 {
-        fill: url(#Dégradé_sans_nom_261);
-        stroke: url(#Dégradé_sans_nom_331);
-      }
-
-      .st8 {
-        fill: url(#Dégradé_sans_nom_266);
-        stroke: url(#Dégradé_sans_nom_336);
-      }
-
-      .st9 {
-        fill: url(#Dégradé_sans_nom_267);
-        stroke: url(#Dégradé_sans_nom_337);
-      }
-
-      .st10 {
-        fill: url(#Dégradé_sans_nom_26);
-        stroke: url(#Dégradé_sans_nom_33);
-      }
-
-      .st11 {
-        fill: url(#Dégradé_sans_nom_2610);
-        stroke: url(#Dégradé_sans_nom_3310);
-      }
-
-      .st12 {
-        fill: url(#Dégradé_sans_nom_2611);
-        stroke: url(#Dégradé_sans_nom_3311);
-      }
-
-      .st13 {
-        fill: #fff;
-      }
-
-      .st14 {
-        fill: url(#Dégradé_sans_nom_51);
-      }
-    </style>
-    <linearGradient id="Dégradé_sans_nom_5" data-name="Dégradé sans nom 5" x1="245" y1="503" x2="747" y2="503" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#55c3ec"/>
-      <stop offset="1" stop-color="#1d71b8" stop-opacity=".8"/>
-    </linearGradient>
-    <linearGradient id="Dégradé_sans_nom_51" data-name="Dégradé sans nom 5" x1="399.4" y1="504.3" x2="595.1" y2="504.3" xlink:href="#Dégradé_sans_nom_5"/>
-    <linearGradient id="Dégradé_sans_nom_26" data-name="Dégradé sans nom 26" x1="74.5" y1="560.2" x2="106.2" y2="591.8" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#55c3ec"/>
-      <stop offset="1" stop-color="#1d71b8" stop-opacity=".8"/>
-    </linearGradient>
-    <linearGradient id="Dégradé_sans_nom_33" data-name="Dégradé sans nom 33" x1="74.2" y1="559.9" x2="106.5" y2="592.2" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#55c3ec"/>
-      <stop offset="1" stop-color="#1d71b8" stop-opacity=".5"/>
-    </linearGradient>
-    <linearGradient id="Dégradé_sans_nom_261" data-name="Dégradé sans nom 26" x1="158.2" y1="648.8" x2="176.7" y2="667.3" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_331" data-name="Dégradé sans nom 33" x1="157.8" y1="648.4" x2="177.1" y2="667.7" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_262" data-name="Dégradé sans nom 26" x1="210.2" y1="714.7" x2="249.8" y2="754.3" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_332" data-name="Dégradé sans nom 33" x1="209.9" y1="714.3" x2="250.2" y2="754.6" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_263" data-name="Dégradé sans nom 26" x1="-54" y1="72.2" x2="-14.4" y2="111.8" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_333" data-name="Dégradé sans nom 33" x1="-54.4" y1="71.9" x2="-14.1" y2="112.2" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_264" data-name="Dégradé sans nom 26" x1="485.1" y1="-9.2" x2="503.7" y2="9.4" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_334" data-name="Dégradé sans nom 33" x1="484.8" y1="-9.6" x2="504" y2="9.7" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_265" data-name="Dégradé sans nom 26" x1="825.1" y1="682.3" x2="856.8" y2="713.9" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_335" data-name="Dégradé sans nom 33" x1="824.8" y1="681.9" x2="857.1" y2="714.3" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_266" data-name="Dégradé sans nom 26" x1="308.5" y1="356.5" x2="340.3" y2="388.3" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_336" data-name="Dégradé sans nom 33" x1="308.1" y1="356.2" x2="340.7" y2="388.7" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_267" data-name="Dégradé sans nom 26" x1="540.4" y1="450.4" x2="559" y2="469" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_337" data-name="Dégradé sans nom 33" x1="540.1" y1="450" x2="559.4" y2="469.3" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_268" data-name="Dégradé sans nom 26" x1="-336.4" y1="326.9" x2="-296.8" y2="366.5" gradientTransform="translate(342.9 490.5) rotate(-175.4)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_338" data-name="Dégradé sans nom 33" x1="-336.7" y1="326.5" x2="-296.4" y2="366.8" gradientTransform="translate(342.9 490.5) rotate(-175.4)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_269" data-name="Dégradé sans nom 26" x1="115" y1="-29.9" x2="133.6" y2="-11.3" gradientTransform="translate(814.9 151.4) rotate(139.6)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_339" data-name="Dégradé sans nom 33" x1="114.7" y1="-30.2" x2="134" y2="-11" gradientTransform="translate(814.9 151.4) rotate(139.6)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2610" data-name="Dégradé sans nom 26" x1="94.5" y1="304.2" x2="124.4" y2="334" gradientTransform="translate(568 142) rotate(97.9)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_3310" data-name="Dégradé sans nom 33" x1="94.2" y1="303.8" x2="124.7" y2="334.4" gradientTransform="translate(568 142) rotate(97.9)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2611" data-name="Dégradé sans nom 26" x1="435.8" y1="254.1" x2="454.4" y2="272.7" gradientTransform="translate(257.1 -349) rotate(52.9)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_3311" data-name="Dégradé sans nom 33" x1="435.5" y1="253.8" x2="454.8" y2="273.1" gradientTransform="translate(257.1 -349) rotate(52.9)" xlink:href="#Dégradé_sans_nom_33"/>
-  </defs>
-  <g id="Calque_1">
-    <circle class="st13" cx="499.5" cy="499.5" r="499.5"/>
-    <g>
-      <path class="st0" d="M618.3,252h-244.6c-72.1,0-128.7,59.2-128.7,128.7v244.6c0,72.1,59.2,128.7,128.7,128.7h244.6c72.1,0,128.7-59.2,128.7-128.7v-244.6c0-72.1-59.2-128.7-128.7-128.7ZM497.3,656.2c-82.4,0-151.9-69.5-151.9-151.9s66.9-151.9,151.9-151.9,151.9,69.5,151.9,151.9-69.5,151.9-151.9,151.9ZM659.5,378.2c-20.6,0-36-15.4-36-36s15.4-36,36-36,36,15.4,36,36c0,20.6-15.4,36-36,36Z"/>
-      <path class="st14" d="M497.3,406.5c-54.1,0-97.8,43.8-97.8,97.8s43.8,97.8,97.8,97.8,97.8-43.8,97.8-97.8-43.8-97.8-97.8-97.8Z"/>
-    </g>
-  </g>
-  <g id="Calque_2">
-    <g id="Calque_3">
-      <circle class="st10" cx="90.4" cy="576" r="22.4"/>
-      <circle class="st7" cx="175.6" cy="607.9" r="13.1"/>
-      <circle class="st2" cx="140.8" cy="691.6" r="28"/>
-      <circle class="st4" cx="829.7" cy="602.6" r="28"/>
-      <circle class="st1" cx="908.9" cy="562.1" r="13.1"/>
-      <circle class="st5" cx="840.9" cy="698.1" r="22.4"/>
-      <circle class="st8" cx="466.1" cy="876.5" r="22.5"/>
-      <circle class="st9" cx="538.6" cy="839.8" r="13.1"/>
-      <circle class="st6" cx="686.1" cy="170.1" r="28"/>
-      <circle class="st3" cx="733.7" cy="247.7" r="13.1"/>
-      <circle class="st11" cx="236.9" cy="206.5" r="21.1"/>
-      <circle class="st12" cx="315.4" cy="164.9" r="13.1"/>
-    </g>
-  </g>
-</svg>

app/assets/brand-icons/lumeex.svg

@@ -1,154 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 1000 1000">
-  <!-- Generator: Adobe Illustrator 29.7.1, SVG Export Plug-In . SVG Version: 2.1.1 Build 8)  -->
-  <defs>
-    <style>
-      .st0 {
-        fill: url(#Dégradé_sans_nom_265);
-        stroke: url(#Dégradé_sans_nom_33);
-      }
-
-      .st0, .st1, .st2, .st3, .st4, .st5, .st6, .st7, .st8, .st9, .st10, .st11 {
-        stroke-miterlimit: 10;
-      }
-
-      .st1 {
-        fill: url(#Dégradé_sans_nom_269);
-        stroke: url(#Dégradé_sans_nom_334);
-      }
-
-      .st2 {
-        fill: url(#Dégradé_sans_nom_268);
-        stroke: url(#Dégradé_sans_nom_333);
-      }
-
-      .st3 {
-        fill: url(#Dégradé_sans_nom_266);
-        stroke: url(#Dégradé_sans_nom_331);
-      }
-
-      .st4 {
-        fill: url(#Dégradé_sans_nom_267);
-        stroke: url(#Dégradé_sans_nom_332);
-      }
-
-      .st12 {
-        fill: url(#Dégradé_sans_nom_261);
-      }
-
-      .st13 {
-        fill: url(#Dégradé_sans_nom_262);
-      }
-
-      .st14 {
-        fill: url(#Dégradé_sans_nom_264);
-      }
-
-      .st15 {
-        fill: url(#Dégradé_sans_nom_263);
-      }
-
-      .st5 {
-        fill: url(#Dégradé_sans_nom_2616);
-        stroke: url(#Dégradé_sans_nom_3311);
-      }
-
-      .st6 {
-        fill: url(#Dégradé_sans_nom_2615);
-        stroke: url(#Dégradé_sans_nom_3310);
-      }
-
-      .st16 {
-        fill: #fff;
-      }
-
-      .st17 {
-        fill: url(#Dégradé_sans_nom_26);
-      }
-
-      .st7 {
-        fill: url(#Dégradé_sans_nom_2610);
-        stroke: url(#Dégradé_sans_nom_335);
-      }
-
-      .st8 {
-        fill: url(#Dégradé_sans_nom_2613);
-        stroke: url(#Dégradé_sans_nom_338);
-      }
-
-      .st9 {
-        fill: url(#Dégradé_sans_nom_2614);
-        stroke: url(#Dégradé_sans_nom_339);
-      }
-
-      .st10 {
-        fill: url(#Dégradé_sans_nom_2611);
-        stroke: url(#Dégradé_sans_nom_336);
-      }
-
-      .st11 {
-        fill: url(#Dégradé_sans_nom_2612);
-        stroke: url(#Dégradé_sans_nom_337);
-      }
-    </style>
-    <linearGradient id="Dégradé_sans_nom_26" data-name="Dégradé sans nom 26" x1="373.2" y1="159.5" x2="625.1" y2="411.5" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#55c3ec"/>
-      <stop offset="1" stop-color="#1d71b8" stop-opacity=".8"/>
-    </linearGradient>
-    <linearGradient id="Dégradé_sans_nom_261" data-name="Dégradé sans nom 26" x1="143.1" y1="200.5" x2="395" y2="452.4" gradientTransform="translate(30.8 109.3)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_262" data-name="Dégradé sans nom 26" x1="81.3" y1="60.6" x2="333.2" y2="312.5" gradientTransform="translate(187.1 873.6) rotate(-90)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_263" data-name="Dégradé sans nom 26" x1="-44.4" y1="16.5" x2="207.5" y2="268.4" gradientTransform="translate(705.4 808.2) rotate(-180)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_264" data-name="Dégradé sans nom 26" x1="-67.9" y1="-58.9" x2="184" y2="193" gradientTransform="translate(770.9 385.1) rotate(90)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_265" data-name="Dégradé sans nom 26" x1="74.5" y1="560.2" x2="106.2" y2="591.8" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_33" data-name="Dégradé sans nom 33" x1="74.2" y1="559.9" x2="106.5" y2="592.2" gradientUnits="userSpaceOnUse">
-      <stop offset="0" stop-color="#55c3ec"/>
-      <stop offset="1" stop-color="#1d71b8" stop-opacity=".5"/>
-    </linearGradient>
-    <linearGradient id="Dégradé_sans_nom_266" data-name="Dégradé sans nom 26" x1="158.2" y1="648.8" x2="176.7" y2="667.3" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_331" data-name="Dégradé sans nom 33" x1="157.8" y1="648.4" x2="177.1" y2="667.7" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_267" data-name="Dégradé sans nom 26" x1="210.2" y1="714.7" x2="249.8" y2="754.3" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_332" data-name="Dégradé sans nom 33" x1="209.9" y1="714.3" x2="250.2" y2="754.6" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_268" data-name="Dégradé sans nom 26" x1="-54" y1="72.2" x2="-14.4" y2="111.8" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_333" data-name="Dégradé sans nom 33" x1="-54.4" y1="71.9" x2="-14.1" y2="112.2" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_269" data-name="Dégradé sans nom 26" x1="485.1" y1="-9.2" x2="503.7" y2="9.4" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_334" data-name="Dégradé sans nom 33" x1="484.8" y1="-9.6" x2="504" y2="9.7" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2610" data-name="Dégradé sans nom 26" x1="825.1" y1="682.3" x2="856.8" y2="713.9" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_335" data-name="Dégradé sans nom 33" x1="824.8" y1="681.9" x2="857.1" y2="714.3" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2611" data-name="Dégradé sans nom 26" x1="308.5" y1="356.5" x2="340.3" y2="388.3" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_336" data-name="Dégradé sans nom 33" x1="308.1" y1="356.2" x2="340.7" y2="388.7" gradientTransform="translate(909.8 659.5) rotate(105)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2612" data-name="Dégradé sans nom 26" x1="540.4" y1="450.4" x2="559" y2="469" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_337" data-name="Dégradé sans nom 33" x1="540.1" y1="450" x2="559.4" y2="469.3" gradientTransform="translate(661.8 133.9) rotate(60)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2613" data-name="Dégradé sans nom 26" x1="-336.4" y1="326.9" x2="-296.8" y2="366.5" gradientTransform="translate(342.9 490.5) rotate(-175.4)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_338" data-name="Dégradé sans nom 33" x1="-336.7" y1="326.5" x2="-296.4" y2="366.8" gradientTransform="translate(342.9 490.5) rotate(-175.4)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2614" data-name="Dégradé sans nom 26" x1="115" y1="-29.9" x2="133.6" y2="-11.3" gradientTransform="translate(814.9 151.4) rotate(139.6)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_339" data-name="Dégradé sans nom 33" x1="114.7" y1="-30.2" x2="134" y2="-11" gradientTransform="translate(814.9 151.4) rotate(139.6)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2615" data-name="Dégradé sans nom 26" x1="94.5" y1="304.2" x2="124.4" y2="334" gradientTransform="translate(568 142) rotate(97.9)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_3310" data-name="Dégradé sans nom 33" x1="94.2" y1="303.8" x2="124.7" y2="334.4" gradientTransform="translate(568 142) rotate(97.9)" xlink:href="#Dégradé_sans_nom_33"/>
-    <linearGradient id="Dégradé_sans_nom_2616" data-name="Dégradé sans nom 26" x1="435.8" y1="254.1" x2="454.4" y2="272.7" gradientTransform="translate(257.1 -349) rotate(52.9)" xlink:href="#Dégradé_sans_nom_26"/>
-    <linearGradient id="Dégradé_sans_nom_3311" data-name="Dégradé sans nom 33" x1="435.5" y1="253.8" x2="454.8" y2="273.1" gradientTransform="translate(257.1 -349) rotate(52.9)" xlink:href="#Dégradé_sans_nom_33"/>
-  </defs>
-  <g id="Calque_1">
-    <circle class="st16" cx="499.5" cy="499.5" r="499.5"/>
-  </g>
-  <g id="Calque_2">
-    <g id="Calque_3">
-      <ellipse class="st17" cx="499.2" cy="285.5" rx="139.8" ry="209.5"/>
-      <ellipse class="st12" cx="299.9" cy="435.8" rx="139.8" ry="209.5" transform="translate(-207.3 586.3) rotate(-72)"/>
-      <ellipse class="st13" cx="373.6" cy="666.3" rx="209.5" ry="139.8" transform="translate(-385.1 576.9) rotate(-54)"/>
-      <ellipse class="st15" cx="623.9" cy="665.8" rx="139.8" ry="209.5" transform="translate(-272.2 493.9) rotate(-36)"/>
-      <ellipse class="st14" cx="703.9" cy="443.1" rx="209.5" ry="139.8" transform="translate(-94.9 211.2) rotate(-16)"/>
-      <circle class="st0" cx="90.4" cy="576" r="22.4"/>
-      <circle class="st3" cx="175.6" cy="607.9" r="13.1"/>
-      <circle class="st4" cx="140.8" cy="691.6" r="28"/>
-      <circle class="st2" cx="829.7" cy="602.6" r="28"/>
-      <circle class="st1" cx="908.9" cy="562.1" r="13.1"/>
-      <circle class="st7" cx="840.9" cy="698.1" r="22.4"/>
-      <circle class="st10" cx="466.1" cy="876.5" r="22.5"/>
-      <circle class="st11" cx="538.6" cy="839.8" r="13.1"/>
-      <circle class="st8" cx="686.1" cy="170.1" r="28"/>
-      <circle class="st9" cx="733.7" cy="247.7" r="13.1"/>
-      <circle class="st6" cx="236.9" cy="206.5" r="21.1"/>
-      <circle class="st5" cx="315.4" cy="164.9" r="13.1"/>
-    </g>
-  </g>
-</svg>

app/components/OgImage/Docs.takumi.vue

@@ -1,84 +0,0 @@
-<script lang="ts" setup>
-const { title, description, headline } = defineProps<{ title?: string, description?: string, headline?: string }>()
-
-const appConfig = useAppConfig()
-const { name: siteName } = useSiteConfig()
-const primaryColor = appConfig.ui?.colors?.primary ?? 'emerald'
-const logoPath = appConfig.header?.logo?.dark || appConfig.header?.logo?.light
-const logoHeight = 40
-
-const logoSvg = await fetchLogoSvg(logoPath)
-
-async function fetchLogoSvg(path?: string): Promise<string> {
-  if (!path) return ''
-  try {
-    const { url: siteUrl } = useSiteConfig()
-    const url = path.startsWith('http') ? path : `${siteUrl}${path}`
-    let svg = await $fetch<string>(url, { responseType: 'text' })
-
-    // Strip the XML prolog and comments: takumi renders them as literal text
-    // instead of ignoring them like a browser's innerHTML would.
-    svg = svg.replace(/<\?xml[^>]*\?>/, '').replace(/<!--[\s\S]*?-->/g, '').trim()
-
-    // takumi doesn't resolve the SVG's own <style> class rules either (paths
-    // rendered black), so inline each class's fill directly, then drop <defs>.
-    const classFills = new Map(
-      [...svg.matchAll(/\.(\w+)\s*\{\s*fill:\s*([^;}\s]+)/g)].map(([, className, fill]) => [className, fill]),
-    )
-    for (const [className, fill] of classFills) {
-      svg = svg.replaceAll(`class="${className}"`, `fill="${fill}"`)
-    }
-    svg = svg.replace(/<defs>[\s\S]*?<\/defs>/, '').trim()
-
-    // This logo is a wide wordmark (viewBox ~3360x576), not a square icon,
-    // so width must scale from its own aspect ratio instead of a fixed value.
-    const viewBox = svg.match(/viewBox="[\d.]+ [\d.]+ ([\d.]+) ([\d.]+)"/)
-    const width = viewBox ? Math.round(logoHeight * (Number(viewBox[1]) / Number(viewBox[2]))) : logoHeight
-
-    return svg.replace('<svg', `<svg width="${width}" height="${logoHeight}"`)
-  }
-  catch {
-    return ''
-  }
-}
-</script>
-
-<template>
-  <div class="w-full h-full flex flex-col justify-between bg-[#0B0A0A] px-[80px] py-[60px] font-[Roboto]">
-    <!-- Same shape, colors and blur as the site's own :ellipsis component: a wide
-         flat oval filled with its diagonal blue/cyan gradient, then blurred. -->
-    <div class="absolute blur-3xl top-[80px] right-[50px] w-[900px] h-[360px] rounded-full bg-[linear-gradient(97.62deg,rgba(0,71,225,0.18)_2.27%,rgba(26,214,255,0.12)_65%,rgba(0,71,225,0.12)_98.48%)]" />
-
-    <div class="flex-1 flex flex-col justify-center">
-      <p
-        v-if="headline"
-        :class="`uppercase text-[22px] font-bold m-0 mb-5 tracking-[0.05em] text-${primaryColor}-500`"
-      >
-        {{ headline }}
-      </p>
-      <h1
-        v-if="title"
-        class="m-0 mb-6 text-[50px] font-bold text-white leading-[1.1] w-full max-w-[900px] wrap-break-word"
-      >
-        {{ title?.slice(0, 60) }}
-      </h1>
-      <p
-        v-if="description"
-        class="m-0 text-[28px] text-neutral-400 leading-[1.4] w-full max-w-[900px] wrap-break-word"
-      >
-        {{ description?.slice(0, 200) }}
-      </p>
-    </div>
-
-    <div class="flex">
-      <div
-        v-if="logoSvg"
-        class="h-[40px]"
-        v-html="logoSvg"
-      />
-      <div v-else class="text-white text-[18px] font-normal rounded-lg px-5 py-2">
-        {{ siteName }}
-      </div>
-    </div>
-  </div>
-</template>

app/components/app/AppHeader.vue

@@ -1,102 +0,0 @@
-<script setup lang="ts">
-const appConfig = useAppConfig()
-const { forced: forcedColorMode } = useDocusColorMode()
-
-const { isEnabled: isAssistantEnabled } = useAssistant()
-const { isEnabled, locales } = useDocusI18n()
-const { subNavigationMode } = useSubNavigation()
-
-const links = computed(() => {
-  const list = []
-  if (appConfig.socials?.gitea) {
-    list.push({
-      'icon': 'i-simple-icons-gitea',
-      'to': appConfig.socials.gitea,
-      'target': '_blank',
-      'aria-label': 'Gitea',
-    })
-  }
-  if (appConfig.github?.url) {
-    list.push({
-      'icon': 'i-simple-icons-github',
-      'to': appConfig.github.url,
-      'target': '_blank',
-      'aria-label': 'GitHub',
-    })
-  }
-  return list
-})
-</script>
-
-<template>
-  <UHeader
-    :ui="{ center: 'flex-1' }"
-    :class="{ 'flex flex-col': subNavigationMode === 'header' }"
-  >
-    <AppHeaderCenter />
-
-    <template #left>
-      <AppHeaderLeft />
-    </template>
-
-    <template #right>
-      <AppHeaderCTA />
-
-      <template v-if="isAssistantEnabled">
-        <AssistantChat />
-      </template>
-
-      <template v-if="isEnabled && locales.length > 1">
-        <ClientOnly>
-          <LanguageSelect />
-
-          <template #fallback>
-            <div class="h-8 w-8 animate-pulse bg-neutral-200 dark:bg-neutral-800 rounded-md" />
-          </template>
-        </ClientOnly>
-
-        <USeparator
-          orientation="vertical"
-          class="h-8"
-        />
-      </template>
-
-      <UContentSearchButton class="lg:hidden" />
-
-      <ClientOnly v-if="!forcedColorMode">
-        <UColorModeButton />
-
-        <template #fallback>
-          <div class="h-8 w-8 animate-pulse bg-neutral-200 dark:bg-neutral-800 rounded-md" />
-        </template>
-      </ClientOnly>
-
-      <template v-if="links?.length">
-        <UButton
-          v-for="(link, index) of links"
-          :key="index"
-          v-bind="{ color: 'neutral', variant: 'ghost', ...link }"
-        />
-      </template>
-    </template>
-
-    <template #toggle="{ open, toggle }">
-      <IconMenuToggle
-        :open="open"
-        class="lg:hidden"
-        @click="toggle"
-      />
-    </template>
-
-    <template #body>
-      <AppHeaderBody />
-    </template>
-
-    <template
-      v-if="subNavigationMode === 'header'"
-      #bottom
-    >
-      <AppHeaderBottom />
-    </template>
-  </UHeader>
-</template>

app/components/app/AppHeaderBottom.vue

@@ -1,3 +0,0 @@
-<template>
-  <div />
-</template>

app/components/app/AppHeaderCenter.vue

@@ -1,47 +0,0 @@
-<script setup lang="ts">
-const { sections } = useSubNavigation()
-
-const navMenuVariants = useUIConfig('navigationMenu')
-</script>
-
-<template>
-  <template v-if="sections.length">
-    <!-- Empty spacer: keeps the header's flex-1 center slot from collapsing
-         while the real menu below is absolutely positioned so it can match
-         the article's content-column width instead of this slot's width. -->
-    <div class="hidden lg:block w-full" />
-
-    <UContainer class="absolute inset-x-0 inset-y-0 hidden lg:flex items-center pointer-events-none">
-      <!-- Mirrors the docs page's actual layout: an outer 10-col grid (left
-           doc-tree sidebar = col-span-2) containing a second, nested 10-col
-           grid for the article body (right TOC sidebar = col-span-2 of that
-           inner grid). Matching both levels is what lines this menu up with
-           the real content column instead of a naive single-level fraction. -->
-      <div class="grid grid-cols-10 gap-10 w-full">
-        <div class="col-span-8 col-start-3 grid grid-cols-10 gap-10">
-          <div class="col-span-8 col-start-1 pointer-events-auto">
-            <UNavigationMenu
-              :items="sections"
-              :highlight="navMenuVariants.highlight ?? true"
-              :highlight-color="navMenuVariants.highlightColor"
-              :variant="navMenuVariants.variant ?? 'pill'"
-              :color="navMenuVariants.color"
-              class="-mx-[10px] w-[calc(100%+20px)] [&>div]:w-full"
-              :ui="{ list: 'w-full justify-between', item: 'py-0' }"
-            />
-          </div>
-        </div>
-      </div>
-    </UContainer>
-  </template>
-
-  <UContentSearchButton
-    v-else
-    :collapsed="false"
-    class="w-full"
-    variant="soft"
-    :ui="{
-      leadingIcon: 'size-4 mx-0.5',
-    }"
-  />
-</template>

app/components/content/Ellipsis.vue

@@ -1,43 +0,0 @@
-<script setup lang="ts">
-withDefaults(defineProps<{
-  width?: string
-  height?: string
-  zIndex?: string
-  top?: string
-  left?: string
-  right?: string
-  blur?: string
-  colors?: string[]
-}>(), {
-  width: '10rem',
-  height: '10rem',
-  zIndex: '10',
-  top: '0',
-  left: 'auto',
-  right: 'auto',
-  blur: '50px',
-  colors: () => ['rgba(0, 71, 225, 0.34)', 'rgba(26, 214, 255, 0.22)', 'rgba(0, 71, 225, 0.22)'],
-})
-</script>
-
-<template>
-  <div
-    class="pointer-events-none absolute w-full"
-    :style="{
-      top,
-      insetInlineStart: left,
-      insetInlineEnd: right,
-      zIndex,
-      maxWidth: width,
-      height,
-      filter: `blur(${blur})`,
-    }"
-  >
-    <div
-      class="w-full h-full"
-      :style="{
-        background: `linear-gradient(97.62deg, ${colors[0]} 2.27%, ${colors[1]} 65%, ${colors[2]} 98.48%)`,
-      }"
-    />
-  </div>
-</template>

app/components/content/FileTree.vue

@@ -1,37 +0,0 @@
-<script setup lang="ts">
-export type FileTreeEntry = string | Record<string, FileTreeEntry[]>
-
-const props = withDefaults(defineProps<{
-  tree: FileTreeEntry
-  label?: string
-  collapsed?: boolean
-}>(), {
-  label: 'Folder structure',
-  collapsed: false,
-})
-
-// `collapsed` only sets the initial state; the header click below then
-// toggles this independently of the prop.
-const isOpen = ref(!props.collapsed)
-</script>
-
-<template>
-  <div class="not-prose my-5 rounded-lg overflow-hidden bg-elevated/50 ring ring-default divide-y divide-default">
-    <button
-      type="button"
-      class="flex items-center gap-1.5 w-full px-4 py-3 text-muted hover:text-default hover:bg-elevated/50 transition-colors cursor-pointer"
-      @click="isOpen = !isOpen"
-    >
-      <UIcon name="i-lucide-folder-tree" class="size-4 shrink-0" />
-      <span class="text-sm/6">{{ label }}</span>
-      <UIcon
-        name="i-lucide-chevron-down"
-        class="size-4 shrink-0 ms-auto transition-transform"
-        :class="isOpen ? '' : '-rotate-90'"
-      />
-    </button>
-    <ul v-show="isOpen" class="text-sm leading-relaxed px-2 py-2 list-none">
-      <FileTreeNode :entry="tree" root />
-    </ul>
-  </div>
-</template>

app/components/content/FileTreeNode.vue

@@ -1,138 +0,0 @@
-<script setup lang="ts">
-import { useClipboard } from '@vueuse/core'
-import codeIconTheme from '#build/ui/prose/code-icon'
-import type { FileTreeEntry } from './FileTree.vue'
-
-const props = withDefaults(defineProps<{
-  entry: FileTreeEntry
-  root?: boolean
-  parentPath?: string
-  isLast?: boolean
-}>(), {
-  root: false,
-  parentPath: '',
-  isLast: false,
-})
-
-function splitComment(raw: string) {
-  const index = raw.indexOf(' #')
-  if (index === -1) return { text: raw, comment: undefined as string | undefined }
-  return { text: raw.slice(0, index).trimEnd(), comment: raw.slice(index + 2).trim() }
-}
-
-const rawEntry = computed(() => typeof props.entry === 'object' ? Object.keys(props.entry)[0] : props.entry as string)
-const parsed = computed(() => splitComment(rawEntry.value))
-
-const isFolder = computed(() => typeof props.entry === 'object' || parsed.value.text.endsWith('/'))
-
-// Strip a trailing "/" marker, except when it's the whole name: that's the
-// filesystem root itself, written as a bare "/".
-const name = computed(() => {
-  const text = parsed.value.text
-  return text.length > 1 && text.endsWith('/') ? text.slice(0, -1) : text
-})
-const comment = computed(() => parsed.value.comment)
-
-const children = computed<FileTreeEntry[]>(() => {
-  if (typeof props.entry !== 'object') return []
-  return Object.values(props.entry)[0] || []
-})
-
-// The root's own name is "/" already; every other node just appends its
-// name to its parent's path, without doubling that leading slash.
-const fullPath = computed(() => {
-  if (props.root) return name.value
-  return props.parentPath === '/' ? `/${name.value}` : `${props.parentPath}/${name.value}`
-})
-
-const { copy, copied } = useClipboard({ source: fullPath })
-
-function onClick() {
-  copy()
-}
-
-const appConfig = useAppConfig()
-
-// Same lookup order as Nuxt UI's own CodeIcon.vue (exact filename match,
-// then extension, then the vscode-icons fallback), so a file gets the same
-// icon here as it would in a labeled code fence.
-const icon = computed(() => {
-  if (isFolder.value) return 'i-lucide-folder'
-
-  const filename = name.value
-  const icons = { ...codeIconTheme, ...(appConfig.ui?.prose?.codeIcon || {}) } as Record<string, string>
-  const extension = filename.includes('.') ? filename.split('.').pop() : undefined
-
-  return icons[filename.toLowerCase()]
-    ?? (extension && icons[extension])
-    ?? (extension && `i-vscode-icons-file-type-${extension}`)
-    ?? 'i-lucide-file'
-})
-</script>
-
-<template>
-  <li class="relative" :class="root ? '' : 'ps-3'">
-    <!-- Not the last child: a plain full-height guide line, since it needs
-         to keep going for the next sibling below it anyway. This is a direct
-         child of the LI (not the row span below, like the other guides),
-         so its own "start-0" lines up with the row span's "-start-1.5":
-         the row span sits 1.5 further in (its "-mx-1.5), so its own offset
-         needs those same 1.5 taken back out to land on the same column. -->
-    <span v-if="!root && !isLast" class="absolute start-0 top-0 bottom-0 w-px bg-white/20" />
-    <span
-      class="group flex items-center gap-1.5 py-1 px-1.5 -mx-1.5 rounded-md relative hover:bg-elevated/50 transition-colors cursor-pointer"
-      title="Copy path"
-      @click="onClick"
-    >
-      <!-- Last child: one rounded corner (border-inline-start + border-block-end
-           on a single box) instead of a separate vertical + horizontal stroke,
-           so the join is one clean curve rather than two translucent strokes
-           stacking into a visibly brighter square where they cross. Sized off
-           this row's own box (top to its vertical center) instead of a guessed
-           pixel height, so it stays in sync if the row's height ever changes. -->
-      <span
-        v-if="!root && isLast"
-        class="absolute -start-1.5 top-0 bottom-1/2 w-3 border-s border-b border-white/20 rounded-es-md"
-      />
-      <!-- Not the last child: just the branch into the icon — the vertical
-           guide itself is the LI-level line above, offset a hair to the
-           right of it so the two strokes sit side by side instead of
-           overlapping. -->
-      <span
-        v-if="!root && !isLast"
-        class="absolute -start-[5px] top-1/2 -translate-y-1/2 w-3 h-px bg-white/20"
-      />
-      <!-- Bridges the gap between this icon's own bottom edge and where its
-           children's guide lines start (right at this row's bottom edge,
-           which is exactly where the child <ul> begins), so the line reads
-           as coming out of the folder icon rather than piercing through it
-           or starting in mid-air. Starts at the row's center plus half the
-           icon's own height (size-4 = 16px), so it clears the icon glyph
-           regardless of the row's actual height. -->
-      <span
-        v-if="isFolder && children.length"
-        class="absolute start-3.5 top-[calc(50%+8px)] bottom-0 w-px bg-white/20"
-      />
-      <UIcon
-        :name="icon"
-        class="shrink-0 size-4"
-        :class="isFolder ? 'text-[var(--ui-primary)]' : 'text-[var(--ui-text-dimmed)]'"
-      />
-      <span>{{ name }}</span>
-      <span v-if="comment" class="text-xs text-muted italic">{{ comment }}</span>
-      <UIcon
-        :name="copied ? 'i-lucide-check' : 'i-lucide-copy'"
-        class="size-3.5 shrink-0 opacity-0 group-hover:opacity-100 transition-opacity text-muted"
-      />
-    </span>
-    <ul v-if="children.length" class="ms-2 ps-0 list-none">
-      <FileTreeNode
-        v-for="(child, i) in children"
-        :key="i"
-        :entry="child"
-        :parent-path="fullPath"
-        :is-last="i === children.length - 1"
-      />
-    </ul>
-  </li>
-</template>

app/components/docs/DocsAsideLeftBody.vue

@@ -1,17 +0,0 @@
-<script setup lang="ts">
-const { sidebarNavigation } = useSubNavigation()
-
-const contentNavVariants = useUIConfig('contentNavigation')
-</script>
-
-<template>
-  <UContentNavigation
-    :collapsible="true"
-    :default-open="false"
-    :highlight="contentNavVariants.highlight ?? true"
-    :highlight-color="contentNavVariants.highlightColor"
-    :variant="contentNavVariants.variant ?? 'link'"
-    :color="contentNavVariants.color"
-    :navigation="sidebarNavigation"
-  />
-</template>

app/components/docs/DocsAsideLeftTop.vue

@@ -1,30 +0,0 @@
-<script setup lang="ts">
-const { subNavigationMode, sections } = useSubNavigation()
-</script>
-
-<template>
-  <div
-    v-if="subNavigationMode === 'aside'"
-    class="mb-2"
-  >
-    <UPageAnchors :links="sections" />
-    <USeparator
-      type="dashed"
-      class="my-4"
-    />
-  </div>
-
-  <div
-    v-else
-    class="mb-4"
-  >
-    <UContentSearchButton
-      :collapsed="false"
-      class="w-full"
-      variant="soft"
-      :ui="{
-        leadingIcon: 'size-4 mx-0.5',
-      }"
-    />
-  </div>
-</template>

app/components/docs/DocsPageHeaderLinks.vue

@@ -1,102 +0,0 @@
-<script setup lang="ts">
-import { useClipboard } from '@vueuse/core'
-import { joinURL, withTrailingSlash } from 'ufo'
-import { useRuntimeConfig } from '#imports'
-
-const route = useRoute()
-const toast = useToast()
-const runtimeConfig = useRuntimeConfig()
-const appBaseURL = runtimeConfig.app?.baseURL || '/'
-const mcpRoute = (runtimeConfig.public.mcp as { route?: string } | undefined)?.route || '/mcp'
-
-const { copy, copied } = useClipboard()
-const { t } = useDocusI18n()
-
-const markdownLink = computed(() => `${window?.location?.origin}${withTrailingSlash(appBaseURL)}raw${route.path}.md`)
-const mcpServerUrl = computed(() => `${window?.location?.origin}${joinURL(appBaseURL, mcpRoute)}`)
-const mcpDeeplink = computed(() => `${window?.location?.origin}${joinURL(appBaseURL, mcpRoute, 'deeplink')}`)
-const items = computed(() => [
-  [{
-    label: t('docs.copy.link'),
-    icon: 'i-lucide-link',
-    onSelect() {
-      copy(markdownLink.value)
-    },
-  },
-  {
-    label: t('docs.copy.view'),
-    icon: 'i-simple-icons:markdown',
-    target: '_blank',
-    to: markdownLink.value,
-  },
-  {
-    label: t('docs.copy.gpt'),
-    icon: 'i-simple-icons:openai',
-    target: '_blank',
-    to: `https://chatgpt.com/?hints=search&q=${encodeURIComponent(`Read ${markdownLink.value} so I can ask questions about it.`)}`,
-  },
-  {
-    label: t('docs.copy.claude'),
-    icon: 'i-simple-icons:anthropic',
-    target: '_blank',
-    to: `https://claude.ai/new?q=${encodeURIComponent(`Read ${markdownLink.value} so I can ask questions about it.`)}`,
-  }],
-  [
-    {
-      label: 'Copy MCP Server URL',
-      icon: 'i-lucide-link',
-      onSelect() {
-        copy(mcpServerUrl.value)
-        toast.add({
-          title: 'Copied to clipboard',
-          icon: 'i-lucide-check-circle',
-        })
-      },
-    },
-    {
-      label: 'Add MCP Server',
-      icon: 'i-simple-icons:cursor',
-      target: '_blank',
-      to: mcpDeeplink.value,
-    },
-  ],
-])
-
-async function copyPage() {
-  const page = await $fetch<string>(`/raw${route.path}.md`)
-  copy(page)
-}
-</script>
-
-<template>
-  <UFieldGroup size="sm">
-    <UButton
-      :label="t('docs.copy.page')"
-      :icon="copied ? 'i-lucide-check' : 'i-lucide-copy'"
-      color="neutral"
-      variant="soft"
-      class="bg-[rgba(12,13,12,0.8)] hover:bg-[rgba(18,17,16,0.9)] border border-[#121110]"
-      :ui="{
-        leadingIcon: 'text-neutral size-3.5',
-      }"
-      @click="copyPage"
-    />
-
-    <UDropdownMenu
-      size="sm"
-      :items="items"
-      :content="{
-        align: 'end',
-        side: 'bottom',
-        sideOffset: 8,
-      }"
-    >
-      <UButton
-        icon="i-lucide-chevron-down"
-        color="neutral"
-        variant="soft"
-        class="bg-[rgba(12,13,12,0.8)] hover:bg-[rgba(18,17,16,0.9)] border border-[#121110] border-l-[#121110]"
-      />
-    </UDropdownMenu>
-  </UFieldGroup>
-</template>

app/components/prose/ProseCaution.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { useAppConfig } from '#imports'
-import Callout from '#ui/components/prose/Callout.vue'
-
-// Set `::caution{icon=""}` in the markdown to hide the default icon for
-// that one instance (useful when the body already starts with its own
-// emoji).
-const props = withDefaults(defineProps<{ icon?: string }>(), {
-  icon: undefined,
-})
-const appConfig = useAppConfig()
-const icon = computed(() => props.icon !== undefined ? props.icon : appConfig.ui.icons.caution)
-</script>
-
-<template>
-  <Callout
-    color="error"
-    :icon="icon"
-  >
-    <slot mdc-unwrap="p" />
-  </Callout>
-</template>

app/components/prose/ProseNote.vue

@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import { useAppConfig } from '#imports'
-import Callout from '#ui/components/prose/Callout.vue'
-
-// Set `::note{icon=""}` in the markdown to hide the default icon for that
-// one instance (useful when the body already starts with its own emoji).
-const props = withDefaults(defineProps<{ icon?: string }>(), {
-  icon: undefined,
-})
-const appConfig = useAppConfig()
-const icon = computed(() => props.icon !== undefined ? props.icon : appConfig.ui.icons.info)
-</script>
-
-<template>
-  <Callout
-    color="info"
-    :icon="icon"
-  >
-    <slot mdc-unwrap="p" />
-  </Callout>
-</template>

app/components/prose/ProseTip.vue

@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import { useAppConfig } from '#imports'
-import Callout from '#ui/components/prose/Callout.vue'
-
-// Set `::tip{icon=""}` in the markdown to hide the default icon for that
-// one instance (useful when the body already starts with its own emoji).
-const props = withDefaults(defineProps<{ icon?: string }>(), {
-  icon: undefined,
-})
-const appConfig = useAppConfig()
-const icon = computed(() => props.icon !== undefined ? props.icon : appConfig.ui.icons.tip)
-</script>
-
-<template>
-  <Callout
-    color="success"
-    :icon="icon"
-  >
-    <slot mdc-unwrap="p" />
-  </Callout>
-</template>

app/components/prose/ProseWarning.vue

@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { useAppConfig } from '#imports'
-import Callout from '#ui/components/prose/Callout.vue'
-
-// Set `::warning{icon=""}` in the markdown to hide the default icon for
-// that one instance (useful when the body already starts with its own
-// emoji).
-const props = withDefaults(defineProps<{ icon?: string }>(), {
-  icon: undefined,
-})
-const appConfig = useAppConfig()
-const icon = computed(() => props.icon !== undefined ? props.icon : appConfig.ui.icons.warning)
-</script>
-
-<template>
-  <Callout
-    color="warning"
-    :icon="icon"
-  >
-    <slot mdc-unwrap="p" />
-  </Callout>
-</template>

app/pages/[[lang]]/[...slug].vue

@@ -1,200 +0,0 @@
-<script setup lang="ts">
-import { kebabCase } from 'scule'
-import type { ContentNavigationItem, Collections, DocsCollectionItem } from '@nuxt/content'
-import { findPageHeadline } from '@nuxt/content/utils'
-
-definePageMeta({
-  layout: 'docs',
-})
-
-const route = useRoute()
-const { locale, isEnabled, t } = useDocusI18n()
-const { isOpen } = useAssistant()
-const appConfig = useAppConfig()
-const navigation = inject<Ref<ContentNavigationItem[]>>('navigation')
-const collectionName = computed(() => isEnabled.value ? `docs_${locale.value}` : 'docs')
-
-const [{ data: page }, { data: surround }] = await Promise.all([
-  useAsyncData(kebabCase(route.path), () => queryCollection(collectionName.value as keyof Collections).path(route.path).first() as Promise<DocsCollectionItem>),
-  useAsyncData(`${kebabCase(route.path)}-surround`, () => {
-    return queryCollectionItemSurroundings(collectionName.value as keyof Collections, route.path, {
-      fields: ['description'],
-    })
-  }),
-])
-
-if (!page.value) {
-  throw createError({ statusCode: 404, statusMessage: 'Page not found', fatal: true })
-}
-
-const title = page.value.seo?.title || page.value.title
-const description = page.value.seo?.description || page.value.description
-
-const headline = ref(findPageHeadline(navigation?.value, page.value?.path))
-const breadcrumbs = computed(() => findPageBreadcrumbs(navigation?.value, page.value?.path || ''))
-
-// Set `hideHeader: true` in a page's frontmatter to skip the title/description
-// block entirely (e.g. for a page that builds its own custom layout).
-const hideHeader = computed(() => !!(page.value as unknown as Record<string, unknown>)?.hideHeader)
-
-// Set `hideCopyPage: true` in a page's frontmatter to hide the "Copy page"
-// dropdown (copy link / view as markdown / open in ChatGPT / Claude).
-const hideCopyPage = computed(() => !!(page.value as unknown as Record<string, unknown>)?.hideCopyPage)
-
-// Set `hideToc: true` in a page's frontmatter to hide the right-hand
-// "On this page" table-of-contents sidebar.
-const hideToc = computed(() => !!(page.value as unknown as Record<string, unknown>)?.hideToc)
-
-useSeo({
-  title,
-  description,
-  type: 'article',
-  modifiedAt: (page.value as unknown as Record<string, unknown>).modifiedAt as string | undefined,
-  breadcrumbs,
-})
-watch(() => navigation?.value, () => {
-  headline.value = findPageHeadline(navigation?.value, page.value?.path) || headline.value
-})
-
-defineOgImage('Docs', {
-  headline: headline.value,
-  title: title?.slice(0, 60),
-  description: formatOgDescription(title, description),
-})
-
-const github = computed(() => appConfig.github ? appConfig.github : null)
-const giteaUrl = computed(() => appConfig.socials?.gitea as string | undefined)
-
-// "Edit this page" points at Gitea (git.djeex.fr), not the GitHub mirror.
-// Gitea's edit route is `/{owner}/{repo}/_edit/{branch}/{path}` (note the
-// leading underscore — different from GitHub's `/edit/{branch}/{path}`).
-const editLink = computed(() => {
-  if (!giteaUrl.value) {
-    return
-  }
-
-  return [
-    giteaUrl.value,
-    '_edit',
-    'main',
-    'content',
-    `${page.value?.stem}.${page.value?.extension}`,
-  ].filter(Boolean).join('/')
-})
-
-const contributors = computed(() => (page.value as unknown as Record<string, unknown>)?.contributors as string[] | undefined)
-
-const historyLink = computed(() => {
-  if (!giteaUrl.value) {
-    return
-  }
-
-  return [
-    giteaUrl.value,
-    'commits',
-    'branch',
-    'main',
-    'content',
-    `${page.value?.stem}.${page.value?.extension}`,
-  ].filter(Boolean).join('/')
-})
-
-// Add the page path to the prerender list
-addPrerenderPath(`/raw${route.path}.md`)
-</script>
-
-<template>
-  <UPage
-    v-if="page"
-    class="relative"
-    :ui="isOpen ? { center: 'lg:col-span-10' } : undefined"
-  >
-    <UPageHeader
-      v-if="!hideHeader"
-      :title="page.title"
-      :description="page.description"
-      :headline="headline"
-      :ui="{
-        wrapper: 'flex-row items-center flex-wrap justify-between',
-      }"
-    >
-      <template #links>
-        <UButton
-          v-for="(link, index) in (page as DocsCollectionItem).links"
-          :key="index"
-          size="sm"
-          v-bind="link"
-        />
-
-        <DocsPageHeaderLinks v-if="!hideCopyPage" />
-      </template>
-    </UPageHeader>
-
-    <UPageBody>
-      <ContentRenderer
-        v-if="page"
-        :value="page"
-      />
-
-      <USeparator v-if="giteaUrl || github">
-        <div
-          class="flex items-center gap-2 text-sm text-muted max-[420px]:flex-col"
-        >
-          <UButton
-            v-if="editLink"
-            variant="link"
-            color="neutral"
-            :to="editLink"
-            target="_blank"
-            icon="i-lucide-pen"
-            :ui="{ leadingIcon: 'size-4' }"
-          >
-            {{ t('docs.edit') }}
-          </UButton>
-          <template v-if="giteaUrl">
-            <span>{{ t('common.or') }}</span>
-            <UButton
-              variant="link"
-              color="neutral"
-              :to="`${giteaUrl}/issues/new`"
-              target="_blank"
-              icon="i-lucide-alert-circle"
-              :ui="{ leadingIcon: 'size-4' }"
-            >
-              {{ t('docs.report') }}
-            </UButton>
-          </template>
-        </div>
-      </USeparator>
-      <div
-        v-if="contributors?.length"
-        class="flex items-center gap-2 text-sm text-muted"
-      >
-        <UIcon
-          name="i-lucide-users"
-          class="size-4 shrink-0"
-        />
-        <span>{{ locale === 'fr' ? (contributors.length > 1 ? 'Contributeurs' : 'Contributeur') : (contributors.length > 1 ? 'Contributors' : 'Contributor') }}:</span>
-        <ULink
-          v-if="historyLink"
-          :to="historyLink"
-          target="_blank"
-          class="text-highlighted hover:underline"
-        >
-          {{ contributors.join(', ') }}
-        </ULink>
-        <span v-else>{{ contributors.join(', ') }}</span>
-      </div>
-      <UContentSurround :surround="surround" />
-    </UPageBody>
-
-    <template
-      v-if="!isOpen && !hideToc"
-      #right
-    >
-      <DocsAsideRight
-        :page="page"
-      />
-    </template>
-  </UPage>
-</template>

assets/css/extra.css

@@ -0,0 +1,87 @@
+@media (min-width: 1024px) {
+    .card-grid .layout {
+        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+    }
+}
+
+.alert .shiki {
+    --shiki-dark: #00000000 !important;
+    --shiki-default: #00000000 !important;
+    --shiki-dark-bg: #00000000 !important;
+    --shiki-default-bg: #00000000 !important;
+}
+.dark .shiki {
+    background-color: #00000000 !important;
+}
+*html .dark .shiki span, html.dark .shiki span  {
+    background-color: var(--prose-code-block-backgroundColor) !important;
+    }
+    
+/*html .dark .shiki span, html.dark .shiki span  {
+        background-color: #00000000 !important;
+        }*/
+
+.alert.success .prose-code, .alert.success .shiki span  {
+    background-color: var(--elements-state-success-backgroundColor-secondary) !important;
+    border-color: #00361f !important;
+}
+
+.alert.info .prose-code, .alert.info .shiki span {
+    background-color: var(--elements-state-info-backgroundColor-secondary) !important;
+    border-color: #00304a !important;
+}
+
+.alert.warning .prose-code, .alert.warning .shiki span {
+    background-color: var(--elements-state-warning-backgroundColor-secondary) !important;
+    border-color: #382d00 !important;
+}
+
+.alert.danger .prose-code, .alert.danger .shiki span {
+    background-color: var(--elements-danger-info-backgroundColor-secondary) !important;
+    border-color: #00304a !important;
+}
+
+.section.right > :nth-child(2) {
+    display:none;
+  }
+
+.container {
+    max-width: var(--elements-container-maxWidth);
+}
+
+.has-parent-icon .icon {
+    color: #ADA9A4;
+}
+
+.has-parent-icon.active .icon {
+    color: var(--color-primary-500) !important;
+}
+
+.card:hover{
+    color:#00304a;
+}
+
+p img {
+    border-radius:7px;
+}
+@media (min-width: 1024px) {
+    .card-grid {
+        padding-bottom: 80px !important;
+    }
+}
+
+.prose-code.highlight-sh code .line {
+    padding-inline-start: 0 !important;
+}
+
+.prose-code.highlight-sh code .line:before {
+    display:none !important;
+}
+
+.prose-code.highlight-bash code .line {
+    padding-inline-start: 0 !important;
+}
+
+.prose-code.highlight-bash code .line:before {
+    display:none !important;
+}

components/Logo.vue

@@ -0,0 +1,3 @@
+<template>
+  <img width="120" src="/img/logo.svg"/>
+</template>

content.config.ts

@@ -1,96 +0,0 @@
-import type { DefinedCollection } from '@nuxt/content'
-import { defineContentConfig, defineCollection, z } from '@nuxt/content'
-import { useNuxt } from '@nuxt/kit'
-import { joinURL } from 'ufo'
-import { existsSync } from 'node:fs'
-
-const { options } = useNuxt()
-const cwd = joinURL(options.rootDir, 'content')
-const locales = options.i18n?.locales
-
-// Same checks as docus's own content.config.ts (node_modules/docus/utils/pages.ts,
-// not a published package export, so reimplemented here rather than imported).
-function landingPageExists(rootDir: string): boolean {
-  return existsSync(joinURL(rootDir, 'app', 'pages', 'index.vue'))
-}
-function docsFolderExists(rootDir: string, locale?: string): boolean {
-  return existsSync(locale ? joinURL(rootDir, 'content', locale, 'docs') : joinURL(rootDir, 'content', 'docs'))
-}
-
-const hasLandingPage = landingPageExists(options.rootDir)
-const hasDocsFolder = docsFolderExists(options.rootDir)
-
-// Same as docus's own createDocsSchema(), plus the two custom per-page
-// frontmatter toggles used by app/pages/[[lang]]/[...slug].vue. Nuxt
-// Content's Zod schema silently strips any frontmatter key that isn't
-// declared here, which is why hideHeader/hideCopyPage did nothing until
-// this schema was extended.
-const createDocsSchema = () => z.object({
-  links: z.array(z.object({
-    label: z.string(),
-    icon: z.string(),
-    to: z.string(),
-    target: z.string().optional(),
-  })).optional(),
-  hideHeader: z.boolean().optional(),
-  hideCopyPage: z.boolean().optional(),
-  hideToc: z.boolean().optional(),
-  contributors: z.array(z.string()).optional(),
-})
-
-let collections: Record<string, DefinedCollection>
-
-if (locales && Array.isArray(locales)) {
-  collections = {}
-  for (const locale of locales) {
-    const code = (typeof locale === 'string' ? locale : locale.code).replace('-', '_')
-    const hasLocaleDocs = docsFolderExists(options.rootDir, code)
-
-    if (!hasLandingPage) {
-      collections[`landing_${code}`] = defineCollection({
-        type: 'page',
-        source: {
-          cwd,
-          include: `${code}/index.md`,
-        },
-      })
-    }
-
-    collections[`docs_${code}`] = defineCollection({
-      type: 'page',
-      source: {
-        cwd,
-        include: hasLocaleDocs ? `${code}/docs/**` : `${code}/**/*`,
-        prefix: hasLocaleDocs ? `/${code}/docs` : `/${code}`,
-        exclude: [`${code}/index.md`],
-      },
-      schema: createDocsSchema(),
-    })
-  }
-}
-else {
-  collections = {
-    docs: defineCollection({
-      type: 'page',
-      source: {
-        cwd,
-        include: hasDocsFolder ? 'docs/**' : '**',
-        prefix: hasDocsFolder ? '/docs' : '/',
-        exclude: ['index.md'],
-      },
-      schema: createDocsSchema(),
-    }),
-  }
-
-  if (!hasLandingPage) {
-    collections.landing = defineCollection({
-      type: 'page',
-      source: {
-        cwd,
-        include: 'index.md',
-      },
-    })
-  }
-}
-
-export default defineContentConfig({ collections })

content/0.index.md

@@ -0,0 +1,36 @@
+---
+title: Accueil
+description: Documentation homelab par Djeex — guides d'auto-hébergement pour Debian, Docker, réseau, stockage et bien plus.
+navigation: false
+layout: page
+main:
+  fluid: false
+---
+
+:ellipsis{right=0px width=75% blur=150px}
+
+::block-hero
+---
+cta:
+  - Accéder à la doc
+  - /apropos/bienvenue
+secondary:
+  - En →
+  - https://docu.djeex.fr
+---
+
+#title
+Bienvenue sur docu[·]{style="color: #1ad6ff"}djeex
+
+#description
+De la doc, encore de la doc. Des astuces et des expériences. Construisez votre homelab et votre propre NAS.
+
+#extra
+![](/img/global/docudjeex-home.svg)  
+#support
+::card{icon=cib:gitea style="color:#1ad6ff;"}
+#title
+__git.djeex.fr__
+#description
+[Consultez mes bêtises](https://git.djeex.fr)
+::

content/1.apropos/1.bienvenue.md

@@ -0,0 +1,42 @@
+---
+icon: lucide:home
+title: Bienvenue
+description: Introduction à Docudjeex — un site de documentation personnelle sur les services auto-hébergés, Debian et l'infrastructure Docker.
+main:
+  fluid: false
+---
+:ellipsis{right=0px width=75% blur=150px}
+
+# docu[·]{style="color: #1ad6ff"}quoi ?
+
+__Docu[·]{style="color: #1ad6ff"}djeex__ est le site regroupant la documentation de mes serveurs, pensé à l'origine pour retrouver facilement mes configurations et commandes. Mon infrastructure est construite autour du duo Debian 13 et docker, pour plus de simplicité à l'export et au déploiement. On remerciera principalement __Nipah__ et __Xenio__ (et d'autres) pour leur patience et écoute. La majeur partie de ce contenu vient de leurs têtes.
+
+## A propos de la documentation
+
+La documentation fournie ici est distribuée à titre expérimentale, dans un esprit de partage d'expérience. Elle n'est en aucun cas faite pour construire une architecture de production ou pour de l'industrialisation. Il est possible qu'elle contienne des erreurs et/ou des approximations.
+
+Evidemment l'usage de cette documentation doit strictement se limiter au cadre légal.
+
+::card-grid
+#title
+Documentation disponible ou en cours
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+  ::card{icon=noto:microscope}
+  #title
+  Serveex
+  #description
+  [Votre homelab à déployer pas à pas](/serveex/introduction)
+  ::
+
+  ::card{icon=noto:computer-disk}
+  #title
+  Stockeex
+  #description
+  *(à venir)* Votre NAS maison à créer chez vous pour stocker vos données et media
+  ::
+::
+

content/1.apropos/_dir.yml

@@ -0,0 +1,3 @@
+icon: noto:star
+navigation.title: Bienvenue
+navigation.redirect: /apropos/bienvenue

content/2.generalites/1.reseau/1.nat.md

@@ -0,0 +1,67 @@
+---
+navigation: true
+title: NAT & DHCP
+description: Comprendre le NAT, la redirection de ports et le DHCP sur un routeur domestique. Configurer des baux IP fixes et exposer des services locaux.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Routeur et NAT
+::alert{type="info"}
+🎯  __Objectifs :__
+- Comprendre le principe de la redirection de port
+- Savoir configurer le NAT de son routeur
+- Savoir émettre des baux DHCP (IP fixes)
+::
+
+![picture](/img/global/nat.svg)
+
+## Qu'est-ce qu'un "port" ?
+---
+Les ports sont différents canaux par lesquels votre routeur envoie et reçoit des données, ce qui permet d'utiliser plusieurs services en meme temps. Lorsqu'il reçoit une donnée via un port, otre routeur transmet ensuite les données à la machine qui :
+- soit a émis la requête de départ
+- soit est configurée pour recevoir les données reçues par un port spécifique du routeur
+
+Votre routeur dispose de plus de 65 000 ports à utiliser.
+
+Certains programmes et applications sont conçus pour utiliser des ports spécifiques. Par exemple, lorsque votre réseau envoie des données à partir d'une page HTML, le routeur les recevra via le port numéro 80 (non sécurisé) ou `443` (sécurisé via SSL). 
+
+Le routeur sert donc de plateforme d'aiguillage des données entre internet et votre machine.
+
+## La redirection de port
+---
+Rediriger un `port`, c'est émettre une règle qui spécifie que telle `source` peut envoyer des données à tel `port` de votre routeur, qui redirigera les données sur tel `port` de telle `machine`. Les `sources` et la `machine de destination` sont identifiées par leur `adresse IP`.
+
+| Variable                 | Description                                              | exemple                 |
+|--------------------------|----------------------------------------------------------|-------------------------|
+|         `machine source` |                   IP de la machine source (sur internet) | `All`<br>`123.45.67.89` |
+|            `port source` |                            Port d'arrivée sur le routeur |                   `443` |
+|    `port de destination` |             Port d'arrivée sur la machine de destination |                  `3000` |
+| `machine de destination` | IP de la machine de destination (sur votre réseau local) |          `192.168.1.50` |
+
+Selon ce tableau, si on enlève le `All` et que l'on garde l'ip `123.45.67.89` en provenance d'internet, tout le traffic envoyé depuis cette IP sur le port `443` du routeur sera redirigé vers le port `3000` de l'IP locale `192.168.1.50`.
+
+Si on enlève l'IP de l'exemple et qu'on laisse le `All`, tout le traffic d'internet envoyé au port `443` du routeur sera redirigé vers le port `3000` de l'IP locale `192.168.1.50`.
+
+C'est utile si par exemple vous avez un serveur qui a un service qui nécessite d'etre accessible par internet. Par exemple, un site web. Le web utilise le port `80` (non sécurisé) et le port 443 (sécurisé par certificat SSL) pour communiquer. Ainsi, si je veux que mon site internet soit accessible, je vais faire en sorte que lorsqu'on tape le nom de domaine de mon site, le routeur redirige bien vers mon serveur local (avec l'exemple de l'IP locale du tableau). Par exemple, imaginons que mon service est sur le port `3000` de mon routeur (accessible en local via `http://192.168.1.50:3000`), je vais donc rediriger comme dans l'exemple toutes les sources (All) qui passent par le port `443` du routeur vers le port `3000` de mon serveur local.
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Si vous avez plusieurs services à rendre accessible, avec par exemple `sousdomaine1.mondomaine.fr` et `sousdomaine2.mondomaine.fr`, votre routeur ne peut pas rediriger vers plusieurs port selon la requête. Vous devrez utiliser un [Reverse Proxy](../../serveex/coeur/swag) qui selon la requete redirigera vers le bon service de votre serveur.
+:::
+::
+
+## Le DHCP
+---
+A chaque fois que vous connectez un appareil sur votre réseau local, votre routeur lui attribue une adresse IP via les règles DHCP. Celle-ci est aléatoire selon des règles prédéfinies. A chaque redémarrage de l'appareil, l'IP peut changer. C'est embetant si vous exposez un service et que vous avez une redirection de port dans votre routeur car si l'IP change, la redirection enverra les données dans le vide. Le serveur DHCP de votre box permet d'attribuer une IP fixe à un appareil.
+
+Chaque appareil a une adresse physique dite "adressse MAC". Pour fixer l'IP, vous devez connaitre l'adresse physique de votre appareil (visible dans votre routeur si votre machine est connectée au réseau), et lui attribuer une adresse IP fixe, ce qu'on appel un "bail DHCP fixe".
+
+Ainsi, l'IP de votre machine ne changera jamais et la redirection de port sera toujours effective.
+
+| Variable      | Description                    | Exemple             |
+|---------------|--------------------------------|---------------------|
+| `IP`          | IP locale fixe à attribuer     | `192.168.1.50`      |
+| `Adresse Mac` | Adresse physique de la machine | `5E:FF:56:A2:AF:15` |
+
+Pour plus d'information sur ces sujets, consultez la documentation de votre routeur.

content/2.generalites/1.reseau/2.dns.md

@@ -1,13 +1,21 @@
 ---
+navigation: true
 title: Zone DNS
 description: Comprendre le fonctionnement du DNS, lire et éditer une zone DNS, et configurer des noms de domaine pour vos services auto-hébergés.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Noms de domaines et zone DNS
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+::alert{type="info"}
+🎯  __Objectifs :__
+- Comprendre le fonctionnement d'un serveur DNS
+- Comprendre comment modifier une zone DNS
+::
 
 ## Introduction
-
+---
 Lorsque vous naviguez sur un site, ou une application, des requêtes sont émises vers un ou des domaines afin d'afficher le contenu de votre page. Votre appareil ne connait pas les adresses IP de ces serveurs à joindre. Pour les connaitre, il va contacter un _serveur de nom_ (Domain Name Server) qui lui va lui répondre avec l'adresse IP la plus à jour pour le domaine de la requête. 
 
 La zone DNS, c'est une sorte de registre avec des panneaux qui redirige vos requêtes vers la bonne destination.
@@ -15,7 +23,7 @@ La zone DNS, c'est une sorte de registre avec des panneaux qui redirige vos requ
 ![Picture](/img/global/dns.svg)
 
 ## La zone DNS
-
+---
 Lorsque vous réservez un domaine chez votre registrar (cloudflare, ovh...), ce registrar vous attribue une zone DNS que vous pouvez personnaliser.
 
 Vous pouvez rentrer des _enregistrements_ dans cette zone DNS qui permettront d'orienter les requêtes au bon endroit. Vous trouverez [plus d'information ici](https://help.ovhcloud.com/csm/fr-dns-servers-general-information?id=kb_article_view&sysparm_article=KB0051661).
@@ -23,37 +31,38 @@ Vous pouvez rentrer des _enregistrements_ dans cette zone DNS qui permettront d'
 Exemple d'une zone DNS du domaine mondomaine.fr:
 
 ```
-$TTL 3600
 @   IN SOA ns1.dns.me. dns.net. (2024051800 86400 3600 3600000 60)
                  IN NS     ns1.dns.me.
                  IN NS     ns2.dns.me.
-                 IN A      203.0.113.10
-www              IN CNAME  mondomaine.fr.
-sousdomaine      IN CNAME  mondomaine.fr.
+                 IN A      203.0.113.0
+www              IN CNAME  mondomaine.fr
+sousdomaine      IN CNAME  mondomaine.fr
 ```
 
 Dans cet exemple :
 
-- `$TTL 3600` indique aux différents serveurs de noms de la planète que les enregistrements sont valides 1h (et qu'au-delà il faudra revérifier).
+- `$TTL 3600` indique aux différents serveurs de noms de la planète que les enregistrement sont valides 1h (et qu'au-delà il faudra rev"rifier).
 - `IN SOA ns1.dns.me. dns.net. (2024051800 86400 3600 3600000 60)` indique que `ns1.dns.me` est le serveur dns principal, et les nombres sont des indications de rafraichissement.
 - `IN NS ns1.dns.me.` et `IN NS ns2.dns.me.` indique que `ns1.dns.me` et `ns2.dns.me` sont des serveurs de noms pour ce domaine.
-- `IN A 203.0.113.10` signifie que `mondomaine.fr` pointe vers l'IP `203.0.113.10`
-- `sousdomaine IN CNAME mondomaine.fr.` signifie que `sousdomaine.mondomaine.fr` pointe vers `mondomaine.fr` et donc vers l'IP `203.0.113.10`.
+- `IN A 203.0.113.0` signifie que `mondomaine.fr` pointe vers l'IP `203.0.113.0`
+- `sousdomaine IN CNAME mondomaine.fr` signifie que `sousdomaine.mondomaine.fr` pointe vers `mondomaine.fr` et donc vers l'IP `203.0.113.0`.
 
 Ainsi, si vous choisissez de pointer le domaine `mondomaine.fr` vers votre serveur, vous pouvez le faire en ajoutant un enregistrement `A` pointant vers l'IP publique de votre serveur.
 
-::warning
-
-__Attention :__ si votre serveur est hébergé chez vous :
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention,__ Si votre serveur est chez vous :
+:::
 - l'IP publique est celle de votre box internet. Assurez-vous auprès de votre opérateur que cette IP est fixe ou configurez un [DDNS](https://aws.amazon.com/fr/what-is/dynamic-dns/).
-- assurez-vous d'avoir [redirigé le port 443 vers le port d'écoute de votre serveur](/general/networking/nat).
+- assurez-vous d'avoir [redirigé le port 443 vers le port d'écoute de votre serveur](/generalites/reseau/nat).
 ::
 
 Et si vous ajoutez un sous-domaine qui doit pointer vers votre serveur, vous pouvez utiliser un enregistrement `CNAME` vers `mondomaine.fr`.
 
-::note
-
-__Pourquoi ne pas utiliser un enregistrement `A` pour le sous-domaine ?__ Si votre sous domaine pointe sur le meme serveur que `mondomaine.fr`, il vaut mieux utiliser un enregistrement `CNAME` car en cas de changement d'IP du serveur, il n'y aura aucune autre manipulation à faire.
+::alert{type="info"}
+:::list{type="info"}
+- __Pourquoi ne pas utiliser un enregistrement `A` pour le sous-domaine ?__ Si votre sous domaine pointe sur le meme serveur que `mondomaine.fr`, il vaut mieux utiliser un enregistrement `CNAME` car en cas de changement d'IP du serveur, il n'y aura aucune autre manipulation à faire.
+:::
 ::
 
 La plupart des registrar proposent des interfaces plus lisbles pour modifier ces informations. Renseignez-vous auprès de la documentation de votre registrar.

content/2.generalites/1.reseau/3.samba.md

@@ -0,0 +1,229 @@
+---
+navigation: true
+title: Samba
+description: Configurer Samba sur Debian pour partager des dossiers sur votre réseau local et y accéder depuis Windows, macOS ou Linux.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Samba
+
+Samba est un protocole permettant d'accèder à un dossier situé sur un disque réseau. Il peut être configuré sous Mac, Windows ou Linux.
+
+De nombreux tutorials existent pour configurer Samba sous windows ou sur un NAS type Synology, ici nous nous concentrons sur Debian.
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Créer un dossier réseau sur une machine distante
+- Accéder au dossier réseau sur notre serveur
+::
+
+![samba](/img/global/smb.svg)
+
+## Partager un dossier réseau
+---
+::alert{type="info"}
+:::list{type="info"}
+- Ici, nous allons partager le dossier `/video` d'une machine distant que nous appelerons `machine-distante`. Nous accéderons à ce dossier par la machine nommée `machine-locale`. L'utilisateur de connexion au disque réseau sera `sambauser`.
+:::
+::
+
+
+### Installer le serveur samba
+
+```sh
+sudo apt update && sudo apt upgrade
+sudo apt install samba smbclient cifs-utils
+```
+
+### Créer le dossier `/video`
+
+```sh
+sudo mkdir /video
+```
+
+### Configuration du partage
+
+Ensuite nous allons éditer le fichier `/etc/samba/smb.conf`
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vim /etc/samba/smb.conf
+```
+
+Localisez la variable `workgroup` puis passez en mode modification en appuyant sur `i` et nommez votre worgroup, par exemple `::::properties workgroup = WORKGROUP`
+
+Puis allez à la fin du fichier et collez la configuration suivante
+
+```properties
+[video]
+   comment = Dossier video
+   path = /video
+   writable = yes
+   guest ok = no
+   valid users = @smbshare
+   force create mode = 770
+   force directory mode = 770
+   inherit permissions = yes
+```
+Appuyez sur `Echap` pour quitter le mode notification puis tapez `:x` et appuyez sur `Entrée` pour sauvegarder et quitter.
+
+### Créer un utilisateur et un groupe pour Samba
+
+Comme nous avons configfuré un partage sécurisé, nous allons devoir créer un utilisateur et un groupe pour pouvoir y accéder à distance.
+
+Creez le groupe.
+```sh
+sudo groupadd smbshare
+```
+
+Nous allons maintenant permettre au groupe d'avoir le controle sur le dossier `/video`.
+
+```sh
+sudo chgrp -R smbshare /video
+```
+
+Et maintenant nous allons donner les permissions nécessaires aux dossiers et fichier hérités.
+
+```sh
+sudo chmod 2775 /video
+```
+
+A présent nous allons ajouter un utilisateur nologin c'est à dire que cet utilisateur ne pourra pas se connecter sur le serveur pour faire des opérations, mais pourra tout de meme se connecter au service samba.
+
+```sh
+sudo useradd -M -s /sbin/nologin sambauser
+```
+
+Puis nous ajoutons l'utilisateur au groupe `sambashare` que nous avons créé précédemment.
+
+
+```sh
+sudo usermod -aG smbshare sambauser
+```
+Et nous allons configurer un mot de passe.
+
+```sh
+sudo smbpasswd -a sambauser
+```
+Et enfin nous allons activer le compte que nous venons de créer.
+
+```sh
+sudo smbpasswd -e sambauser
+```
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Si vous utilisez un pare-feu, comme ufw, n'oubliez pas d'autoriser les IP des machines qui accéderont à votre dossier partagé :
+:::
+    ```sh
+    sudo ufw allow from ipdelamachine to any app Samba
+::
+
+
+## Accéder à un dossier partagé
+---
+::alert{type="info"}
+:::list{type="info"}
+- A présent, nous sommes sur votre `machine-locale` qui nécessite d'accéder au dossier partagé `/video` présent sur la `machine-distante`.
+:::
+::
+
+### Installer les package nécessaires
+
+```sh
+sudo apt update && sudo apt upgrade
+sudo apt install cifs-utils
+```
+### Créer le dossier de destination
+
+Nous allons créer un dossier sur notre serveur sur lequel sera monté le dossier partagé de notre `machine-distante. C'est à dire que dans ce dossier nous retrouverons le contenu du dossier partagé de notre `machine-distante`. Ici nous appellerons ce dossier `/mnt/video`.
+
+```sh
+sudo mkdir /mnt/video
+```
+
+### Préparer le fichier .credentials
+
+Afin de ne pas avoir systématiquement à rentrer notre utilisateur et mot de passe, nous allons créer un fichier .credentials` stockant ces informations.
+
+Nous allons le créer dans le dossier `/smb`.
+
+```sh
+sudo mkdir /smb
+sudo vi /smb/.credentials
+```
+Passez en mode modification en appuyant sur `i` et configurez comme suit :
+
+```properties
+username=smbuser
+password=motdepasse
+```
+
+- `smbuser` : L'utilisateur que nous avons configuré sur la `machine-distante`
+- `motdepasse` : Le mot de passe que nous avons configuré sur la `machine-distante`
+
+Appuyez sur `Echap` afin de quitter le mode modification, puis tapez `:x` et appuyez sur `Entrée` pour sauvegarder et quitter.
+
+Nous allons modifier les permissions du dossier afin que seul le propriétaire puis lire et écrire dans ce fichier.
+
+```sh
+sudo chmod 600 /smb/.credentials
+```
+
+### Monter le dossier partager
+
+A présent nous allons monter le dossier.
+
+```sh
+sudo mount -t cifs -o credentials=/smb/.credentials //ip-machine-distante/video /mnt/video
+```
+
+Remplacez `ip-machine-distante` par l'adresse IP de votre `machine-distante`
+
+Vérifiez que cela a fonctionné en tapant :
+
+```sh
+sudo mount -t cifs
+```
+Vous verrez différentes informations qui confirmerons le succès du montage.
+
+Et voilà, à présent vous accédez au dossier /video de `votre machine-distante`, depuis votre `machine-locale` !
+
+### Automatiser le montage au boot
+
+Par défaut, les dossiers pattagés ne sont pas connectés automatiquement au redémarrage. Pour autoamtiser cet aspect, nous allons modifier le fichier `/etc/fstab`.
+
+D'abord, sauvegardons notre fichier `fstab`.
+
+```sh
+sudo cp /etc/fstab /etc/fstab.bak
+```
+
+Puis nous allons ajouter une ligne à la fin du fichier comportant les informations de montages dans le fichier `fstab`.
+
+```sh
+sudo echo //ip-machine-distante/video    /mnt/video  cifs   _netdev,nofail,credentials=/smb/.credentials,x-systemd.automount,x-systemd.device-timeout=15 0 0 >> /etc/fstab
+```
+
+Redémarrez.
+
+```sh
+sudo reboot
+```
+
+Une fois redémarré, vérifiez que le montage est correct
+
+```sh
+sudo mount -t cifs
+```
+
+Et voilà !
+
+### Démonter le dossier partagé
+
+```sh
+sudo umount -t cifs /mnt/video
+```

content/2.generalites/1.reseau/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Réseau
+icon: lucide:network

content/2.generalites/2.stockage/1.raid.md

@@ -1,13 +1,21 @@
 ---
+navigation: true
 title: RAID
-description: Comprendre le RAID, matériel vs logiciel, niveaux RAID, et comment mettre en place des grappes de disques redondants pour votre homelab.
+description: Comprendre le RAID — matériel vs logiciel, niveaux RAID, et comment mettre en place des grappes de disques redondants pour votre homelab.
+main:
+  fluid: false
 ---
-
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# RAID
 
 _Redundant Array of Independent Disks_
 
+::alert{type="info"}
+🎯 __Objectifs :__
+- Comprendre ce qu'est un système RAID
+- Comprendre quel type de RAID est adapté aux différents usages
+::
+
 En informatique, le RAID (Redundant Array of Independent Disks) est un système permettant de combiner plusieurs disques durs pour améliorer les performances et/ou la fiabilité. Il fonctionne en restructurant et en répartissant les blocs de données entre les disques.
 
 À l’origine, les systèmes RAID étaient matériels, ce qui signifiait qu’un contrôleur dédié (une puce spécifique) gérait la distribution des données et les opérations RAID. Aujourd’hui, la plupart des systèmes RAID (ou équivalents) sont logiciels. En fait, de nombreuses technologies logicielles peuvent créer des systèmes de type RAID avec des fonctionnalités indisponibles dans les RAID matériels, comme la réparation automatique (data scrubbing), les instantanés (snapshots), etc.
@@ -22,28 +30,30 @@ Il existe plusieurs types de RAID, chacun ayant ses avantages et inconvénients.
 - Vitesse d’écriture
 - Tolérance aux pannes (résistance aux défaillances matérielles)
 
-::warning
-
-  Le RAID n’est pas un système de sauvegarde mais un système de continuité de service ! Il permet seulement le remplacement à chaud des disques sans interruption du serveur ou restauration depuis une sauvegarde. Vous avez toujours besoin d’un système de sauvegarde externe.
+::alert{type="warning"}
+:::list{type="warning"}
+  - Le RAID n’est pas un système de sauvegarde mais un système de continuité de service ! Il permet seulement le remplacement à chaud des disques sans interruption du serveur ou restauration depuis une sauvegarde. Vous avez toujours besoin d’un système de sauvegarde externe.
+:::
 ::
 
 ### Sans RAID
+---
 
 <div style="display: flex; align-items: center;">
-  <img src="/img/global/no-raid.svg" alt="Image" style="max-width: 30%; max-height:230px; margin-right: 20px;">
+  <img src="/fr/img/global/no-raid.svg" alt="Image" style="max-width: 30%; max-height:230px; margin-right: 20px;">
   <ul>
     <li>Vos disques sans RAID. Les données sont stockées disque par disque.</li>
     <li>Si vous perdez un disque, seules ses données sont perdues.</li>
     <li>La capacité totale est la somme de tous les disques.</li>
-  </ul>
 </div>
 
 Utilisez vos disques sans RAID si vous n’avez pas peur de perdre des données et pouvez tolérer une interruption de service entre la panne et la restauration.
 
 ### RAID 0
+---
 
 <div style="display: flex; align-items: center;">
-  <img src="/img/global/raid0.svg" alt="Image" style="max-width: 30%; max-height:230px; margin-right: 20px;">
+  <img src="/fr/img/global/raid0.svg" alt="Image" style="max-width: 30%; max-height:230px; margin-right: 20px;">
   <ul>
     <li>Le système voit un seul disque.</li>
     <li>Les données sont entrelacées entre tous les disques.</li>
@@ -51,15 +61,15 @@ Utilisez vos disques sans RAID si vous n’avez pas peur de perdre des données
     <li>Excellentes performances en lecture et écriture (multipliées par le nombre de disques).</li>
     <li>La capacité totale est la somme de tous les disques.</li>
     <li>Minimum de 2 disques requis.</li>
-  </ul>
 </div>
 
 Utilisez RAID 0 si vous souhaitez privilégier la performance et que la perte de données n’est pas un problème. Idéal pour le stockage temporaire à haute vitesse (montage vidéo, IA, etc). Pas adapté au stockage à long terme.
 
 ### RAID 1
+---
 
 <div style="display: flex; align-items: center;">
-  <img src="/img/global/raid1.svg" alt="Image" style="max-width: 30%; max-height:230px; margin-right: 20px;">
+  <img src="/fr/img/global/raid1.svg" alt="Image" style="max-width: 30%; max-height:230px; margin-right: 20px;">
   <ul>
     <li>Le système voit un seul disque.</li>
     <li>Tous les disques contiennent les mêmes données.</li>
@@ -67,18 +77,18 @@ Utilisez RAID 0 si vous souhaitez privilégier la performance et que la perte de
     <li>Vitesse de lecture améliorée (selon le nombre de disques).</li>
     <li>Capacité totale égale à un seul disque (ex. : 2×10 To = 10 To).</li>
     <li>Minimum de 2 disques requis.</li>
-  </ul>
 </div>
 
 Utilisez RAID 1 pour une redondance maximale. Chaque disque contient toutes les données, donc les performances ne sont pas affectées en cas de panne. Une fois les disques remplacés, les données sont rapidement restaurées. Mais la capacité utilisable est limitée à un seul disque, ce qui en fait une solution coûteuse.
 
-::tip{icon=""}
+::alert{type="success"}
 ✨ __Astuce :__ Vous pouvez combiner le RAID 1 avec d’autres types de RAID pour créer des grappes miroir.
 ::
 
 ### RAID 5
+---
 <p align="center">
-  <img src="/img/global/raid5.svg" alt="Image" style="max-width: 40%; margin-right: 20px;">
+  <img src="/fr/img/global/raid5.svg" alt="Image" style="max-width: 40%; margin-right: 20px;">
 </p>
 
 - Le système voit un seul disque.
@@ -91,8 +101,9 @@ Utilisez RAID 1 pour une redondance maximale. Chaque disque contient toutes les
 Utilisez RAID 5 pour un stockage fiable avec 3 à 5 disques et une perte minimale d’espace. Il tolère une panne, mais la reconstruction peut durer plusieurs jours avec des performances dégradées.
 
 ### RAID 6
+---
 <p align="center">
-  <img src="/img/global/raid6.svg" alt="Image" style="max-width: 50%; margin-right: 20px;">
+  <img src="/fr/img/global/raid6.svg" alt="Image" style="max-width: 50%; margin-right: 20px;">
 </p>
 
 - Le système voit un seul disque.
@@ -103,6 +114,3 @@ Utilisez RAID 5 pour un stockage fiable avec 3 à 5 disques et une perte minimal
 - Minimum de 4 disques (6 recommandés pour minimiser la perte d’espace).
 
 Utilisez RAID 6 dans les mêmes cas que RAID 5, surtout avec 6 disques ou plus. Plus de disques = plus de risque de panne. RAID 6 vous apportera plus de fiabilité en cas de panne simultanée de deux disques. Il n'y a rien de plus frustrant que de perdre un second disque en pleine reconstruction du remplacement du premier.
-
-## RAID logiciel
-(bientôt)

content/2.generalites/2.stockage/2.zfs.md

@@ -1,29 +1,31 @@
 ---
+navigation: true
 title: ZFS
-description: Introduction à ZFS, système de fichiers et gestionnaire de volumes combinés avec snapshots, checksums et redondance intégrée pour un stockage fiable.
+description: Introduction à ZFS — système de fichiers et gestionnaire de volumes combinés avec snapshots, checksums et redondance intégrée pour un stockage fiable.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# ZFS
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Comprendre ce qu'est ZFS et son utilité
+::
+
+ZFS est populaire dans le monde des serveurs, des NAS (comme FreeNAS / TrueNAS), de la virtualisation, et même chez les particuliers qui veulent un stockage résilient. C'est est un _système de fichier_ (à l'instar de NTFS pour windows, EXT4, FAT32 etc...) mais également un __gestionnaire de volume__ (comme LVM par exemple). Pour le dire (très) rapidement, un gestionnaire de volume arrange l'espace sur des espaces physiques comme un ou plusieurs disques durs, et un gestionnaire de fichier arrange la maniere dont sont organisés les blocs de données dans ces volumes pour écrire, lire et supprimer les données.
 
 
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
-
-
-ZFS est populaire dans le monde des serveurs, des NAS (comme FreeNAS / TrueNAS), de la virtualisation, et même chez les particuliers qui veulent un stockage résilient. C'est est un _système de fichier_ (à l'instar de NTFS pour windows, EXT4, FAT32 etc...) mais également un _gestionnaire de volume_ (comme LVM par exemple).
-
-Pour le dire simplement :  
-
-- un **gestionnaire de volume** organise le stockage physique (un ou plusieurs disques durs).  
-- un **système de fichiers** organise la manière dont les blocs de données sont écrits, lus et supprimés dans ces volumes.
-
-ZFS dépasse largement les limites des autres systèmes de fichiers, que ce soit en termes de performance ou de fonctionnalités.  
+ZFS dépasse largement les limites des autres systèmes de fichiers, que cela soit en terme de performance ou de fonctionnalité.
 Ce qui nous intéresse le plus :
-
 - ses fonctionnalités de __gestion des instantanés__ (snaphsot), permettant de rapidement revenir en arrière en cas de problème
-- sa gestion des grappes de disques et [__ses équivalent au RAID__](/general/storage/raid) (Z-Mirror, RAIDZ1, RAIDZ2, RAIDZ3)
+- sa gestion des grappes de disques et [__ses équivalent au RAID__](/generalites/stockage/raid) (Z-Mirror, RAIDZ1, RAIDZ2, RAIDZ3)
 - sa __reconstruction automatique des données corrumpues__ (via le scrubbing)
 - ses performance avec son cache RAM (ZFS ARC)
 - ses notifications en cas d'erreur
 
 ## Structure
+
 ![](/img/global/zfs.svg)
 
 ZFS dispose d'une structure particulière :
@@ -33,20 +35,19 @@ ZFS dispose d'une structure particulière :
 - __dataset__ : un système de de donnée dans un _zpool_. Chaque dataset peut avoir ses propres options (compression, quotas, permissions, etc.).
 
 Il existe plusieurs types de dataset :
-
 - __file system__ : un système de fichier, ZFS par défaut, monté comme un volume sans quota de stockage.
 - __zvol__ : un "disque virtuel" avec un quota d'espace, que vous pouvez formater/partitionner comme vous le souhaitez. Il sera utilisable comme un disque physique.
 - __snapshot__ : un état figé d’un autre dataset à un instant donné. Ils peuvent etre créés manuellement ou via des outils de sauvegarde. Ils peuvent etre montés pour parcourir les données dans leur état au moment du snapshot.
 
 ## Pourquoi ZFS vs les autres ?
+
 ### Intégrité des données
 
 ZFS vérifie automatiquement que les données stockées ne sont pas corrompues. Chaque bloc de données est accompagné d’une empreinte (checksum) qui permet à ZFS de détecter toute altération, même minime. Et s’il y a un problème, il peut souvent le réparer automatiquement, si une copie saine existe ailleurs dans le système.
 
 ### RAID intégré
 
-ZFS propose son propre système de gestion de volumes (vdev). Vous pouvez créer un pool de stockage (zpool) en combinant plusieurs disques, un peu comme avec le [RAID](/general/storage/raid) classique, mais de façon plus souple. Par exemple :
-
+ZFS propose son propre système de gestion de volumes (vdev). Vous pouvez créer un pool de stockage (zpool) en combinant plusieurs disques, un peu comme avec le [RAID](/generalites/stockage/raid) classique, mais de façon plus souple. Par exemple :
 - __Z-mirror__ => equivalent du RAID 1
 - __RAIDZ1__ => équivalent du RAID 5 (tolérance à 1 panne disque)
 - __RAIDZ2__ => équivalent du RAID 6 (tolérance à 2 pannes disque)
@@ -54,9 +55,10 @@ ZFS propose son propre système de gestion de volumes (vdev). Vous pouvez créer
 
 ZFS gère cela directement, pas besoin de logiciel RAID externe.
 
-::note
-
-Consultez [l'article sur le RAID](/general/storage/raid) pour en savoir plus sur la solution qui vous convient.
+::alert{type="info"}
+:::list{type="info"}
+- Consultez [l'article sur le RAID](/generalites/stockage/raid) pour en savoir plus sur la solution qui vous convient.
+:::
 ::
 
 ### Snapshots et clones
@@ -67,6 +69,4 @@ ZFS permet de créer des snapshots, c’est-à-dire des captures instantanées d
 
 ZFS peut compresser les données à la volée (transparente pour l’utilisateur), ce qui permet d’économiser de l’espace disque. Il propose aussi la déduplication (éliminer les doublons), mais cette fonctionnalité consomme beaucoup de mémoire et n’est pas recommandée pour tous les usages.
 
----
-
-Voilà, à présent vous savez pourquoi ZFS est *Ze* système de fichiers à déployer sur votre NAS.
+Voilà, à présent vous savez pourquoi ZFS est Ze systeme de fichier à déployer sur votre NAS.

content/2.generalites/2.stockage/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Stockage
+icon: lucide:hard-drive

content/2.generalites/3.hardware/1.bases.md

@@ -1,27 +1,33 @@
 ---
+navigation: true
 title: Les bases
-description: Les fondamentaux du matériel serveur. CPU, RAM, stockage et facteurs de forme pour bien démarrer votre homelab.
+description: Les fondamentaux du matériel serveur — CPU, RAM, stockage et facteurs de forme pour bien démarrer votre homelab.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Les bases d'un serveur
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+::alert{type="info"}
+🎯 __Objectifs :__
+- Comprendre les bases du hardware d'un serveur
+::
 
 ![hardware](/img/global/hardware.svg)
 
 Un __serveur__ n'est rien d'autre qu'un ordinateur dédié à des taches particulières, ayant vocation à rester accessible en permanence. En soi, sa structure ne diffère pas d'un ordinateur classique, si ce n'est que selon l'usage cible, on fera évoluer certains composants dans un sens ou dans un autre. Dans cet article, vous trouverez un aide mémoire pour comprendre quels sont les composants essentiels d'un serveur et comprendre leur fonction selon vos usages.
 
 ## La carte mère
+---
 La __carte mère__ est le socle de votre machine. C'est le composant qui relie tous les autres composants. Elle sert à les faire communiquer et à interagir avec vos périphériques (clavier, souris, etc...). Il faut donc la choisir en fonction de vos besoins en terme d'entrées/sorties (I/O) comme le nombre de ports USB, de ports réseau, leur vitesse, etc... Mais il faut également veiller à sa compatibilité avec les autres composants que vous allez brancher dessus.
 
 Les composants importants à brancher dessus sont :
-
 - le CPU
 - la RAM
 - le stockage (HDD et/ou SSD)
 - l'eventuel GPU dédié
 
 Il existe plusieurs formats de carte mère grand public :
-
 - E-ATX : les plus grosses
 - ATX : le standard
 - Micro-ATX : plus petit
@@ -30,18 +36,22 @@ Il existe plusieurs formats de carte mère grand public :
 Bien sûr, selon la taille, le nombre de ports et de fonctionnalité diffère. D'autre part, les constructeurs de machines déjà assemblées peuvent aussi profiter de formats plus personnalisés.
 
 ## Le CPU
+---
+
 <div style="display: flex; align-items: center;">
   <img src="/img/global/cpu.svg" alt="Image" style="max-width: 25%; max-height:230px; margin-right: 20px;">
-  <p>Le <strong>CPU</strong> (Central processor Unit) est la supercalculette de l’ordinateur. Il traite la plupart des tâches logicielles. Aujourd’hui les processeurs comportent plusieurs cœurs, parfois eux même divisé en deux de façon logicielle, afin de mieux répartir la charge de travail et optimiser son fonctionnement. Il nécessite d'etre refroidit avec un dissipateur actif (avec ventilateur) ou passif (sans ventilateur) selon la chaleur qu'iil dégage, et donc selon la puissance en Watt qu'il requiert. Dans le cadre d'un serveur, on veillera donc à le choisir selon les usages que l'on aura. </p>
+  <p>
+Le <strong>CPU</strong> (Central processor Unit) est la supercalculette de l’ordinateur. Il traite la plupart des tâches logicielles. Aujourd’hui les processeurs comportent plusieurs cœurs, parfois eux même divisé en deux de façon logicielle, afin de mieux répartir la charge de travail et optimiser son fonctionnement. Il nécessite d'etre refroidit avec un dissipateur actif (avec ventilateur) ou passif (sans ventilateur) selon la chaleur qu'iil dégage, et donc selon la puissance en Watt qu'il requiert. Dans le cadre d'un serveur, on veillera donc à le choisir selon les usages que l'on aura. </p>
 </div>
 
-::warning
-
-__Attention :__ N'oubliez pas que pour installer un dissipateur tiers, vous devez vous assurer qu'il soit compatible avec le socket de votre processeur, c'est à dire le socle sur lequel il est installé sur la carte mère, et que vous devez également appliquer de la pate thermique sur le CPU avant d'installer le dissipateur. 
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ N'oubliez pas que pour installer un dissipateur tiers, vous devez vous assurer qu'il soit compatible avec le socket de votre processeur, c'est à dire le socle sur lequel il est installé sur la carte mère, et que vous devez également appliquer de la pate thermique sur le CPU avant d'installer le dissipateur. 
+:::
 ::
 
-Il faut les juger selon :
 
+Il faut les juger selon :
 - Leur nombre de coeurs (plus ils en ont, plus il peuvent paralléliser les tâches)
 - La fréquence de ces coeurs en Giga Hertz _Ghz_
 - Leur consommation en Watt _W_
@@ -49,6 +59,7 @@ Il faut les juger selon :
 Dans le cadre d'un homelab/NAS sans calcul intensif, aujourd'hui on se dirigera facilement vers les Intel N100/150 (4 coeurs) et N305/N355 (8 coeurs) qui sont des processeurs performants à très faible consommation (rappelez vous que ces machines sont censées tourner H24).
 
 ## La RAM
+---
 
 <p align="center">
   <img src="/img/global/ram.svg" alt="Image" style="max-width: 65%; margin-right: 20px;">
@@ -59,96 +70,83 @@ La __RAM__ (Random Access Memory), est une zone de stockage éphémère ultra ra
 Elle prend généralement la forme de barettes, à brancher sur la carte mère. Il en existe plusieurs format selon le type de carte mère, et de plusieurs générations (DDR5 de nos jours).
 
 ## Le GPU 
+---
 
-Le __GPU__ (Graphical Processor Unit) est un processeur dédié aux calculs graphiques, vidéo, et parfois d'intelligence artificielle. Dans le cadre d'un serveur, il aura son utilité pour tout ce qui touche au media center (par exemple [Jellyfin](/serveex/media/jellyfin)), mais aussi en terme d'accélération matérielle pour les calculs d'IA comme la reconnaissance faciale ou la recherche sur des photos (comme via [Immich](/serveex/cloud/immich) par exemple).
+Le __GPU__ (Graphical Processor Unit) est un processeur dédié aux calculs graphiques, vidéo, et parfois d'intelligence artificielle. Dans le cadre d'un serveur, il aura son utilité pour tout ce qui touche au media center (Streaming de video comme [Plex](/serveex/media/plex) par exemple), mais aussi en terme d'accélération matérielle pour les calculs d'IA comme la reconnaissance faciale ou la recherche sur des photos (comme via [Immich](/serveex/cloud/immich) par exemple).
 
 Selon la puissance requise, on choisira un GPU dédié avec sa propre VRAM (une carte graphique à brancher sur un port PCIe de la carte mère), ou un iGPU, c'est à dire un GPU compris dans le CPU (comme les N100/N150 et N305/N355), qui utilisera la RAM globale de la machine
 
-## Le ou les HDD
+
+### Le ou les HDD
+---
 
 <p align="center">
   <img src="/img/global/hdd.svg" alt="Image" style="max-width: 50%; margin-right: 20px;">
 </p>
 
-Un __HDD__ (Hard Disk Drive) ou disque dur, est un composant servant à stocker des données. Autrefois, c'etait le stockage standard des machines informatiques. Ils sont constitués d'un ou plusieurs disques superposés en plateau, et de têtes de lecture, presque comme une platine vinyle.
-
-Aujourd'hui, les HDD peuvent stocker des quantités extraordinaires de données (jusqu'à 30 To, soit 30 000 gigaoctets, pour les modèles grand public), mais ils restent limités en vitesse de lecture et d'écriture par leur nature mécanique. Ils sont également volumineux et très lourds.
+Un __HDD__ (Hard Disk Drive) ou disque dur, est un composant servant à stocker des données. Autrefois, c'etait le stockage standard des machines informatiques. Ils sont constitués d'un ou plusieurs disques superposés en plateau, et de têtes de lecture, presque comme une platine vinyle. Si aujourd'hui on arrive à stocker des quantités extraordinaire de données dans un HDD (jusqu'à 30To soit 30 000 Giga-octet de nos jours pour le grand public), ils sont limités dans leur vitesse de lecture et d'écriture par leur caractère mécaniques. Ils sont également volumineux et très lourds. 
 
 De manière générale, on les privilégiera pour stocker des données qui ne servent pas à des calculs et ne nécessitent pas d'ecriture rapide, comme les media (videos, photos...) ou les cloud drive, stockage d'archives, etc. Ils sont performants dans ces scenario et surtout coutent beaucoup moins cher que des SSD à espace de stockage égal.
 
-::tip{icon="" to="/general/storage/raid"}
-✨ __Astuce :__ combinez plusieurs HDD en **RAID** pour améliorer les performances et la redondance.
+::alert{type="success"}
+✨ __Astuce :__ Vous pouvez combiner plusieurs HDD ensemble en [RAID](/generalites/stockage/raid) afin d'accroitre les performances de votre machine.
 ::
 
 Il existe plusieurs formats de HDD : 3.5" et 2.5". De manière générale dans un serveur on privilégiera les 3.5, plus fiables.
 
-## Le ou les SSD
+
+### Le ou les SSD
+---
 
 <p align="center">
   <img src="/img/global/nvme.svg" alt="Image" style="max-width: 50%; margin-right: 20px;">
 </p>
 
-Un __SSD__ (Solid State Drive) est une petite carte sur laquelle sont soudées des puces de mémoires servant à stocker de l'information. Contrairement à la RAM, ces puces conservent les informations même lorsqu'elles ne sont pas alimentées et donc les conservent après un redémarrage. C'est ce qui sert globalement de stockage principal pour votre serveur.
-
-Contrairement aux HDD, ils ne disposent pas de parties mécaniques, sont très miniaturisés et surtout extrêmement rapides, de l'ordre de plusieurs gigaoctets par seconde pour les plus performants.
+Un __SSD__ (Solid State Drive) est une petite carte sur laquelle sont soudées des puces de mémoires servant à stocker de l'information. Contrairement à la RAM, ces puces conservent les informations même lorsqu'elles ne sont pas alimentées et donc les conservent après un redémarrage. C'est ce qui sert globalement de stockage pour votre serveur. Contrairement aux HDD, ils ne disposent pas de parties mécaniques, sont très miniaturisés et surtout sont extrêmement rapides, de l'ordre de plusieurs Giga-octets par seconde pour les plus performants. 
 
 On les trouve dans plusieurs formats, aujourd'hui on priviligiera les versions M.2 NVMe, car ce sont les plus petits et plus rapides, et sont devenu un standard sur les cartes mères.
 
-Ils sont en revanche beaucoup plus chers que les disque durs à capacité de stockage égale. Généralement, on y stockera au moins le système d'exploitation de la machine (Operating System ou OS) pour garantir une certaine rapidité d'execution. Dans le cadre d'un serveur, on y stockera aussi si possible les conteneurs type [docker](/serveex/core/docker) et les bases de données. De manière générale, toute données dont un a besoin régulièrement et rapidement pour des calculs (site web, applications, etc...).
+Ils sont en revanche beaucoup plus chers que les disque durs à capacité de stockage égale. Généralement, on y stockera au moins le système d'exploitation de la machine (Operating System ou OS) pour garantir une certaine rapidité d'execution. Dans le cadre d'un serveur, on y stockera aussi si possible les conteneurs type [docker](/serveex/coeur/docker) et les bases de données. De manière générale, toute données dont un a besoin régulièrement et rapidement pour des calculs (site web, applications, etc...).
 
-## La carte réseau
+### La carte réseau
+---
 
 Une __carte réseau__ sert à faire communiquer votre machine avec votre réseau (dont internet). Elle est composée d'une puce de controle et d'un ou plusieurs port réseau. Ces ports peuvent dits _ports ethernet_ peuvent être dans plusieurs formats physique et dans plusieurs normes de débit :
-
-- RJ45 Gigabit ethernet 10/100/1000 : le format standard de prise RJ45 permettant de dialoguer à des débit allant de 10Mbps (soit 1,25Mo/s) à 1000Mbps (soit 125Mo/s)
+- RJ45 Gigabit ethernet 10/100/1000 : le format standard de prise RJ45 permettant de dialoguer à des débit allant de 10Mbps (soit 0,125Mo/s) à 1000Mbps (soit 125Mo/s)
 - RJ45 2.5G : Même prise, pouvant dialoguer jusqu'à 2,5Gpbs soit 2 500Mbps (donc 312,5Mo/s)
 - RJ45 5G : Même prise, pouvant dialoguer jusqu'à 5Gpbs (donc 625Mo/s)
 - RJ45 10G Base T : Même prise pouvant dialoguer jusqu'à 10Gbs (soit 1,25Go/s)
 - SFP 1G : Prise SFP, généralement utilisée pour la fibre optique, pouvant dialoguer jusqu'à 1Gpbs
 - SFP+ 10G : Prise SFP amélioriée, aussi utilisée pour la fibre optique, pouvant dialoguer jusqu'à 10Gbps.
 
-::warning
-
-__Attention :__ Pensez bien à dimensionner vos appareils réseaux (routeurs, switch, cables...) en fonction du débit que vous souhaitez entre vos appareils. D'autre part, il existe plusieurs normes de cables RJ45 selon la vitesse permise. On privilegiera dans la plupart des cas des cables RJ45 CAT5E, et au delà de 10Gbps, on privilégiera du CAT6A, bien que le CAT5E soit utilisable à ces vitesses à courte distance. Quant à la fibre, c'est tout un sujet (simplex, duplex, transceiver...).
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Pensez bien à dimensionner vos appareils réseaux (routeurs, switch, cables...) en fonction du débit que vous souhaitez entre vos appareils. D'autre part, il existe plusieurs normes de cables RJ45 selon la vitesse permise. On privilegiera dans la plupart des cas des cables RJ45 CAT5E, et au delà de 10Gbps, on privilégiera du CAT6A, bien que le CAT5E soit utilisable à ces vitesses à courte distance. Quant à la fibre, c'est tout un sujet (simplex, duplex, transceiver...).
+:::
 ::
 
-La carte réseau est généralement directement intégrée à la carte mère, mais vous pouvez aussi utiliser des cartes réseau dédiées, par exemple en USB ou via un port d'extension PCIe.
+La carte réseau est généralement directement intégrée à la carte mère, mais vous pouvez utiliser des cartes réseau dédiées comme par USB par exemple ou via un port d'extension PCIe. De manière générale, sur un serveur, on appréciera d'avoir au moins deux ports ethernet afin d'avoir de la redondance en cas de panne.
 
-De manière générale, sur un serveur, on appréciera d'avoir au moins deux ports ethernet afin d'avoir de la redondance en cas de panne.
+### Entrées et sorties
+---
 
-## Entrées et sorties
+Les __ports d'entrées et sorties__ (Input/Outpout) sont l'ensemble des ports de la machine permettant d'échanger de l'information avec des appareils externes (écrans, clavier, souris, réseau...). Généralement, sur une carte mère on retrouve le ou les ports réseaux, des ports USB de plusieurs formats et vitesse différentes, un ou plusieurs port vidéo, et des ports audio.
 
-Les __ports d'entrées et sorties__ (I/O) permettent de communiquer avec des appareils externes (écrans, clavier, souris, réseau...). Sur une carte mère, on trouve généralement :
+Selon vos usages, vous devrez choisir votre carte mere et ses éventuelles cartes d'extension en fonction de vos besoin à ce niveau.
 
-- des ports Ethernet
-- des ports USB (formats et vitesses variés)
-- des ports vidéo
-- des prises audio
+### L'alimentation
+---
 
-Choisissez votre carte mère et ses cartes d'extension en fonction de vos besoins en I/O.
+__L'alimentation__ est le composant qui permet d'alimenter électriquement les composants de votre machine. Elle se compose d'un cable secteur en entrée, et de plusieurs types de cables en sorties. Ces cables se branchent sur la carte mère et différents périphériques le nécessitant, comme les disques dur, ou certaines cartes graphiques dédiées. L'alimentation se caractérise par sa puissance, en Watt, sa modularité (cables attachés ou détachables), et son rendement, en pourcentage. Comprendre qu'une alimentation de 500W avec un rendement de 80% consommera en fait 625W pour fournir ces 500W.
 
-## L'alimentation
-
-__L'alimentation__ est le composant qui fournit l'énergie électrique aux composants de votre machine. Elle se branche au secteur par un cordon et dispose de plusieurs câbles de sortie qui vont sur la carte mère et sur divers périphériques, comme les disques durs ou les cartes graphiques dédiées.
-
-Une alimentation se caractérise par plusieurs éléments clés :
-
-- sa puissance (sa capacité totale, en watts),
-- sa modularité (câbles fixes ou détachables),
-- son rendement (en pourcentage). Par exemple, une alimentation de 500W avec 80% de rendement tirera en réalité 625W au mur pour fournir 500W à la machine.
-
-Un autre facteur important est le format. Il en existe plusieurs standard, comme ATX L pour les plus grandes jusqu'à SFX pour les plus petites. Il en existe aussi des spécifiques aux serveurs rackables, par définition assez plats.
+Une autre caractéristiques des alimentations sont leur format. Il en existe plusieurs standard, comme ATX L pour les plus grandes jusqu'à SFX pour les plus petites. Il en existe aussi des spécifiques aux serveurs rackables, par définition assez plats.
 
 Pour choisir votre alimentation, la convention est d'estimer la puissance electrique demandée par votre machine à usage et de multiplier par deux cette puissance. En effet, le rendement des alimentations se situe environ à 50% de sa charge totale.
 
-## Le boitier
+### Le boitier
+---
 
 <div style="display: flex; align-items: center;">
   <img src="/img/global/case.svg" alt="Image" style="max-width: 25%; max-height:230px; margin-right: 20px;">
-  <p>Le <strong>boitier</strong> est également un composant essentiel pour votre machine. Il joue un rôle clé dans le refroidissement, avec ses ventilateurs et sa conception des flux d'air, et il détermine la compatibilité de format de votre carte mère, de votre alimentation et de l'éventuel GPU dédié que vous installerez.
-</p>
+  <p>Le <strong>boitier</strong> est également un composant essentiel pour votre machine. Il conditionne le refroidissement de cette dernière, avec ses ventilateurs et sa conception gérant les flux d'air, mais aussi le format de votre carte mere, de votre alimentation et de votre éventuel GPU dédié. D'autre part, il conditionne également le nombre de HDD et leur format. Certains boitiers sont dit rackables, c'est à dire qu'ils peuvent etre fixés dans des racks pour des armoires informatiques (baies serveurs). Choisissez consciencieusement votre boitier en fonction de vos besoins.</p>
 </div>
-
-Par ailleurs, le boitier détermine combien de HDD vous pouvez installer et quels formats ils acceptent. Certains boitiers sont rackables, c'est-à-dire qu'ils peuvent être installés dans des racks (baies serveurs).
-
-Choisissez votre boitier avec soin en fonction de vos besoins précis et du matériel que vous comptez utiliser.

content/2.generalites/3.hardware/2.reseau.md

@@ -1,63 +1,72 @@
 ---
+navigation: true
 title: Réseau
-description: Aperçu du matériel réseau pour homelab. Switches, cartes réseau, câbles et comment connecter efficacement vos serveurs.
+description: Aperçu du matériel réseau pour homelab — switches, cartes réseau, câbles et comment connecter efficacement vos serveurs.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Réseau
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+::alert{type="info"}
+🎯 __Objectifs :__
+- Comprendre les bases du matériel réseau
+::
 
 ![hardware](/img/global/hardware-networking.svg)
 
 Un réseau informatique est indissociable du matériel nécessaire à le mettre en place. Le matériel va conditionner les dimension du réseau, les vitesses de communication et les performances du réseau. Dans cet article, nous nous limiterons au réseau les plus simples, composant généralement ceux que l'on peut retrouver chez soi.
 
 ## Le routeur
+---
 Le __routeur__ est le point central de votre réseau. C'est lui qui dirige les __paquets__, c'est à dire les blocs d'informations qui transitent sur votre réseau, de l'émetteur vers le bon destinataire. Il permet à la fois de conditionner le routage de l'information au sein de votre réseau mais aussi vers ou depuis l'exterieur. Globalement, il fait communiquer les appareils entre eux et avec internet.
 
 Vous avez tous un routeur chez vous, c'est la __box__ de votre _FAI_ (Fournisseur d'Accès à Internet).
 
 Plus généralement, un routeur est composé :
-
 - d'un port WAN (Wide Area Network) recevant les informations depuis l'internet (ou un réseau de hiérarchie supérieure). Par exemple un port recevant la fibre optique de votre opérateur, ou un port SFP+/RJ45 pour un routeur tiers.
 - d'un switch, c'est à dire d'un hub composé de plusieurs ports __LAN__ (Local Area Network) permettant de connecter plusieurs lignes et appareils à votre routeur. Ils peuvent etre RJ45 ou SFP/SFP+.
 - parfois d'un emetteur/recepteur WiFi
 
-Le routeur peut posséder des capacité de _firewall_, c'est à dire de limiter le traffic d'appareils en particulier, et de _[NAT (Network Adress Translation)](/general/networking/nat)_, c'est à dire de redirection de port. Il possède aussi généralement un _[DHCP (Dynamic Host Configuration Protocol)](/general/networking/nat#le-dhcp)_, servant à attribuer dynamiquement des _adresses IP_ à votre matériel branché au réseau.
+Le routeur peut posséder des capacité de _firewall_, c'est à dire de limiter le traffic d'appareils en particulier, et de _[NAT (Network Adress Translation)](/generalites/reseau/nat)_, c'est à dire de redirection de port. Il possède aussi généralement un _[DHCP (Dynamic Host Configuration Protocol)](/generalites/reseau/nat#le-dhcp)_, servant à attribuer dynamiquement des _adresses IP_ à votre matériel branché au réseau.
 
 Le routeur conditionne directement la vitesse de communication entre vos appareils. En effet, le port WAN conditionne le débit qu'il peut recevoir de la part de votre FAI. Si vous avez un abonnement de 5 Gb/s, il vous faudra un port WAN d'au moins 5 Gb/s. Mais il conditionne également la vitesse de communication entre vos équipements. Si vous avez des appareils qui communiquent à 5 Gb/s, il faudra que la partie _switch_ du routeur disposent de ports 5 Gb/s. Enfin, si vous avez du matériel WiFi 7 et que vous souhaitez profiter de ces débits, il faudra également que votre routeur le supporte. Et dans le cas d'une borne Wifi tierce, n'oubliez pas que son port réseau doit disposer d'un débit au moins égale au WiFi qu'il diffuse, et le routeur également.
 
 Débit internet, nombre d'équipements à brancher, débit WiFi, débit réseau, ce sont quatre points à regarder avec attention lorsque vous souscrivez à une offre avec une box internet ou lorsque vous achetez votre propre routeur.
 
-::tip{icon=""}
+
+::alert{type="success"}
 ✨ __Astuce :__
 Vous pouvez utiliser sans difficulté un routeur tiers pour votre réseau qui remplacera la gestion de votre box internet si celle-ci surpporte le mode _Bridge_. En France seul l'opérateur Free le permet. C'est également possible avec les opérateurs ne disposant pas de ce mode, mais avec de grandes difficultés et sans toutes les fonctionnalités qu'un routeur tiers pourrait vous apporter.
 ::
 
 ## Le Switch
+---
 
 Le __switch__ ou commutateur, est un appareil qui permet de brancher plusieurs appareils au réseau. C'est littéralement un hub, qui se connecte directement au routeur ou à un autre switch, jusqu'au routeur. Il permet d'éviter de saturer toutes les prises switch du routeur, ou de délocaliser le matériel dans une autre pièce, sans tirer un cable par appareil vers le routeur. Un autre cas d'usage est de pouvoir séparer plusieurs réseaux gérés par un meme routeur.
 
 Il en existe globalement de deux types :
-
 - Les switch non managés, les plus courants. Ils sont plug-n-play, c'est à dire que vous les branchez et tout est réglé tout seul.
 - Les switchs managés. Ils disposent d'une interface de configuration (en ligne de commande ou via une interface web), servant à affiner les règles de routages asservies au routeur. C'est très efficace pour séparer des réseaux virtuels entre vos appareils, mais généralement nécessite beaucoup de temps de configuration et sont moins pratiques à utiliser qu'un simple switch non managé.
 
-::warning
 
-__Attention :__ Veillez à bien utiliser un switch avec des ports disposant des débits cohérents avec le matériel de votre réseau 
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Veillez à bien utiliser un switch avec des ports disposant des débits cohérents avec le matériel de votre réseau 
+:::
 ::
 
 ## Les cables
+---
 
-Les cables sont des composants essentiels de votre réseau. Selon leur type et catégorie, ils limiteront le débit entre vos appareils et nécessitent donc d'etre dimensionnés de manière cohérente avec votre réseau. Ils doivent aussi être compatibles avec les ports de vos appareils.
+Les cables sont des composants essentiels de votre réseau. Selon leur type et catégorie, ils limiteront le débit entre vos appareils et nécessitent donc d'etre dimensionnés de manière cohérente avec votre réseau. Ils doivent être compatibles avec les ports de vos apapreils. Pour rappel, voici les normes de ports les plus utilisées:
+- RJ45 Gigabit ethernet 10/100/1000 : le format standard de prise RJ45 permettant de dialoguer à des débit allant de 10Mbps (soit 0,125Mo/s) à 1000Mbps (soit 125Mo/s)
+- RJ45 2.5G : Même prise, pouvant dialoguer jusqu'à 2,5Gpbs soit 2 500Mbps (donc 312,5Mo/s)
+- RJ45 5G : Même prise, pouvant dialoguer jusqu'à 5Gpbs (donc 625Mo/s)
+- RJ45 10G Base T : Même prise pouvant dialoguer jusqu'à 10Gb/s (soit 1,25Go/s)
+- SFP 1G : Prise SFP, généralement utilisée pour la fibre optique, pouvant dialoguer jusqu'à 1Gpbs
+- SFP+ 10G : Prise SFP amélioriée, aussi utilisée pour la fibre optique, pouvant dialoguer jusqu'à 10Gb/s.
 
-Voici un rappel des normes de cables et de ports les plus courantes :
-
-- **RJ45 Gigabit Ethernet 10/100/1000** : le format standard de prise RJ45 permettant de dialoguer à des débit allant de 10Mbps (soit 1,25Mo/s) à 1000Mbps (soit 125Mo/s)
-- **RJ45 2.5G** : Même prise, pouvant dialoguer jusqu'à 2,5Gpbs soit 2 500Mbps (donc 312,5Mo/s)
-- **RJ45 5G** : Même prise, pouvant dialoguer jusqu'à 5Gpbs (donc 625Mo/s)
-- **RJ45 10GBase-T** : Même prise pouvant dialoguer jusqu'à 10Gb/s (soit 1,25Go/s)
-- **SFP 1G** : Prise SFP, généralement utilisée pour la fibre optique, pouvant dialoguer jusqu'à 1Gpbs
-- **SFP+ 10G** : Prise SFP amélioriée, aussi utilisée pour la fibre optique, pouvant dialoguer jusqu'à 10Gb/s.
 
 ### Les cables Ethernet
 
@@ -77,45 +86,31 @@ Ils sont définis en plusieurs catégorie, définissant le débit maximal selon
 | 100 Mbs  | CAT 5          | 100 m        |
 
 Certains de ces cables sont plats, ronds, blindés (à relier à la terre), etc. Choisissez en fonction de votre installation. ce qu'il faut comprendre, c'est que pour relier un appareil qui dispose d'une prise RJ45 ethernet 2.5 Gb/s sur un routeur 2.5G b/s, il faut au moins un cable `CAT 5e`.
-
 En revanche, si votre appareil est limité à 100 Mb/s, vous n'avez besoin que d'un cable `CAT 5`.
 
 Aujourd'hui, dans les nouvelles construction, la norme est d'installer des cables `CAT 6A` dans les murs. Ainsi, les prises murales sont prêtes à accepter du 10 Gb/s sur 100 m
 
-
 ### Les cables optiques
-
-Très fins mais très fragile, on commence à les voir de plus en plus dans les installations chez soi. A commencer par le cable opérateur qui relie votre prise fibre à votre box/routeur. Ils ont plusieurs avantages :
-
-- Extrêmement compacts
-- Consommation électrique nulle (contrairement au cuivre, qui perd de l'énergie en chaleur)
-- Aucun rayonnement électromagnétique (pas besoin de blindage, pas de perturbation du signal)
-- Débits très élevés sur de longues distances
+Très fins mais très fragile, on commence à les voir de plus en plus dans les installations chez soi. A commencer par le cable opérateur qui est relié entre votre prise fibre et votre box/routeur. Ils ont l'avantage de prendre peu de place, de ne rien consommer comparé à un cable en cuivre qui subit des déperdition d'energie liée à la chauffe, de n'emettre aucun rayonnement (pas besoin de blindage, pas de perturbation du signal) et d'accepter des débits très élevés sur de longue distance.
 
 Pour du réseau local, il faut comprendre qu'il existe plusieurs types de cables fibres, conditionnant le débit selon la distance, et conditionnant le type de `transceiver` à utiliser. En effet, les cables fibres se branchent sur les ports SFP+ de vos appareils, via un petit objet qui traduit le signal lumineux en information électrique, et qui, dans le sens inverse, traduit les informations électrique en signal lumineux.
 
 Globalement, pour du réseau local, on évitera de choisir autre chose qu'un cable multimode OM3 avec prise LC, avec un transceiver LC SFP+ 10G. Cela permet de relier des appareils en 10 Gb/s et est compatible avec la plupart des appareils disposant d'un port SFP+.
 
-::warning
-
-__Attention :__ Veillez à bien utiliser des `transceiver` compatibles avec vos materiels (routeur, switch ou appareil). Il n'existe pas encore de standard absolu, les constructeurs précisent généralement les marques compatibles.
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Veillez à bien utiliser des `transceiver` compatibles avec vos materiels (routeur, switch ou appareil). Il n'existe pas encore de standard absolu, les constructeurs précisent généralement les marques compatibles.
+:::
 ::
 
-
 ### Les cables DAC
-
 Ce sont des cables en cuivre fichés dans des `transceiver`. Ils permettent à deux ports SFP/SFP+ de dialoguer, à courte distance, sans utiliser une fibre plus fragile ou d'adapteteur RJ45. Cependant, ils demandent plus d'énergie, la deperdition dans le cuivre etant non négligeable.
 
-
 ### Les transceiver SFP+
+Il permettent de connecter différents typle de cable à vos ports SFP/SFP+. Il en existe pour fibre optique, pour DAC et pour RJ45.
 
-Ils permettent de connecter différents types de cables à vos ports SFP/SFP+. Il en existe pour :
-
-- la fibre optique
-- le DAC
-- le RJ45
-
-::warning
-
-__Attention :__ Un transceiver RJ45 consommera beaucoup d'energie due à la deperdition naturelle dans le cuivre, et donc génerera beaucoup de chaleur. Il existe des transceiver basse consommation, consommant moins de 2W. De manière peu intuitive, ils sont généralement indiqués pour des cables plus long (80m au lieu de 30m). Ils sont conseillés plutot que ceux indiqués pour les cables plus court car ces derniers dégagent plus de chaleur et demandent plus d'energie, ce qui peut poser des problemes de compatibilité avec votre matériel, et dégrader votre réseau, voir le couper.
+::alert{type="warning"}
+:::list{type="warning"}
+- Un transceiver RJ45 consommera beaucoup d'energie due à la deperdition naturelle dans le cuivre, et donc génerera beaucoup de chaleur. Il existe des transceiver basse consommation, consommant moins de 2W. De manière peu intuitive, ils sont généralement indiqués pour des cables plus long (80m au lieu de 30m). Ils sont conseillés plutot que ceux indiqués pour les cables plus court car ces derniers dégagent plus de chaleur et demandent plus d'energie, ce qui peut poser des problemes de compatibilité avec votre matériel, et dégrader votre réseau, voir le couper.
+:::
 ::

content/2.generalites/3.hardware/3.prolonas.md

@@ -1,14 +1,11 @@
 ---
+navigation: true
 title: Le ProloNAS
-description: Construire un serveur domestique performant avec un mini PC Intel N100.  Guide pratique pour démarrer l'auto-hébergement pour moins de 130 €.
+description: Construire un serveur domestique performant avec un mini PC Intel N100 — guide pratique pour démarrer l'auto-hébergement pour moins de 130 €.
+fluid: false
 ---
-
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
-
-::note
-Cet article a été écrit avant l'augmentation __massive__ des prix du matériel informatique que nous subissons depuis fin 2025. Cependant, en mettant de côté les coûts, il n'en reste pas moins pertinent.
-::
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Le ProloNAS
 
 Lorsque l'on se lance dans l'aventure de son serveur chez soi, on se pose souvent la question _« Avec quoi dois-je commencer ? »_, _« Cela coûte cher non ? »_, et on finit soit par ne pas le faire, soit par acheter un NAS propriétaire qu'on jettera à la poubelle au bout d'un an quand on aura compris que cela n'apporte rien à part des problèmes et de l'argent jeté par la fenêtre.
 
@@ -20,25 +17,24 @@ Un Mini PC à 100 balles + un dock USB à 50 balles accueillant des disques durs
 
 C'est tout simplement ça le **ProloNAS, un NAS accessible pour les prolo**. Charge à vous ensuite de calibrer votre besoin en Disques Durs.
 
+En exemple :
+
+- Mini PC - **Attention : prendre 16GB - 512GB** : [Aliexpress](https://fr.aliexpress.com/item/1005008477986765.html) 
+- DAS (Direct Attached Storage) - **Attention : prendre "EU plug"** : [Aliexpress](https://fr.aliexpress.com/item/1005007933987260.html)
+
+- Alternatives avec ventilateur et plus soigné : [Amazon](https://www.amazon.fr/Boîtier-Disque-Ventilateur-Supportant-Capacité/dp/B0DD3GSSCX) 
+
+Je précise que cela ne sont pas des liens affiliés, prenez ce que vous voulez.
+
 ![](/img/global/prolonas.svg)
 
-## Exemple de matériel
-
-- Mini PC (**Attention : prendre 16 Go / 512 Go**) : [Aliexpress](https://fr.aliexpress.com/item/1005008477986765.html)  
-- DAS (Direct Attached Storage) (**Attention : prendre « EU plug »**) : [Aliexpress](https://fr.aliexpress.com/item/1005007933987260.html)  
-- Alternative plus soignée avec ventilateur : [Amazon](https://www.amazon.fr/Boîtier-Disque-Ventilateur-Supportant-Capacité/dp/B0DD3GSSCX)
-
-> *Ce ne sont pas des liens affiliés, achetez où vous voulez.*
-
 ## Pourquoi un NAS ?
 
-Un NAS (Network Attached Storage), c'est une machine conçue autour d'un espace de stockage ayant vocation a être partagé sur un réseau. L'idée du NAS, c'est d'avoir un stockage fiable et sécurisé sur lequel s'appuie nos usages et nos applicatifs comme des données cloud par exemple (un drive comme [Nextcloud](/serveex/cloud/nextcloud), une synchro photo comme [Immich](/serveex/cloud/immich). Mais aussi vos media comme vos films (par exemple avec [Jellyfin](/serveex/media/jellyfin)) ou les videos de vos caméra de surveillance.
+Un NAS (Network Attached Storage), c'est une machine conçue autour d'un espace de stockage ayant vocation a être partagé sur un réseau. L'idée du NAS, c'est d'avoir un stockage fiable et sécurisé sur lequel s'appuie nos usages et nos applicatifs comme des données cloud par exemple (un drive comme [Nextcloud](/serveex/cloud/nextcloud), une synchro photo comme [Immich](/serveex/cloud/immich). Mais aussi vos media comme vos films (par exemple avec [Plex](/serveex/media/plex)) ou les videos de vos caméra de surveillance.
 
-### Mais pourquoi un Mini PC avec un disque dur externe ne suffirait-il pas ?
+**Mais pourquoi un Mini PC sans DAS ne suffirait il pas ?** Bien sûr, un simple mini PC avec ses 1 à 2To de stockage devraient suffire pour la plupart des gens. Et les films pourraient tenir dans un disque dur externe de quelques TB supplémentaire. En revanche ce n'est pas une solution fiable ni extensible de faire tourner ses applications et usages sur du stockage qui au moindre choc, au moindre probleme, fait perdre vos données définitivement.
 
-Bien sûr, un simple mini PC avec ses 1 à 2To de stockage devraient suffire pour la plupart des gens. Et les films pourraient tenir dans un disque dur externe de quelques TB supplémentaire. En revanche ce n'est pas une solution fiable ni extensible de faire tourner ses applications et usages sur du stockage qui au moindre choc, au moindre probleme, fait perdre vos données définitivement.
-
-Le vrai NAS est construit autour de la fiabilité du support qui contient vos données. Il nécessite de mettre en place des stratégies de stockages type [RAID](/general/storage/raid) afin de préserver vos données en cas de panne et de la sauvegarde en cas de corruption (comme les snapshot [ZFS](/general/storage/zfs)).
+Le vrai NAS est construit autour de la fiabilité du support qui contient vos données. Il nécessite de mettre en place des stratégies de stockages type [RAID](/generalites/stockage/raid) afin de préserver vos données en cas de panne et de la sauvegarde en cas de corruption (comme les snapshot [ZFS](/generalites/stockage/zfs)).
 
 Vous l'aurez compris, l'idée du NAS c'est de déporter chez vous tout ce que vous confiez actuellement à des tiers, tout en assurant la fiabilité du support et la sauvegarde des données stockées.
 
@@ -56,24 +52,26 @@ Rappelez vous le **ProloNAS** : un N100 4 coeurs, 16Go de RAM, un SSD de 512Go,
 
 « Oui mais ok l'argument du prix, mais au moins tu lances le truc et c'est bon, t'as de jolies applications qui tournent toute seule sans maintenance ».
 
-Une année.  
-Une année c'est le temps qu'il m'a fallu pour jeter à la poubelle mon Syno en me disant que j'aurais du dès le départ partir sur mon **ProloNAS** (devenu un vrai serveur, depuis).
+Une année. Une année c'est le temps qu'il m'a fallu pour jeter à la poubelle mon Syno en me disant que j'aurais du dès le départ partir sur mon **ProloNAS** (devenu un vrai serveur, depuis).
+
+Les constructeurs vous mettent à disposition des OS linux customisés à leur sauce, ne partageant pas les catalogues d'applications linux des distributions majeures, avec des noyaux linux datant souvent de l'antiquité, et surtout des OS tres fermés ne vous permettant pas de développer votre NAS exactement selon vos besoins.
+
+En gros, soit vous utilisez leurs applications, soit vous rentrer dans un monde de souffrance. Pour donner un exemple, de nombreux conteneurs docker ne fonctionnent pas sur ces NAS constructeurs car le kernel est tellement vieux qu'il ne peut supporter les versions pourtant pas toujours récentes de docker.
 
-Les constructeurs vous mettent à disposition des OS linux customisés à leur sauce, ne partageant pas les catalogues d'applications linux des distributions majeures, avec des noyaux linux datant souvent de l'antiquité, et surtout des OS tres fermés ne vous permettant pas de développer votre NAS exactement selon vos besoins. En gros, soit vous utilisez leurs applications, soit vous rentrer dans un monde de souffrance. Pour donner un exemple, de nombreux conteneurs docker ne fonctionnent pas sur ces NAS constructeurs car le kernel est tellement vieux qu'il ne peut supporter les versions pourtant pas toujours récentes de docker.
 
 ### Dépendance des mises à jours propriétaires
 
-« Oui mais moi j'ai pas d'autre usages que ce que leurs applicatifs natifs proposent ».  
-Oui oui, moi aussi j'ai cru ça. Mais 1 an après mon Syno, mes usages ont explosés. Media center, gestion de mot de passe, plateforme git, plateforme de développement, Authentification forte et SSO hébergement web... Pourquoi etre bloqués par les solutions constructeurs jamais excellentes, souvent baclées et compatibles avec rien ?
+« Oui mais moi j'ai pas d'autre usages que ce que leurs applicatifs natifs proposent ». Oui oui, moi aussi j'ai cru ça. Mais 1 an après mon Syno, mes usages ont explosés. Media center, gestion de mot de passe, plateforme git, plateforme de développement, Authentification forte et SSO hébergement web... Pourquoi etre bloqués par les solutions constructeurs jamais excellentes, souvent baclées et compatibles avec rien ?
 
 D'autre part, ces applicatifs, vous devenez dépendant de la bonne volonté du constructeur, en terme de sécurité, de mises à jour, et de disponibilités. Je préfère confier cette dépendance à des projets open-source, mis à jour plus régulièrement et ne dépendant pas de la bonne volonté d'un board commercial.
 
-Et cela ne s'arrête pas là, qui vous dit que les disques dur que vous avez inséré dans ces NAS proproietaires vont etre supportés ? Synology a rendu incompatible son matériel avec les marques n'ayant pas un partenariat avec eux, afin de booster la vente de leurs propres disques. Qui vous dit que votre media center pourra profiter des performances de l'iGPU de votre processeur pour streamer vos media vers vos appareils ? [Synology a désactivé le transcodage matériel de ses NAS](https://www.cachem.fr/synology-desactive-transcodage-materiel-nas/).
+Et cela ne s'arrête pas là, qui vous dit que les disques dur que vous avez inséré dans ces NAS proproietaires vont etre supportés ? Synology a rendu incompatible son matériel avec les marques n'ayant pas un partenariat avec eux, afin de booster la vente de leurs propres disques.
+
+Qui vous dit que votre media center pourra profiter des performances de l'iGPU de votre processeur pour streamer vos media vers vos appareils ? [Synology a désactivé le transcodage matériel de ses NAS](https://www.cachem.fr/synology-desactive-transcodage-materiel-nas/).
 
 Bref, vous n'avez aucun pouvoir sur un produit qui n'est pas réellement ni ouvert ni à vous.
 
-## OK, mais comment je passe de mon Mini PC Serveex à un ProloNAS ?
+## OK mais omment je passe de mon Mini PC Serveex à un ProloNAS ?
 
-Comme dit plus haut, avec un DAS (hub disque) + de quoi faire du [RAID](/general/storage/raid) avec [ZFS](/general/storage/zfs) par exemple.
+Comme dit plus haut, avec un DAS (hub disque) + de quoi faire du [RAID](/generalites/stockage/raid) avec [ZFS](/generalites/stockage/zfs) par exemple.
 
-Enjoy !

content/2.generalites/3.hardware/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Hardware
+icon: lucide:server

content/2.generalites/_dir.yml

@@ -0,0 +1,3 @@
+icon: noto:open-book
+navigation.title: Généralités
+navigation.redirect: /generalites/reseau/nat

content/3.serveex/1.introduction.md

@@ -0,0 +1,280 @@
+---
+icon: lucide:bookmark
+navigation: true
+title: Introduction
+description: Introduction à Serveex — un projet homelab pour auto-héberger ses services du quotidien avec Debian et Docker, sans dépendre de Google, Apple ou Netflix.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+## Un home lab par un débutant pour les débutants
+
+![](/img/serveex/serveex-server.svg)
+
+**Serveex** c'est avant tout un projet personnel visant à héberger chez soi le plus de services possibles du quotidien sans passer par des plateformes propriétaires (Google, Apple, Netflix...). L'idée était d'expérimenter, d'apprendre, et de documenter chaque étape. C'est un projet purement pour la science, et n'a pas vocation à être utilisé en production.
+
+Un grand merci à **Nipah**, pour le partage de ses connaissances infinies, et surtout pour sa patience.
+
+::alert{type="info"}
+**Pré-requis :**
+:::list{type="primary"}
+- Posséder [un VPS en ligne](https://www.it-connect.fr/les-serveurs-prives-virtuels-vps-pour-les-debutants/) ou une machine locale : idéalement un mini PC (on trouve des N100 pour 100€), mais fonctionne aussi sur laptop ou [une machine virtuelle](https://openclassrooms.com/fr/courses/2035806-virtualisez-votre-architecture-et-vos-environnements-de-travail/6313946-installez-virtualbox). Les [Freebox Delta/Ultra proposent des machines virtuelles](https://next.ink/3493/machines-virtuelles-et-freebox-delta-comment-heberger-votre-premiere-page-web/).
+- Savoir configurer les [règles NAT d'un routeur et attribuer des baux DHCP](/generalites/reseau/nat)
+- Savoir configurer la [zone DNS d'un nom de domaine](/generalites/reseau/dns)
+:::
+::
+
+<p align="center">
+<img src="/img/serveex/serveex.svg" align="center" width="700">
+
+L'objectif étant d'etre facilement déployable et facile à migrer, voici sa structure :
+
+::card-grid{grid-template-columns="repeat(2, minmax(0, 1fr));"}
+#title
+Le coeur du serveur
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=logos:debian}
+  #title
+  __Système d'exploitation__
+  #description
+  [Installer et configurer Debian 13](/serveex/coeur/installation)
+  ::
+ 
+  ::card{icon=logos:docker-icon}
+  #title
+  __Moteur de conteneur__
+  #description
+  [Installer Docker](/serveex/coeur/docker)
+  ::
+
+  ::card{icon=carbon:container-registry style="color: rgb(41, 194, 243);" }
+  #title
+  __Docker GUI__
+  #description
+  [Installer et déployer Dockge](/serveex/coeur/docker#installer-dockge-pour-gérer-et-déployer-les-conteneurs)
+  ::
+  
+  ::card{icon=noto:globe-showing-americas}
+  #title
+  __Reverse Proxy__
+  #description
+  [Exposez vos services avec SWAG](/serveex/coeur/swag)
+  ::
+::
+
+::card-grid
+#title
+La sécurité
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=simple-icons:wireguard style="color: #88171a;"}
+  #title
+  __VPN__
+  #description
+  [Installer et déployer Wireguard](/serveex/securite/wireguard)
+  ::
+ 
+  ::card{icon=noto:key}
+  #title
+  __SSO & MFA__
+  #description
+  [Installer et déployer Authentik](/serveex/securite/authentik)
+  ::
+
+  ::card{icon=logos:cloudflare-icon}
+  #title
+  __Zero Trust__
+  #description
+  [Installer et déployer Cloudflared](/serveex/securite/cloudflare)
+  ::
+::
+
+::card-grid
+#title
+Monitoring
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=solar:pulse-linear style="color: rgb(99, 222, 144);"}
+  #title
+  __Etat des services__
+  #description
+  [Installer et déployer Uptime-Kuma](/serveex/monitoring/uptime-kuma)
+  ::
+ 
+  ::card{icon=lucide:logs style="color: #1AD6FF;"}
+  #title
+  __Gestion des logs__
+  #description
+  [Installer et déployer Dozzle](/serveex/monitoring/dozzle)
+  ::
+
+  ::card{icon=noto:rabbit style="color: #1AD6FF;"}
+  #title
+  __Gestion de la connexion__
+  #description
+  [Installer et déployer Speedtest Tracker](/serveex/monitoring/speedtest-tracker)
+  ::
+
+  ::card{icon=lucide:chart-column-decreasing style="color:rgb(26, 255, 213);"}
+  #title
+  __Etat des ressources__
+  #description
+  [Installer et déployer Beszel](/serveex/monitoring/beszel)
+  ::
+
+  ::card{icon=lucide:circle-power style="color:rgb(228, 117, 117);"}
+  #title
+  __Wake on Lan__
+  #description
+  [Installer et déployer UpSnap](/serveex/monitoring/upsnap)
+  ::
+::
+
+::card-grid
+#title
+Media
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=cbi:plex-alt style="color: rgb(229, 160, 13);"}
+  #title
+  __Media__
+  #description
+  [Installer et déployer Plex](/serveex/media/plex)
+  ::
+ 
+  ::card{icon=cbi:qbittorrent style="color: rgb(#2f67ba);"}
+  #title
+  __Seedbox__
+  #description
+  [Installer et déployer Qbittorrent](/serveex/media/qbittorrent)
+  ::
+::
+
+::card-grid
+#title
+Cloud Drive & Photos
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=cib:nextcloud style="color: rgb(0, 104, 161);"}
+  #title
+  __Drive__
+  #description
+  [Installer et déployer Nextcloud](/serveex/cloud/nextcloud)
+  ::
+ 
+  ::card{icon=simple-icons:immich style="color: #ed79b5;"}
+  #title
+  __Photos__
+  #description
+  [Installer et déployer Immich](/serveex/cloud/immich)
+  ::
+::
+
+::card-grid
+#title
+Fichiers & partage
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=noto:open-file-folder }
+  #title
+  __Explorateur de fichier__
+  #description
+  [Installer et déployer file-browser](/serveex/files/file-browser)
+  ::
+
+  ::card{icon=carbon:share style="color: #47428e;" }
+  #title
+  __Partage__
+  #description
+  [Installer et déployer Pingvin](/serveex/files/pingvin)
+  ::
+
+::
+
+
+::card-grid
+#title
+Outils de développement
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=logos:visual-studio-code}
+  #title
+  __Visual Studio Code__
+  #description
+  [Installer et déployer code-server](/serveex/development/code-server)
+  ::
+ 
+  ::card{icon=simple-icons:gitea style="color: #9ee773;"}
+  #title
+  __Git Repository__
+  #description
+  [Installer et déployer Gitea](/serveex/development/gitea)
+  ::
+
+  ::card{icon=noto:hammer-and-wrench }
+  #title
+  __Outils__
+  #description
+  [Installer et déployer IT Tools](/serveex/development/it-tools)
+  ::
+::
+
+::card-grid
+#title
+Applications utiles
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=cbi:adguard style="color: #67b279;"}
+  #title
+  __DNS anti-pub et filtres__
+  #description
+  [Installer et déployer Adguard Home](/serveex/apps/adguard)
+  ::
+ 
+  ::card{icon=cbi:bitwarden style="color: rgb(25 128 255);"}
+  #title
+  __Gestionnaire de mots de passe__
+  #description
+  [Installer et déployer Vaultwarden](/serveex/apps/vaultwarden)
+  ::
+::
+
+## A venir
+---
+- Homepage, pour avoir tout vos services en un coup d'oeil et y accéder facilement
+- Mkdocs pour votre documentation
+- Docus, alternative à Mkdocs
+- UpSnap pour réveiller vos machines à distance

content/3.serveex/2.coeur/1.installation.md

@@ -0,0 +1,77 @@
+---
+navigation: true
+title: Debian 13
+description: Guide pas à pas pour installer Debian 13 sur un serveur et configurer l'accès SSH, les paquets essentiels et un système de base prêt à l'emploi.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Debian 13
+::alert{type="info"}
+🎯 __Objectif :__ Installer Debian 13 et les dépendances principales pour avoir un OS pret à l'emploi, joignable en SSH.
+::
+
+![picture](/img/serveex/server.svg)
+
+## Installation
+---
+1. [Paramètrage BIOS](https://www.debian.org/releases/stable/amd64/ch03s06.fr.html#bios-setup)
+2. [Téléchargement de l'image Debian 13](https://www.debian.org/download.fr.html)
+3. [USB bootable (Rufus)](https://dev.to/devops2808/how-to-create-bootable-usb-installer-for-debian-12-4f66)
+4. [Installer Debian et configurer SSH](https://www.howtoforge.com/tutorial/debian-minimal-server/)
+5. Installer sudo et ajouter un utilisateur au groupe sudo, pour les privilèges administrateurs
+    Se connecter en root : 
+    ```sh
+    su -
+    ```
+    mettre son mot de passe puis taper :
+    ```sh
+     apt install sudo
+    ```
+    Ajouter l'utilisateur au groupe sudo : 
+    ```sh
+    adduser <nomdutilisateur> sudo
+    ```
+
+    La prochaine fois que l'utilisateur se connectera, il pourra utiliser la commande `sudo` et ainsi executer des commandes avec les privilèges administrateurs.
+
+
+6. [Tout savoir sur la connexion à distance à la console (SSH)](https://www.digitalocean.com/community/tutorials/ssh-essentials-working-with-ssh-servers-clients-and-keys)
+7. Optionnel - [UPS client en cas de coupure](https://www.sindastra.de/p/2078/how-to-connect-linux-server-to-synology-ups-server) / [et aussi](https://www.reddit.com/r/synology/comments/gtkjam/use_synology_nas_as_ups_server_to_safely_power/)
+8. Optionnel - Réveil en cas de coupure de courant -> régler le BIOS S0 state
+9. Optionnel - [Réveiller le serveur à distance (WoW - WoL)](https://dev.to/zakery1369/enable-wake-on-lan-on-debian-4ljd)
+
+## CLI apps à avoir près de soi
+---
+Quelques app que vous utiliserez forcément à un moment donné, autant les installer dès le départ
+```sh
+ sudo apt update
+ sudo apt upgrade
+ sudo apt install vim btop ranger git duf neofetch samba cifs-utils tree unzip
+```
+
+En plus :
+
+- [gping](https://www.linode.com/docs/guides/how-to-use-gping-on-linux/) - Outil graphique de ping
+- [lazydocker](https://github.com/jesseduffield/lazydocker) - Gestion de conteneurs docker en CLI
+
+## Fonctions utiles
+---
+### Pare-feu
+- [ufw](https://www.zenarmor.com/docs/network-security-tutorials/how-to-set-up-a-firewall-with-ufw-on-debian)
+- [Firewalld](https://linuxcapable.com/how-to-install-firewalld-on-debian-linux/)
+
+### Partage Samba (accès à un disque réseau distant)
+- [Créer et accéder à un partage Samba](/generalites/reseau/samba)
+
+
+### Transfert de fichier via rsync
+
+```sh
+sudo rsync -avhHSP  /source /destination
+```
+::alert{type="info" icon="exclamation-circle"}
+:::list{type="info"}
+- Ajoutez ` --exclude @eaDir`{lang=shell} si la source est un NAS Synology
+:::
+::

content/3.serveex/2.coeur/2.docker.md

@@ -0,0 +1,177 @@
+---
+navigation: true
+title: Docker
+description: Installer Docker et Dockge sur Debian pour déployer et gérer des services auto-hébergés avec de simples stacks de conteneurs.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Docker
+
+Docker, pour installer des services déployables en quelques secondes, et les manager en quelques commandes/clics.
+
+::alert{type="info"}
+🎯  __Objectifs :__
+- Installer [Docker](https://www.docker.com/)
+- Installer [Dockge](https://github.com/louislam/dockge) pour manager les stacks
+- Installer [Watchtower](https://github.com/containrrr/watchtower) pour mettre à jour les conteneurs
+::
+
+![picture](/img/serveex/docker.svg)
+
+## Installer docker
+---
+Installez les repo Docker et la clé GPG
+
+```sh
+# Add Docker's official GPG key:
+sudo apt-get update
+sudo apt-get install ca-certificates curl
+sudo install -m 0755 -d /etc/apt/keyrings
+sudo curl -fsSL https://download.docker.com/linux/debian/gpg -o /etc/apt/keyrings/docker.asc
+sudo chmod a+r /etc/apt/keyrings/docker.asc
+
+# Add the repository to Apt sources:
+echo \
+  "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.asc] https://download.docker.com/linux/debian \
+  $(. /etc/os-release && echo "$VERSION_CODENAME") stable" | \
+  sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
+sudo apt-get update
+```
+Installez les package
+
+```sh
+sudo apt-get install docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin
+```
+Et voilà !
+
+**Plus d'options** [Installer docker pour Debian 12](https://docs.docker.com/engine/install/debian/)
+
+::alert{type="info" icon="exclamation-circle"}
+:::list{type="info"}
+- Dans toute la suite, on part du principe que les stacks sont installées dans le dossier `/docker`, créé grace à la commande :
+:::
+    ```sh
+    sudo mkdir /docker
+::   
+
+## Installer [dockge](https://github.com/louislam/dockge) pour gérer et déployer les conteneurs
+---
+[Dockge](https://github.com/louislam/dockge) est un outil web permettant de créer, configurer, lancer et gérer des conteneurs pour Docker. C'est une interface simple, intuitive, qui est plus légère et plus facile pour les débutants que d'utiliser docker en CLI ou Portainer.
+
+![picture](/img/serveex/dockge.png)
+
+### Configuration
+
+Plan des fichiers que nous allons modifier :
+
+```sh
+root
+└── docker
+    └── dockge    
+        └── compose.yml
+```
+
+Créez le dossier de la stack :
+
+```sh
+cd /docker
+sudo mkdir dockge
+```
+
+Puis créez le fichier `compose.yml` dans ce dossier avec l'outil vim que vous avez installé préalablement (dans les outils CLI)
+
+```sh
+cd /docker/dockge
+sudo vi compose.yml
+```
+Appuyer sur `i` pour rentrer en modif et copiez-collez ceci.
+
+```yaml
+---
+services:
+  dockge:
+    image: louislam/dockge:1
+    restart: unless-stopped
+    container_name: dockge
+    ports:
+      - 3555:5001 # Le port joignable depuis le LAN sera 3555
+
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+      - /docker/dockge/data:/app/data
+      - /docker:/docker
+    environment:
+      - DOCKGE_STACKS_DIR=/docker
+```
+
+Appuyez sur `Echap` pour quitter le mode modif et tapez `:x` pour enregistrer et quitter
+
+
+Pour lancer le conteneur, tapez :
+
+```sh
+cd /docker/dockge
+sudo docker compose up -d
+```
+Une fois lancé, tapez dans votre navigateur `http://ipduserveur:3555` et vous tomberez sur la page de login.
+
+Plus d'info sur [dockge et comment l'utiliser](https://github.com/louislam/dockge)
+
+Et voilà, vous avez installé docker et un outil facile pour manager vos conteneurs !
+
+## [Watchtower](https://watchtower.nickfedor.com/), pour mettre à jour automatiquement les conteneurs
+---
+Watchtower est un conteneur qui permet de vérifier les mise à jour et d'installer les nouvelles images sans effort, en ajoutant un simple label dans les fichiers `compose.yml` de vos conteneurs.
+
+### Configuration
+
+- Ouvrez Dockge dans votre navigateur
+- Cliquez sur `compose`
+- Nommez la stack `watchtower`
+- Copiez collez la configuration ci-dessous à la place de la configuration par défaut dans Dockge
+
+```yaml
+---
+services:
+  watchtower:
+    container_name: watchtower
+    image: ghcr.io/nicholas-fedor/watchtower:latest
+    restart: unless-stopped
+    env_file:
+      - .env
+    environment:
+      - TZ=Europe/Paris
+      - WATCHTOWER_SCHEDULE=${SCHEDULE}
+      - WATCHTOWER_LABEL_ENABLE=true # watchtower scan tous les conteneurs qui ont le label com.centurylinklabs.watchtower.enable=true
+      - WATCHTOWER_CLEANUP=true
+      - WATCHTOWER_REMOVE_VOLUMES=true
+      #Notifications Discord - décommenter si utilisé
+      #- WATCHTOWER_NOTIFICATIONS=slack
+      #- WATCHTOWER_NOTIFICATION_SLACK_IDENTIFIER=Watchtower
+      #- WATCHTOWER_NOTIFICATION_SLACK_HOOK_URL=${WH_URL}
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+```
+
+Puis remplissez les données ci-dessous dans l'encart ".env" de Dockge
+
+```properties
+SCHEDULE=
+WH_URL=
+```
+
+| Propriété               | Valeur                                                              | Exemples                                     |
+|-------------------------|---------------------------------------------------------------------|----------------------------------------------|
+| `SCHEDULE`{lang=properties} | Format cron                                                         | `0 0 6 * * *` (tous les jours à 6h du matin) |
+| `WH_URL`{lang=properties} | URL du webhook de votre serveur Discord - ajouter `/slack` à la fin | `https://serveurdiscord/valeur/slack`        |
+
+
+Pour que Watchtower surveille vos autres conteneurs, ajoutez ceci à vos conteneurs dans leur compose.yml :
+
+```yaml
+labels:
+      - com.centurylinklabs.watchtower.enable=true
+```
+
+Puis relancez les stacks modifiés. Et voilà, vous avez une bonne carcasse pour commencer à installer les services qui vous plaisent !

content/3.serveex/2.coeur/3.swag.md

@@ -0,0 +1,399 @@
+---
+navigation: true
+title: SWAG
+description: Configurer SWAG comme reverse proxy avec SSL automatique, exposer vos services en toute sécurité et activer le blocage géographique sur votre homelab.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# SWAG
+
+::alert{type="info"}
+🎯  __Objectifs :__
+- Installer Swag
+- Activer le SSL
+- Accéder au tableau de bord
+- Configurer le blocage régional
+- Exposer Dockge
+::
+
+[Swag](https://docs.linuxserver.io/general/swag/) est le noyau de ce homelab. C'est un reverse proxy puissant qui permet d'exposer des services sur le net via un ou des noms de domaines, en se chargeant de l'émission des certificats SSL (pour garder des connexions chiffrées), du routage des requêtes et de la sécurisation des accès (par authent HTTP ou par SSO comme Authelia ou Authentik). Toute la doc nécessaire se [situe ici](https://docs.linuxserver.io/general/swag).
+
+::alert{type="warning"}
+:::list{type="warning"}
+- SWAG n'a pour utilité que l'exposition de vos services sur internet. C'est à dire, y accéder via une url publique du type `https://service.mondomaine.fr`. Si vous ne souhaitez pas exposer vos services et plutôt utiliser systématiquement un VPN pour vous connecter à vos services à distance, vous pouvez directement aller [par ici](/serveex/securite/wireguard). 
+:::
+::
+
+Ci-dessous, vous trouverez un exemple, exposant Dockge. Nous installerons SWAG, ainsi que le mod dbip servant à bloquer les connexions en fonction de la géoloc, ainsi que le mod dashboard qui permet de piloter le fonctionnement de swag, fail2ban et la géoloc.
+
+**Principe d'un reverse proxy et application dans notre cas :**
+
+![Picture](/img/serveex/reverse-proxy.svg)
+
+## Installation
+---
+
+::alert{type="info" icon="exclamation-circle"}
+:::list{type="info"}
+- Ce tutoriel part du principe que vous avez un nom de domaine qui pointe vers votre serveur, et que votre box a une règle NAT qui redirige le port `443` vers l'adresse IP et le port `443` de votre serveur. Le nom de domaine d'exemple sera `mondomaine.fr`.
+:::
+::
+
+Plan des fichiers que nous allons modifier :
+
+```sh
+root
+└── docker
+    └── swag
+        ├── config
+        │   ├── dns-conf
+        │   │   └── ovh.ini
+        │   └── nginx
+        │       ├── dbip.conf
+        │       ├── nginx.conf
+        │       └── proxy-confs
+        │           └── dockge.subdomain.conf      
+        ├── compose.yml
+        └── .env
+```
+
+Ouvrez Dockge dans votre navigateur, cliquez sur `compose`, nommez la stack `swag` et copiez la conf ci-dessous
+
+``` yaml
+---
+services:
+  swag:
+    image: lscr.io/linuxserver/swag:latest
+    container_name: swag
+    cap_add:
+      - NET_ADMIN
+    env_file:
+      - .env
+    environment:
+      - TZ=Europe/Paris
+      - URL=${DOMAIN}
+      - EXTRA_DOMAINS=${DOMAINS}
+      - SUBDOMAINS=wildcard # couvre les sous-domaines
+      - VALIDATION=dns
+      - DNSPLUGIN=${PLUGIN}
+      - EMAIL=${EMAIL}
+      - DOCKER_MODS=linuxserver/mods:swag-dbip|linuxserver/mods:swag-dashboard|linuxserver/mods:swag-auto-reload
+    volumes:
+      - /docker/swag/config:/config
+    ports:
+      - 80:80
+      - 443:443
+      - 81:81 # Nécessaire pour le dashboard
+    restart: unless-stopped
+    networks:
+      - swag
+
+networks:
+  swag:
+    name: swag_default
+
+```
+
+::alert{type="success"}
+✨ __Astuce :__
+ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+    
+    ```yaml
+    services:
+      swag:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Puis dans le `.env` :
+
+```properties
+DOMAIN=
+DOMAINS=
+EMAIL=
+PLUGIN=
+```
+
+Remplissez comme suit 
+
+| Propriété                | Valeur                                                                    | Exemples              |
+|--------------------------|---------------------------------------------------------------------------|-----------------------|
+| ` DOMAIN`{lang=properties}  | Votre domaine (cela couvre aussi tous les sous-domaines)                  | `mondomaine.fr`       |
+| ` DOMAINS`{lang=properties} | Vos éventuels autres domaines                                             | `monsecondomaine.fr`  |
+| ` EMAIL`{lang=properties}   | Votre email, pour générer le certificat                                   | `votre@email.fr`      |
+| ` PLUGIN`{lang=properties}  | Le plugin pour générer le certificat, lié à votre [fournisseur de zone DNS](https://docs.linuxserver.io/general/swag/) | `ovh`<br>`cloudflare` |
+
+Ici nous partons du principe que votre zone DNS est chez OVH. Déployez la stack une premiere fois. Dans les logs vous verrez qu'il n'arrivera pas à créer de certificat SSL car le fichier ovh.ini renvoi une erreur. Arretez la stack.
+
+En CLI, allez dans le dossier dns-conf et éditez le fichier `ovh.ini` :
+
+::alert{type="success"}
+✨ __Astuce pour les allergiques au terminal :__
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+
+```sh
+sudo vi /docker/swag/config/dns-conf/ovh.ini
+```
+
+Voici ce qui s'affiche :
+
+```properties
+# Instructions: https://github.com/certbot/certbot/blob/master/certbot-dns-ovh/certbot_dns_ovh/__init__.py#L20
+# Replace with your values
+dns_ovh_endpoint = ovh-eu
+dns_ovh_application_key = 
+dns_ovh_application_secret = 
+dns_ovh_consumer_key = 
+```
+Authentifiez vous et créez [votre token ici](https://www.ovh.com/auth/?onsuccess=https%3A%2F%2Fwww.ovh.com%2Fauth%2Fapi%2FcreateToken). 
+
+Les permissions à configurer sont les suivantes :
+
+* ``GET /domain/zone/*``
+* ``PUT /domain/zone/*``
+* ``POST /domain/zone/*``
+* ``DELETE /domain/zone/*``
+
+Notez les 3 clés temporairement et renseignez le fichier `ovh.ini`. (avec vim, `i` pour passer en modif, `Echap` quand c'est fini, `:x` pour sauvegarder et quitter)
+
+Sauvegardez et quittez le fichier. 
+
+Configurez aussi swag pour qu'il accède à DBIP, le module de gestion des accès par géolocalisation /Ouvrez le fichier nginx.conf
+
+```sh
+sudo vi /docker/swag/config/nginx/nginx.conf
+```
+
+Et ajoutez la ligne suivante en dessous de la section `http` :
+
+```nginx
+include /config/nginx/dbip.conf
+```
+
+Relancez la stack dans Dockge, cette fois le certificat SSL est bien émis ! Vérifiez dans les logs que le serveur est bien ready.
+
+## Dashboard
+---
+Accedez au dashboard via votre réseau local en tapant `http//ipdevotreserveur:81`
+A gauche, vous trouverez la liste des services actuellement "proxied" (aucun pour le moment). A droite, les IP bannies. En-dessous, une liste d'indicateurs. pour le détail, [c'est par ici](https://www.linuxserver.io/blog/introducing-swag-dashboard).
+
+![picture](https://www.linuxserver.io/user/pages/03.blog/introducing-swag-dashboard/example.png)
+
+## DBIP
+---
+DBIP permet de bloquer les connexions en fonction des pays. Il s'appuie sur le fichier de config nommé `dbip.conf` dans `/docker/swag/config/nginx`. [Plus d'info ici](https://virtualize.link/secure/).
+
+Dans cet exemple, nous allons le configurer pour bloquer une liste de pays connus pour etre à l'origine de la plupart des connexions malveillantes. Nous allons également configurer une variable au cas où nous souhaiterions permettre au réseau interne du serveur, au réseau local de votre box ainsi qu'à un éventuel vpn en 10.x.x.x de pouvoir accéder à vos services, mais pas directement à internet.
+
+La configuration est activable ou désactivable pour chaque service qui sera proxied (voir exemple de Dockge plus bas).
+
+Ouvrez `dbip.conf` :
+
+```sh
+sudo vi /docker/swag/config/nginx/dbip.conf
+```
+
+Faites vos modifications ([voir documentation](https://github.com/linuxserver/docker-mods/tree/swag-dbip)), ou prenez l'exemple suivant: 
+
+```nginx
+geoip2 /config/geoip2db/dbip-country-lite.mmdb {
+    auto_reload 1w;
+    $geoip2_data_continent_code   continent code;
+    $geoip2_data_country_iso_code country iso_code;
+}
+
+# Country Codes: https://en.wikipedia.org/wiki/ISO_3166-2
+
+map $geoip2_data_country_iso_code $geo-whitelist {
+    # default yes;
+    # Example for whitelisting a country, comment out 'default yes;' above and uncomment 'default no;' and the whitelisted country below
+    default no;
+    FR yes;
+}
+
+map $geoip2_data_country_iso_code $geo-blacklist {
+    default yes;
+    # Example for blacklisting a country, uncomment the blacklisted country below
+    CN no; #China
+    RU no; #Russia
+    HK no; #Hong Kong
+    IN no; #India
+    IR no; #Iran
+    VN no; #Vietnam
+    TR no; #Turkey
+    EG no; #Egypt
+    MX no; #Mexico
+    JP no; #Japan
+    KR no; #South Korea
+    KP no; #North Korea
+    PE no; #Peru
+    BR no; #Brazil
+    UA no; #Ukraine
+    ID no; #Indonesia
+    TH no; #Thailand
+ }
+
+geo $lan-ip {
+    default no;
+    10.0.0.0/8 yes;
+    172.16.0.0/12 yes;
+    192.168.0.0/16 yes;
+    127.0.0.1 yes;
+}
+```
+
+Sauvegardez et quittez. Redémarrez la stack.
+
+Dans les fichiers de conf des domaines (section suivante), vous pourrez activer ou désactiver la whitelist ou la blacklist ([voir documentation ici](https://www.forum-nas.fr/threads/tuto-installer-swag-en-docker-reverse-proxy.15057/)). Dans notre cas, la whitelist laisse uniquement passer les requêtes françaises. La blacklist laisse passer tout le monde sauf la liste de pays mentionnée. On utilisera donc la blacklist, sur ce modèle :
+
+```nginx
+ server {
+     listen 443 ssl;
+     listen [::]:443 ssl;
+
+     server_name some-app.*;
+     include /config/nginx/ssl.conf;
+     client_max_body_size 0;
+
+     if ($geo-blacklist = no) { return 404; }
+
+     location / {
+```
+
+
+## Exposer Dockge
+---
+::alert{type="info"}
+📋 __Prérequis :__ <br/></br>
+Nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `dockge.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Il s'agit maintenant d'exposer Dockge sur internet, afin de pouvoir y accéder et gérer vos conteneurs sans que vous soyez chez vous. Pour cela, nous partons du principe que vous avez configuré un sous domaine `dockge.mondomaine.fr` dans votre zone DNS dont le `CNAME` pointe sur `mondomaine.fr`.
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Dockge n'utilise pas d'authentification multifacteur. Exposer Dockge sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Ouvrez le fichier dockge.subdomain.conf :
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/dockge.subdomain.conf
+```
+
+Paramétrez le comme tel :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+    
+    # indique que le sous-domaine doit être dirigé
+    server_name dockge.*;  
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    # indique que les pays dans la blacklist sont intedits
+    if ($geo-blacklist = no) { return 404; } 
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        
+        set $upstream_app dockge; # Nom du conteneur
+        set $upstream_port 5001; # Port interne conteneur
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+
+Sauvegardez et quittez. La configuration va se mettre à jour en quelques secondes. 
+::alert{type="info"}
+:::list{type="info"}
+- Par défaut, SWAG ne connait pas le nom "dockge". Pour qu'il puisse y accéder, vous devez rajouter le réseau de dockge dans le `compose.yml` de SWAG.
+:::
+::
+
+Rendez-vous sur la stack de SWAG, puis cliquez sur `éditer`, et ajouter le réseau de dockge dans le fichier de conf sur ce modele (les champs `networks`) :
+
+
+```yaml
+services:
+  swag:
+     container_name: #...
+      # ... 
+     networks:           # Relie le conteneur au réseau custom 
+      - dockge           # Nom du réseau déclaré dans la stack
+    
+networks:                # Définit le réseau custom
+  #...
+  dockge:                # Nom du réseau déclaré dans la stack
+    name: dockge_default # Nom véritable du réseau externe
+    external: true       # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de dockge est `dockge_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Déployez à nouveau la stack de SWAG.
+
+Patientez puis tapez `https://dockge.mondomaine.fr` dans votre navigateur, vous devriez être redirigé vers dockge. Vous pouvez vérifier le statut du service via le dashboard (depuis votre réseau local, http://ipdevotreserveur:81)
+
+
+## Exposer un autre service avec SWAG
+---
+Swag dispose de modeles pour la plupart des services connus, nommés `nomduservice.subdomain.conf.sample`. Il vous suffit de créer le sous-domaine dans votre zone DNS chez votre registrar (comme OVH par exemple), de le faire pointer sur votre domaine principale (via un enregistrement CNAME) et de copier en renommant `nomduservice.subdomain.conf.sample` en `nomduservice.subdomain.conf`. 
+
+```sh
+cd /docker/swag/config/proxy-confs
+sudo cp nomduservice.subdomain.conf.sample nomduservice.subdomain.conf
+```
+::alert{type="danger"}
+:::list{type="danger"}
+- __Si le sous domaine n'est pas redirigé correctement__
+:::
+- éditez le fichier et vérifiez notamment le nom du conteneur dans `set $upstream_app nomduconteneur;`{lang=nginx}
+
+- vérifiez que vous avez bien ajouté le réseau du conteneur dans le `compose.yml` de SWAG.
+::
+
+Vous pouvez aussi choisir le sous-domaine en changeant la variable `server_name votresousdomaine.*;`{lang=nginx} et en renommant le fichier `votresousdomaine.subdomain.conf`.

content/3.serveex/2.coeur/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Le coeur du serveur
+icon: lucide:server-cog

content/3.serveex/3.securite/1.wireguard.md

@@ -0,0 +1,260 @@
+---
+navigation: true
+title: Wireguard
+description: Installer et configurer WireGuard VPN pour accéder à votre homelab de n'importe où et connecter tous vos appareils à votre réseau privé.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Wireguard
+
+::alert{type="info"}
+🎯 __Objectifs :__
+  - Installer Wireguard
+  - Configurer les clients
+  - Accéder au réseau sécurisé
+::
+
+## Introduction
+---
+L'utilisation d'un VPN permet d'accéder à distance aux ressources locales du serveur sans les exposer sur internet. C'est notamment une manière propre de sécuriser l'accès à la console SSH, plutot que d'exposer le port sur internet. C'est pouvoir se connecter à son réseau où que l'on soit, de maniere sécurisée, et de faire dialoguer des machines qui sont sur des réseaux différents.
+
+Ici nous utiliserons [Wireguard](https://www.wireguard.com/), un serveur VPN sécurisé et très performant, à l'aide des conteneurs :
+
+- [wg-easy](https://github.com/wg-easy/wg-easy) pour le serveur, qui propose une interface web très simple pour controler les connexions et télécharger les fichiers de conf (notamment par QR code pour les téléphones)
+- [Wireguard](https://docs.linuxserver.io/images/docker-wireguard/?h=wireguard) pour les clients linux
+
+Il existe aussi des clients Windows, MacOS, iOS et Android.
+
+Le principe est le suivant :
+
+- Sur internet, n'importe qui peut contacter n'importe quel box internet et donc essayer de contacter n'importe quel serveur exposé.
+- Votre serveur est sur votre réseau local. Il est accessible depuis le réseau local mais pas depuis internet, mis à part les services exposés (comme nous l'avons fait avec Dockge). Pour accéder aux ressources non exposées, vous devez être connecté sur le meme réseau que votre serveur et donc etre chez vous. De plus, vous devez laisser ouvert les ports utilisés par vos services à travers le pare feu de votre serveur.
+- Nous souhaitons ici au contraire, depuis n'importe où, pouvoir accéder de maniere securisée aux services non exposés sur internet du serveur, comme la console SSH qui permet de se connecter à la machine par exemple.
+- Nous souhaitons aussi accéder aux services d'autres serveurs, et par exemple relier de maniere sécurisée deux instances de Dockge pour tout controler depuis la meme interface.
+
+Pour cela nous allons créer un **réseau privé virtuel**, ou VPN, c'est à dire un tunnel sécurisé auquel personne n'a accès à part les machines que vous relierez entre elles. Elles feront partie d'un nouveau réseau et pourront dialoguer entre elle comme dans un réseau local. 
+
+D'autre part, vous pourrez ajouter votre téléphone, un ordinateur portable ou n'importe quel appareil au réseau pour pouvoir utiliser vos ressources depuis vos appareils quotidiens, où que vous soyiez.
+
+![picture](/img/serveex/vpn.svg)
+
+Dans cette illustration, la machine 1 est sur deux réseaux :
+
+- son réseau local (tous les appareils liés à la box, avec une adresse IP du type `192.168.x.x ` donc ici la machine 1 et la machine 2)
+- le réseau du VPN (tous les appareils reliés au VPN, avec une seconde adresse IP du type `10.8.x.x` donc ici la machine 1 et 4)
+
+On peut aussi faire en sorte que les machines reliées au réseau virtuel partagent les acces à leur réseau local. Ici nous ne le ferons pas, pour des raisons de sécurité, et de complexité en terme de sous-réseau (si les deux machines distantes ont des machines locales qui utilisent la meme adresse IP locale, par exemple `192.168.1.1`, cela posera des conflits). 
+
+Ainsi, sur le réseau virtuel, seules les machines directement reliées pourront dialoguer entre elle depuis ce réseau. Elles ne pourront pas dialoguer avec une machine situées sur un autre réseau local et non reliée au VPN.
+
+## Côté serveur
+---
+::alert{type="info"}
+📋 __A vérifier au préalable :__
+- Vérifiez si le port `51820 UDP` estlibre sur votre serveur, et bien routé dans le NAT de la box `Source 51820 UDP -> Destination 51820 UDP -> Serveur`. En effet, votre serveur étant derrière votre box, le port de votre box doit etre joignable et rediriger vers le port de votre serveur connecté à votre VPN.
+- Vérifiez aussi que le port `51821 TCP` est libre sur le serveur pour accéder à la web ui.
+:: 
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention__: Si votre IP n'est pas fixe, vous devez avoir un nom de domaine redirigeant vers l'IP à jour à l'aide d'un [DynDNS](https://en.wikipedia.org/wiki/Dynamic_DNS). Si votre opérateur internet utilise un [CGNAT](https://en.wikipedia.org/wiki/Carrier-grade_NAT), vous êtes cuit. Vous devrez utiliser un VPS externe pour ce tuto, et y connecter votre serveur comme client.
+:::
+::
+
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── wg-easy
+        ├── config
+        │   └── etc_wireguard
+        ├── compose.yaml
+        └── .env
+```
+
+Ouvrez Dockge, cliquez sur `compose` et nommez la stack `wg_easy`.
+
+Copiez la configuration suivante :
+
+```yaml
+---
+services:
+  wg-easy:
+    environment:
+      - INSECURE=true
+    image: ghcr.io/wg-easy/wg-easy:15
+    container_name: wg-easy
+    networks:
+      wg:
+        ipv4_address: 10.42.42.42
+        ipv6_address: fdcc:ad94:bacf:61a3::2a
+    volumes:
+      - ./etc_wireguard:/etc/wireguard
+      - /lib/modules:/lib/modules:ro
+    ports:
+      - "51820:51820/udp"
+      - "51821:51821/tcp"
+    restart: unless-stopped
+    cap_add:
+      - NET_ADMIN
+      - SYS_MODULE
+    sysctls:
+      - net.ipv4.ip_forward=1
+      - net.ipv4.conf.all.src_valid_mark=1
+      - net.ipv6.conf.all.disable_ipv6=0
+      - net.ipv6.conf.all.forwarding=1
+      - net.ipv6.conf.default.forwarding=1
+
+networks:
+  wg:
+    driver: bridge
+    enable_ipv6: true
+    ipam:
+      driver: default
+      config:
+        - subnet: 10.42.42.0/24
+        - subnet: fdcc:ad94:bacf:61a3::/64
+
+```
+::alert{type="success"}
+✨ __Astuce :__ 
+- Vous pouvez personnaliser le port de wireguard et de la webui au lieu des ports par défaut.
+- Ajoutez le label de watchtower afin d'automatiser les mises à jour
+
+    ```yaml
+    services
+      wg-easy:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Puis déployez la stack et connectez vous via le web en local sur `http://ipduserveur:51821`
+
+::alert{type="danger"}
+:::list{type="danger"}
+- En cas d'échec, vérifiez les règles du pare-feu.
+:::
+::
+
+Une fois connecté, la webui vous guidera :
+- Pour créer votre compte et mot de passe d'accès
+- Pour configurer l'host à utiliser dans les fichiers de conf : utilisez l'IP publique de votre box internet (ou de votre VPS), ou le nom de domaine redirigeant vers l'IP de votre box, le cas écheant.
+
+Une fois fait:
+- Cliquez sur *« Administrator »* > *« Admin Panel »* > *« Config »*
+- Modifiez `Allowed IPs` en remplaçant `0.0.0.0/24` par `10.8.0.0/24`. Cela signifie que seules les requêtes IP de `10.8.0.1` à `10.8.0.255` seront redirigées dans le tunnel (split tunneling), laissant ainsi à l'appareil la possibilité d'etre connecté à d'autres tunnels, et à accéder à internet par lui meme. Si vous voulez tout rediriger dans le tunnel, y compris l'acces à internet, laissez `0.0.0.0/24`.
+- Supprimez l'IPv6, cela n'apportera que des problèmes.
+
+### Recuperation des fichiers de conf
+
+Afin de configurer les clients, vous devez télécharger les fichiers de conf générés par l'host :
+
+- Connectez vous via le web en local sur `http://ipduserveur:51821`
+- Créez un client
+- Modifiez le client en cliquant sur l'icone d'édition
+- Modifiez `Server Allowed IPs` en ajoutant `10.8.0.0/24`. Cela signifie que le serveur laissera vos clients accéder à toutes les IP `10.8.0.1` à `10.8.0.255` connectées à lui, et donc laissera les clients dialoguer entre eux si nécessaire. Si vous voulez laisser vos clients accéder à tous les appareils réseau connectés autour de votre serveur en local, mettez `0.0.0.0`, à condition de l'avoir fait précédemment dans la configuration générale.
+- (facultatif) Si votre client est un serveur qui doit être connecté en permanence, modifiez `Advanced` > `Persistent Keep Alive` en mettant `25`.
+- Sauvegardez
+- Téléchargez le fichier de conf
+- Renommez le en `wg0.conf`. (Si ce n'est pas le premier, incrémentez: `wg1.conf`, etc...)
+
+
+## Sur le serveur client
+---
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que le serveur client est un serveur linux avec Docker installé
+:::
+::
+
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── wireguard
+        └── config
+        │   └── wg_confs
+        └── compose.yaml
+```
+
+Creez le dossier `/docker/wireguard/config/wg_confs`.
+
+::alert{type="success"}
+✨ __Astuce pour les allergiques au terminal :__
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo mkdir -p /docker/wireguard/config/wg_confs
+```
+
+Créez le fichier `wg0.conf`
+
+```sh
+sudo vi /docker/wireguard/config/wg_confs/wg0.conf
+```
+
+Rentrez en édition en appuyant sur `i` puis Copiez collez le contenu du `wg0.conf` que vous avez téléchargé. Puis sortez du mode édition en appuyant sur `Echap` puis tapez `:x`. 
+
+
+::alert{type="success"}
+✨ __Astuce :__ Un autre moyen est de transférer le fichier par sftp dans le dossier `/home/nomdutilisateur` puis de le copier dans le bon dossier :
+
+    ```sh
+    sudo cp ~/wg0.conf /docker/wireguard/config/wg_confs
+
+::
+
+Creez le `compose.yaml` dans `/docker/wireguard `:
+```sh
+sudo vi /docker/wireguard/compose.yaml
+```
+Appuyez sur `i` pour rentrer en modification et copiez la configuration ci-dessous
+```yaml
+services:
+  wireguard:
+    image: lscr.io/linuxserver/wireguard:latest
+    container_name: wireguard
+    network_mode: host
+    cap_add:
+      - NET_ADMIN
+      - SYS_MODULE #optional
+    environment:
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/wireguard/config:/config
+      - /lib/modules:/lib/modules #optional
+    restart: unless-stopped
+```
+
+Appuyez sur `Echap` puis tapez `:x` pour quitter et sauvegarder.
+
+Lancez le conteneur :
+```sh
+cd /docker/wireguard
+sudo docker compose up -d
+```
+::alert{type="info"}
+:::list{type="info"}
+- A répéter pour chaque client
+:::
+::
+
+## Autres appareils
+---
+- **Téléphone :** installer wireguard et scanner le QR code via le webui (http://ipduserveur:51821)
+- **PC :** Installer wireguard client et mettre directement le fichier de conf téléchargé via le webui
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Si des machines clientes sont sur le meme réseau local que le serveur (derriere la box), éditez le fichier `wg0.conf` uploadé sur cette machine en changeant avec l'adresse locale du serveur : `Endpoint = ipduserveur:51820`{lang=properties}
+:::
+::
+
+Et voilà ce que cela peut donner !
+
+![picture](/img/serveex/wireguard.svg)

content/3.serveex/3.securite/2.authentik.md

@@ -0,0 +1,587 @@
+---
+navigation: true
+title: Authentik
+description: Installer Authentik comme fournisseur d'identité auto-hébergé — configurer le MFA et protéger vos services avec du SSO et l'authentification via reverse proxy.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Authentik
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer et exposer Authentik
+- Paramétrer le Multi-Facteur
+- Protéger une app native ou via reverse proxy
+::
+
+[Authentik](https://goauthentik.io) est un outil d'authentification unique permettant de vous logger une seule fois sur les plateformes compatibles OpenID. Il permet également de sécuriser l'accès aux services que vous exposez, en s'injectant via SWAG aux requetes vers vos services. 
+
+Ainsi, si vous exposez Dockge sur internet via `dockge.mondomaine.fr`, au moment de l'accès à cette page, vous tomberez sur une page de login d'authentik. Si vous avez déjà été identifié sur un autre service sécurisé par authentik auparavant, alors vous serez déjà identifié. cela permet d'avoir à vous identifiez qu'une seule fois par jour sur l'ensemble des services protégés par authentik.
+
+Authentik permet aussi d'utiliser le multi-facteur, notamment par TOTP (code généré par une application d'authentification de votre choix. Enfin, authentik permet aussi de se connecter directement via un compte Microsoft ou Google, si vous avez configuré une application d'un de ces services.
+
+C'est une bonne manière de se passer de VPN pour exposer vos services, et d'exposer des services qui ne sont pas protégés par du MFA voir pas protégés par des login (comme le dashboard de swag). 
+
+Authentik dipose d'[une doc très fournie](https://docs.goauthentik.io/docs/installation/docker-compose) et des [fabuleux tuto de Cooptonian](https://www.youtube.com/@cooptonian). Ici, nous montrerons juste les bases, avec l'exemple de l'exposition de Dockge.
+
+Deux modes principaux sont à connaitre: 
+
+- Le premier permet à une application qui dispose nativement d'une intégration avec du SSO compatible OpenID de se connecter directement à Authentik. C'est la solution à privilégier car elle permet de laisser l'application décider de ce qui est public et de ce qui est protégé.
+
+![Picture](/img/serveex/auth-native.svg)
+
+- Le second permet d'injecter une authentification via authentik grace à SWAG avant d'arriver sur le service désiré.
+
+![Picture](/img/serveex/auth-proxy.svg)
+
+Les deux modes son configurables application par application.
+
+
+
+## Installation
+---
+Structure des dossiers :
+```sh
+root
+└── docker
+    └── authentik
+        ├── .env
+        ├── compose.yml
+        ├── media
+        ├── certs
+        ├── custom-template
+        └── ssh
+```
+
+Créez les dossiers : 
+
+```sh
+sudo mkdir -p /docker/authentik/media /docker/authentik/certs /docker/authentik/custom-template /docker/authentik/ssh
+```
+
+Positionnez vous dans le dossier `authentik` via `cd /docker/authentik` et générez un mot de passe et une clé secrete que l'on va intégrer dans le .env :
+
+```sh
+sudo echo "PG_PASS=$(openssl rand 36 | base64)" >> .env
+sudo echo "AUTHENTIK_SECRET_KEY=$(openssl rand 60 | base64)" >> .env
+```
+::alert{type="info"}
+:::list{type="info"}
+- Afin de générer la clé, nous avons créé les dossiers en amont du déploiement via Dockge. Dockge vous empechera de créer une stack du meme nom dans ces dossiers s'il n'existe pas de `compose.yml`. Il faut donc créer un `compose.yml` vide afin que ce dernier la reconnaisse comme existante dans les stacks inactives :
+:::
+    ```sh
+    sudo vi /docker/authentik/compose.yml
+::
+
+Ouvrez dockge, et cherchez "authentik" dans les stack inactives.
+Nommez la stack authentik et collez la configuration suivante, en changeant les chiffres de `{AUTHENTIK_TAG:-2026.2}`{lang=properties} par [la dernière version de Authentik](https://goauthentik.io/docs/releases). 
+
+```yaml
+---
+services:
+
+  postgresql:
+    image: docker.io/library/postgres:16-alpine
+    container_name: authentik-postgresql
+    restart: unless-stopped
+    healthcheck:
+      test:
+        - CMD-SHELL
+        - pg_isready -d $${POSTGRES_DB} -U $${POSTGRES_USER}
+      start_period: 20s
+      interval: 30s
+      retries: 5
+      timeout: 5s
+    volumes:
+      - database:/var/lib/postgresql/data
+    environment:
+      POSTGRES_PASSWORD: ${PG_PASS:?database password required}
+      POSTGRES_USER: ${PG_USER:-authentik}
+      POSTGRES_DB: ${PG_DB:-authentik}
+    env_file:
+      - .env
+
+  redis:
+    image: docker.io/library/redis:alpine
+    container_name: authentik-redis
+    command: --save 60 1 --loglevel warning
+    restart: unless-stopped
+    healthcheck:
+      test:
+        - CMD-SHELL
+        - redis-cli ping | grep PONG
+      start_period: 20s
+      interval: 30s
+      retries: 5
+      timeout: 3s
+    volumes:
+      - redis:/data
+  
+  server:
+    image: ${AUTHENTIK_IMAGE:-ghcr.io/goauthentik/server}:${AUTHENTIK_TAG:-2026.2}
+    container_name: authentik-server
+    restart: unless-stopped
+    command: server
+    environment:
+      AUTHENTIK_REDIS__HOST: redis
+      AUTHENTIK_POSTGRESQL__HOST: postgresql
+      AUTHENTIK_POSTGRESQL__USER: ${PG_USER:-authentik}
+      AUTHENTIK_POSTGRESQL__NAME: ${PG_DB:-authentik}
+      AUTHENTIK_POSTGRESQL__PASSWORD: ${PG_PASS}
+    volumes:
+      - ./media:/media
+      - ./custom-templates:/templates
+      - ./ssh:/authentik/.ssh
+    env_file:
+      - .env
+    ports:
+      - ${COMPOSE_PORT_HTTP:-9000}:9000
+      - ${COMPOSE_PORT_HTTPS:-9443}:9443
+    depends_on:
+      - postgresql
+      - redis
+
+  worker:
+    image: ${AUTHENTIK_IMAGE:-ghcr.io/goauthentik/server}:${AUTHENTIK_TAG:-2026.2}
+    container_name: authentik-worker
+    restart: unless-stopped
+    command: worker
+    environment:
+      AUTHENTIK_REDIS__HOST: redis
+      AUTHENTIK_POSTGRESQL__HOST: postgresql
+      AUTHENTIK_POSTGRESQL__USER: ${PG_USER:-authentik}
+      AUTHENTIK_POSTGRESQL__NAME: ${PG_DB:-authentik}
+      AUTHENTIK_POSTGRESQL__PASSWORD: ${PG_PASS}
+    # `user: root` and the docker socket volume are optional.
+    # See more for the docker socket integration here:
+    # https://goauthentik.io/docs/outposts/integrations/docker
+    # Removing `user: root` also prevents the worker from fixing the permissions
+    # on the mounted folders, so when removing this make sure the folders have the correct UID/GID
+    # (1000:1000 by default)
+    user: root
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+      - ./media:/media
+      - ./certs:/certs
+      - ./custom-templates:/templates
+      - ./ssh:/authentik/.ssh
+    env_file:
+      - .env
+    depends_on:
+      - postgresql
+      - redis
+
+volumes:
+  database:
+    driver: local
+  redis:
+    driver: local
+```
+
+Dans le point `.env`, les variables `PG_PASS` et `AUTHENTIK_SECRET_KEY` sont déjà remplies.
+Déployez la stack.
+
+Vous pouvez alors commencer le set-up d'authentik en tappant `http://ipduserveur:9000/if/flow/initial-setup/`.
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ il est conseillé de créer un nouveau compte admin, et de **désactiver** le compte admin de base `akadmin`.
+:::
+::
+
+## Exposer authentik
+---
+Pour être utilisable hors de chez vous, vous devez exposer authentik.
+
+::alert{type="info"}
+📋 __Au préalable :__  <br/><br/>
+Nous partons du principe quer vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `auth.mondomaine.fr` avec pour CNAME `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Ouvrez le fichier `authentik-server.conf`.
+
+::alert{type="success"}
+✨ __Astuce pour les allergiques au terminal :__
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/authentik-server.conf
+```
+
+Vérifiez que dans chaque cas les variables ci-dessous sont correctes :
+
+```nginx
+set $upstream_authentik authentik-server;
+proxy_pass http://$upstream_authentik:9000;
+```
+
+Si ce n'est pas le cas, passez en mode modification en tapant `i` et éditez les. Sauvegardez et quittez en tapant sur `Echap` puis `:x`.
+
+Créez le fichier `auth.subdomain.conf`
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/auth.subdomain.conf
+
+```
+
+Appuyez sur `i` pour rentrer en mode modification puis collez la configuration suivante :
+
+```nginx
+## Version 2023/05/31
+# make sure that your authentik container is named authentik-server
+# make sure that your dns has a cname set for authentik
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name auth.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    location / {
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app authentik-server;
+        set $upstream_port 9000;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/authentik)?/api {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app authentik-server;
+        set $upstream_port 9000;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Sauvegardez et quittez en appuyant sur `Echap` puis en tapant `:x`.
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau d'Authentik :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:               # Relie le conteneur au réseau custom 
+      # ...           
+      - authentik            # Nom du réseau déclaré dans la stack
+    
+networks:                    # Définit le réseau custom
+  # ...
+  authentik:                 # Nom du réseau déclaré dans la stack
+    name: authentik_default  # Nom véritable du réseau externe
+    external: true           # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack et patientez le temps que SWAG soit complètement opérationnel.
+
+Et voilà ! Vous pouvez accéder à authentik via `https://auth.mondomaine.fr`
+
+## Activer le multifacteur
+---
+Tout l'intérêt de authentik c'est de disposer du multifacteur pour toutes les apps que l'on protègera.
+ 
+- Rendez vous sur `https://auth.mondomaine.fr`
+- Identifiez-vous
+- Rendez-vous dans _paramètres_
+- Cliquez sur la section _MFA_
+- Cliquez sur _s'inscrire_
+- Choisissez une méthode comme _TOTP device_ ( dans ce cas vous devrez utilisez une app d'authentification telle que Google Authenticator par exemple)
+- Suivez les étapes
+
+Et voilà, vous serez invité à saisir un code à usage unique à chaque connexion.
+
+## Protéger une app native
+---
+Authentik est compatible nativement avec un certain nombre d'application, vous retrouverez la liste et [le support ici](https://docs.goauthentik.io/integrations/services/)
+
+## Protéger une app par reverse proxy
+---
+Swag permet d'intercaler la page d'authentik entre la requête et l'accès à votre service. Pour cela il va falloir :
+
+- Configurer le service d'authentification dans authentik.
+- Configurer le fichier proxy du domaine pour que swag puisse intercaler la page.
+
+Pourquoi le faire alors que Dockge a déjà une page d'authentification ? Tout simplement parce que l'authentification HTTP utilisée par Dockge est faible. Avec Authentik, vous aurez directement une authentification forte par MFA, et vous serez loggé automatiquement à toutes vos apps déjà protégées par authentik. Cela permet de sécuriser l'accès à Dockge et aux autres apps que vous protégerez, sans avoir à passer par un VPN.
+
+### Configuration de Authentik
+
+- Rendez vous dans Authentik
+- Allez dans le panneau d'administration
+- Sélectionnez _application_ puis _créer avec l'assistant_
+- Renseignez les champs comme suit :
+
+![Picture](/img/serveex/auth1.png)
+
+- Puis à l'étape suivante choisissez "Transférer l'authentification (application unique)" et éditez comme suit (attention aux flow, c'est important) :
+
+![Picture](/img/serveex/auth2.png)
+
+- Ensuite, allez dans le menu à gauche dans _Avant-poste_ et éditez _authentik Embedded Outpost_
+
+![Picture](/img/serveex/auth3.png)
+
+- Ajoutez l'application `dockge` en la faisant passer à droite et validez.
+
+### Configuration de SWAG
+
+Ensuite rendez-vous dans le fichier `dockge.mondomaine.fr`.
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/dockge.subdomain.conf
+```
+
+Puis entrez en modification en appuyant sur `i` et enlevez les `#` des deux lignes `#include /config/nginx/authentik-server.conf;`{lang=nginx}.
+
+Appuyez sur `Echap` puis tapez `:x` et appuyez sur `Entrée` pour sauvegarder et quitter.
+
+Et voilà ! En tapant `https://dockge.mondomaine.fr`, vous tomberez à présent sur la mire d'authentification de authentik. 
+
+::alert{type="success"}
+✨ __Astuce :__ dans Dockge, dans les paramètres, vous pouvez désactiver l'authentification de Dockge afin de ne pas avoir à vous identifier deux fois. **Attention**, cela voudra dire que si vous avez exposé un port sur votre réseau local, il n'y aura plus aucune authentification.
+::
+
+::alert{type="info"}
+:::list{type="info"}
+- Vous pouvez répétez l'opération pour chaque application que vous souhaitez protéger (si elle ne dipose pas d'intégration directe avec Authentik).
+:::
+::
+
+Voilà votre nouvelle architecture :
+
+![Picture](/img/serveex/authentik.svg)
+
+## Protéger un service sur un serveur distant
+---
+Dans le cas d'une application [native](/serveex/securite/authentik#protéger-une-app-native) (via OAuth 2.0 ou autre), rien ne change.
+
+Dans le cas d'une application non native à protéger derrière un reverse proxy, vous devrez déployer un __avant-poste__. Un avant-poste est un conteneur qui jouera le rôle de proxy local, c'est à dire que c'est vers ce conteneur que les requêtes d'authentification de vos applications seront redirigées. C'est le seul qui est autorisé à dialoguer avec l'API de votre instance authentik.
+
+
+::alert{type="info"}
+Pré-requis :
+- Avoir installé [docker](/serveex/coeur/docker) sur votre machine distante hébergeant le service à protéger.
+- Si l'application n'a pas d'intégration native, avoir un reverse proxy compatible. Comme partout ici, nous utiliserons [SWAG](/serveex/coeur/swag).
+:: 
+
+Ce conteneur redirigera ensuite les requetes vers votre instance [Authentik](/serveex/securite/authentik#authentik) principale, à travers le web (ou votre réseau local). Le serveur executera les controle et renverra la réponse à l'_avant-poste_, qui bloquera ou non la connexion à l'app protégée.
+
+![auth-outpost](/img/serveex/auth-outpost.svg)
+
+### Configuration d'Authentik
+
+Créez vos [fournisseurs et applications](/serveex/securite/authentik#protéger-une-app-native) comme nous l'avons vu plus haut.
+
+Puis, dans votre panneau admin, allez dans la rubrique _Applications > Avant-postes_, puis créez un nouvel avant-poste.
+
+Remplissez comme suit :
+
+
+| Champs         | Valeur                                                                |
+|----------------|-----------------------------------------------------------------------|
+| `Nom`          | Le nom que vous souhaitez                                             |
+| `Type`         | `Proxy`                                                               |
+| `Intégration`  | Laissez vide                                                          |
+| `Applications` | Sélectionnez le ou les applications que vous avez créées précédemment |
+
+Dans la section `Paramètres avancés`, supprimez l'existant, et complétez comme suit :
+
+```yaml
+log_level: info
+docker_labels: null
+authentik_host: https://domaine_de_votre_serveur_authentik/
+object_naming_template: ak-outpost-%(name)s
+authentik_host_insecure: false
+container_image:
+docker_network: null
+docker_map_ports: true
+docker_labels: null
+```
+
+Enrtegistrez et quittez.
+
+Sur l'écran affichant les avant-postes créés, vous verrez le nouvel avant-poste que vous venez de créer. A la fin de la ligne, cliquez sur _afficher les informations_, et copiez précieusement le jeton d'accès.
+
+### Configuration de la machine distante
+
+Nous partons du principe que vous avez déjà installé [Docker](/serveex/coeur/docker) et [SWAG](/serveex/coeur/swag) sur cette machine distante.
+
+Sur votre machine distante, à l'aide de [Dockge](/serveex/coeur/docker/#installer-dockge-pour-gérer-et-déployer-les-conteneurs), créez une stack `authentik-outpost`.
+
+Si vous n'avez pas installé [Dockge](/serveex/coeur/docker/#installer-dockge-pour-gérer-et-déployer-les-conteneurs), créez un dossier `/docker/authentik-outpost`, ou directement en ligne de commande :
+
+```sh
+sudo mkdir -P /docker/authentik-outpost
+```
+
+::alert{type="success"}
+✨ __Astuce pour les allergiques au terminal :__
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+Créez le fichier `compose.yaml` ou copiez la configuration directement dans le champs si vous avez [Dockge](/serveex/coeur/docker/#installer-dockge-pour-gérer-et-déployer-les-conteneurs)
+
+En ligne de commande :
+
+```sh
+sudo vi /docker/authentik-outpost/compose.yaml
+```
+Entrez en mode modification avec `i` et collez la configuration suivante, en changeant les chiffres de `{AUTHENTIK_TAG:proxy:2024.2.3}`{lang=properties} par la meme version que celle de votre serveur Authentik. 
+
+```yaml
+version: "3.5"
+services:
+  authentik_proxy:
+    container_name: authentik-outpost
+    image: ghcr.io/goauthentik/proxy:2024.2.3
+    # Optionally specify which networks the container should be
+    # might be needed to reach the core authentik server
+    restart: unless-stopped
+    env_file:
+      - .env
+    #   - foo
+    ports:
+      - 9000:9000
+      - 9443:9443
+    environment:
+      AUTHENTIK_HOST: ${HOST}
+      AUTHENTIK_INSECURE: "false"
+      AUTHENTIK_TOKEN: ${TOKEN}
+      # Starting with 2021.9, you can optionally set this too
+      # when authentik_host for internal communication doesn't match the public URL
+      # AUTHENTIK_HOST_BROWSER: https://external-domain.tld
+```
+
+Rendez-vous sur la stack de SWAG de la machine distante (ou remplissez directement si vous avez [Dockge](/serveex/coeur/docker/#installer-dockge-pour-gérer-et-déployer-les-conteneurs)) et ajoutez le réseau de authentik-outpost dans le fichier de conf sur ce modele (les champs `networks`) :
+
+
+```sh
+sudo vi /docker/swag/compose.yaml
+```
+
+```yaml
+services:
+  swag:
+     container_name: #...
+      # ... 
+     networks:                      # Relie le conteneur au réseau custom 
+      - authentik-outpost           # Nom du réseau déclaré dans la stack
+    
+networks:                           # Définit le réseau custom
+  #...
+  authentik-outpost:                # Nom du réseau déclaré dans la stack
+    name: authentik-outpost_default # Nom véritable du réseau externe
+    external: true                  # Précise que c'est un réseau à rechercher en externe
+```
+
+Appuyez sur `Echap` puis tapez `:x` et appuyez sur `Entrée` pour sauvegarder et quitter.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de dockge est `authentik-outpost_default`.
+:::
+::
+
+Si vous avez [Dockge](/serveex/coeur/docker/#installer-dockge-pour-g"rer-et-d"ployer-les-conteneurs), relancez SWAG.
+
+Sinon, via le terminal :
+
+```sh
+cd /docker/swag/
+sudo docker compose up -d
+```
+
+Creez (ou remplissez directement si vous avez [Dockge](/serveex/coeur/docker/#installer-dockge-pour-gérer-et-déployer-les-conteneurs)) le fichier `.env` dans le dossier de l'avant poste authentik :
+
+En ligne de commande :
+
+```sh
+sudo vi /docker/authentik-outpost/.env
+```
+
+Entrez en mode modification avec `i` et collez la configuration suivante
+
+```properties
+HOST=
+TOKEN=
+```
+Remplissez comme suit
+
+| Variable                | Valeur                                                  | Exemple                    |
+|-------------------------|---------------------------------------------------------|----------------------------|
+| `HOST`{lang=properties}  | L'url de votre serveur authentik                        | `https://auth.domaine.fr`  |
+| `TOKEN`{lang=properties} | Le token que vous avez précédemment copié précieusement | `Q2pVEqsTNRkJSO9SkJzU3KZ2` |
+
+Appuyez sur `Echap` puis tapez `:x` et appuyez sur `Entrée` pour sauvegarder et quitter.
+
+Si vous avez [Dockge](/serveex/coeur/docker/#installer-dockge-pour-g"rer-et-d"ployer-les-conteneurs), déployez la stack.
+
+Sinon, via le terminal :
+
+```sh
+cd /docker/authentik-outpost/
+sudo docker compose up -d
+```
+
+Le conteneur est en route, vous pouvez vérifier son état dans votre panneau admin de votre instance Authentik, section _Applications > Avant-postes_. 
+
+
+Nous allons a présent configurer SWAG.
+
+Ouvrez le fichier `authentik-server.conf`.
+
+```sh
+sudo vi /docker/swag/config/nginx/authentik-server.conf
+```
+
+Dans le fichier, passez en mode modification en tapant `i` et changez `authentik-server` par `authentik-outpost` comme suit :
+
+```nginx
+set $upstream_authentik authentik-outpost;
+proxy_pass http://$upstream_authentik:9000;
+```
+
+Sauvegardez et quittez en tapant sur `Echap` puis `:x` et sur `Entrée`.
+
+Ensuite, configurez les applications à protéger selon si elles sont [natives](/serveex/securite/authentik#protéger-une-app-native) ou par [proxy](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy) comme vous l'avez fait sur votre serveur principal.
+
+## Migrer une base authentik
+---
+Sur la machine d'origine, dumper la bdd :
+
+```sh
+sudo docker exec authentik-postgres pg_dump -U authentik -F t authentik > /path/to/mydb.tar
+```
+
+Puis l'envoyer sur la machine cible. Sur la machine cible, copier le fichier dans le container docker
+
+```sh
+cp /path/to/mydb.tar authentik-postgres:/path/to/wherever
+```
+
+(Optionnel) Purgez les tables existantes :
+
+```sh
+sudo docker exec -i authentik-postgres psql -U authentik -c "SELECT pg_terminate_backend(pg_stat_activity.pid) FROM pg_stat_activity WHERE pg_stat_activity.datname = 'authentik' AND pid <> pg_backend_pid();" && \
+sudo docker exec -i authentik-postgres psql -U authentik -d postgres -c "DROP DATABASE IF EXISTS authentik;" && \
+sudo docker exec -i authentik-postgres psql -U authentik -d postgres -c "CREATE DATABASE authentik;" && \
+```
+
+Restaurez la bdd
+
+```sh
+sudo docker exec authentik-postgresql pg_restore -U authentik -d authentik /path/to/wherever/mydb.tar
+```

content/3.serveex/3.securite/3.cloudflare.md

@@ -1,16 +1,28 @@
 ---
+navigation: true
 title: Cloudflare Zero Trust
-description: Utiliser les tunnels Cloudflare et Zero Trust pour exposer des services sans ouvrir de ports, configurer SWAG et gérer plusieurs tunnels.
+description: Utiliser les tunnels Cloudflare et Zero Trust pour exposer des services sans ouvrir de ports — configurer SWAG et gérer plusieurs tunnels.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Cloudflare Zero Trust
 
+::alert{type="info"}
+🎯 __Objectifs :__
+  - Comprendre le principe des Tunnels Cloudflare
+  - Paramétrer son compte cloudflare
+  - Paramétrer SWAG
+  - Gérer plusieurs tunnels
+::
 
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
 ![cloudfare_tunnels](/img/serveex/cloudflared.svg)
 
 ## Introduction
+---
 L'architecture _Zero Trust_ est la pratique consistant à concevoir des systèmes fondés sur le principe de __« ne jamais faire confiance__, __toujours vérifier »__, par opposition au principe traditionnel de __« confiance, mais vérifier »__. Ce concept est devenu très populaires récemment, à la suite des attaques toujours plus nombreuses concernant les données des utilisateurs. C'est un concept très large, nous nous concentrerons sur l’application du _Zero Trust_ aux services Web que nous hébergeons.
 
-Les _tunnels Cloudflare_ offrent un moyen simple d'arriver au _Zero Trust_, en s'appuyant sur [SWAG](/serveex/core/swag) et [Authentik](/serveex/advanced/authentik).
+Les _tunnels Cloudflare_ offrent un moyen simple d'arriver au _Zero Trust_, en s'appuyant sur [SWAG](/serveex/coeur/swag) et [Authentik](/serveex/securite/authentik).
 
 Pour le dire simplement, les Tunnels Cloudflare permettent notamment de :
 
@@ -22,23 +34,26 @@ Pour le dire simplement, les Tunnels Cloudflare permettent notamment de :
 
 Ici, nous expliquerons comment associer SWAG aux tunnels Cloudflare.
 
-::warning
-__Attention :__
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__
+:::
 - N'utilisez pas les tunnels Cloudflare pour exposer un serveur mail
-- N'utilisez pas les tunnels Cloudflare pour exposer un service vidéo comme Jellyfin. Contrairement à Plex, [Jellyfin n'a pas de relais cloud](/serveex/media/jellyfin) et est exposé directement par SWAG dans ce guide, veillez donc à le laisser derrière une simple redirection de port plutôt que derrière un tunnel Cloudflare
-- N'utilisez pas les tunnels Cloudflare pour le protocole BitTorrent (si vous avez [suivi ce guide](/serveex/media/qbittorrent), tout est bon)
+- N'utilisez pas les tunnels Cloudflare pour exposer un service vidéo, comme Plex (si vous avez [suivi ce guide](/serveex/media/plex), Plex n'est pas exposé, c'est donc valide)
+- N'utilisez pas les tunnels Cloudflare pour utiliser le protocole bittorrent (si vous avez [suivi ce guide](/serveex/media/qbittorrent), tout est bon)
 ::
 
 ## Configuration Cloudflare
+---
 ### Zone DNS
 
-Avant toute chose, vous devez définir Cloudflare comme gestionnaire de votre [zone DNS](/general/networking/dns). Si vous avez réservé votre nom de domaine chez Cloudflare, c'est déjà le cas. Sinon, renseignez vous auprès de votre registrar sur comment ajouter des DNS externes. Cloudflare dispose d'[une documentation expliquant pas à pas comment paramétrer une Zone DNS](https://developers.cloudflare.com/dns/zone-setups/full-setup/setup/), que vous ayez un domaine externe ou reservé chez Cloudflare.
+Avant toute chose, vous devez définir Cloudflare comme gestionnaire de votre [zone DNS](/generalites/reseau/dns). Si vous avez réservé votre nom de domaine chez Cloudflare, c'est déjà le cas. Sinon, renseignez vous auprès de votre registrar sur comment ajouter des DNS externes. Cloudflare dispose d'[une documentation expliquant pas à pas comment paramétrer une Zone DNS](https://developers.cloudflare.com/dns/zone-setups/full-setup/setup/), que vous ayez un domaine externe ou reservé chez Cloudflare.
 
 Si vous avez qu'un seul serveur à protéger derrière Cloudflare, vous pouvez supprimer l'ensemble des enregistrement DNS existant, par défaut le domaine et tout ses sous-domaines seront directement redirigés vers le tunnel.
 
 Si vous avez des sous-domaines à rediriger vers d'autres serveurs, vous pourrez toujours les déclarer dans la zone DNS à l'aide d'un enregistrement A.
 
-Si vous avez plusieurs serveurs et donc plusieurs tunnels pour un meme domaine principal, [voyez ici](#gérer-plusieurs-tunnels-pour-plusieurs-serveurs).
+Si vous avez plusieurs serveurs et donc plusieurs tunnels pour un meme domaine principal, [voyez ici](http://192.168.7.80:8005/serveex/cloudflare/#gerer-plusieurs-tunnels-pour-plusieurs-serveurs).
 
 ### Clé API
 
@@ -58,12 +73,15 @@ Une fois que nous aurons enregistré, notre jeton sera affiché une fois. copiez
 
 Vous devez vous inscrire à _Cloudflare Teams_ pour pouvoir accéder au tableau de bord _Zero Trust_ qui gère les tunnels et les politiques d'accès. Il s'agit d'un service premium, mais ils proposent un forfait gratuit pour un maximum de 50 utilisateurs, ce qui devrait suffire pour votre Home Lab. Gardez à l’esprit que puisqu’il s’agit d’une fonctionnalité premium, ils demandent une carte de crédit valide lors de l’inscription, mais avec le forfait gratuit, il n'y aura aucun frais. 
 
-Inscrivez-vous [via ce lien](https://one.dash.cloudflare.com/).
+Inscrivez-vous [via ce lien](https://dash.teams.cloudflare.com/).
+
 
 ## Configuration de Swag
-::note
-
-Nous partons du principe que vous avez le domaine `mondomaine.fr` avec les DNS qui pointent bien vers ceux de Cloudflare, comme vu précédemment.
+---
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que vous avez le domaine `mondomaine.fr` avec les DNS qui pointent bien vers ceux de Cloudflare, comme vu précédemment.
+:::
 ::
 
 SWAG dispose de deux `Docker Mods` permettant d'y intégrer :
@@ -73,33 +91,30 @@ SWAG dispose de deux `Docker Mods` permettant d'y intégrer :
 
 Ces deux mods, fusionnés dans le conteneur de SWAG, nécessitent un peu de configuration.
 
-::steps{level="3"}
 ### Configuration du tunnel
 
 Pour configurer les tunnels, nous aurons besoin de créer un fichier `tunnelconfig.yml` auquel nous ferons appel dans le `compose.yaml` de SWAG.
 
-::tip{icon="" to="/serveex/files/file-browser-quantum"}
-✨ __Astuce :__ vous pouvez utiliser **File Browser Quantum** pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
 ::
 
-```bash [Terminal]
-sudo nano /srv/docker/swag/config/tunnelconfig.yml
+```sh
+sudo vi /docker/swag/config/tunnelconfig.yml
 ```
 
-Collez la configuration ci-dessous
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous
 
-```yaml [tunnelconfig.yml]
+```yaml
 ingress:
   - hostname: mondomaine.fr
     service: https://mondomaine.fr
-
   - hostname: "*.mondomaine.fr"
     service: https://mondomaine.fr
-
   - service: http_status:404
 ```
 
-Enregistrez avec :kbd{value="Ctrl+O"} puis :kbd{value="Entrée"}, puis quittez avec :kbd{value="Ctrl+X"}.
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
 
 ### Configuration de Cloudflare Real IP
 
@@ -107,37 +122,24 @@ A présent, nous allons configurer le bon fonctionnement du mode _Cloudflare Rea
 
 Ouvrez le fichier `nginx.conf`
 
-```bash [Terminal]
-sudo nano /srv/docker/swag/config/nginx/nginx.conf
+```sh
+sudo vi /docker/swag/config/nginx/nginx.conf
 ```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous à la fin de la section `http`
 
-Collez la configuration ci-dessous à la fin de la section `http` :
-
-```nginx [nginx.conf]
+```nginx
 real_ip_header X-Forwarded-For;
 real_ip_recursive on;
 include /config/nginx/cf_real-ip.conf;
 set_real_ip_from 127.0.0.1;
 ```
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
 
-Enregistrez avec :kbd{value="Ctrl+O"} puis :kbd{value="Entrée"}, puis quittez avec :kbd{value="Ctrl+X"}.
-
-### Déployer la stack SWAG
-
-::warning
-
-Ceci remplace toute la définition du service SWAG. Si vous avez déjà ajouté une section `networks:` ou des `EXTRA_DOMAINS` pour d'autres apps (Dockge, TinyAuth, etc.), fusionnez-les avec le bloc ci-dessous au lieu de l'écraser, sinon vous perdrez cette configuration.
-::
-
-Assurez-vous que le fichier de base fail2ban existe déjà, sinon Docker créera un dossier à sa place au lieu de monter le fichier, ce qui casse silencieusement la persistance des bannissements :
-
-```bash [Terminal]
-sudo touch /srv/docker/swag/config/fail2ban/fail2ban.sqlite3
-```
+### Docker compose
 
 Ouvrez Dockge, éditez la stack SWAG avec cette configuration
 
-```yaml [compose.yaml]
+```yaml
 ---
 services:
   swag:
@@ -168,24 +170,26 @@ services:
     ports:
       - 81:81
     volumes:
-      - /srv/docker/swag/config:/config
-      - /srv/docker/swag/config/fail2ban/fail2ban.sqlite3:/dashboard/fail2ban.sqlite3:ro
+      - /docker/swag/config:/config
+      - /docker/swag/config/fail2ban/fail2ban.sqlite3:/dashboard/fail2ban.sqlite3:ro
     restart: unless-stopped
 ```
 
-::tip{icon=""}
-✨ __Astuce :__ ajoutez un label Watchtower pour automatiser les mises à jour :
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
 
-```yaml [compose.yaml]
----
+    ```yaml
+    services:
+      swag:
+        #...
         labels:
           - com.centurylinklabs.watchtower.enable=true
-```
 ::
 
-Renseignez votre fichier `.env` :
 
-```properties [.env]
+Et renseignez le `.env` les infos que vous avez trouvées et notées tout au long de ce guide
+
+```properties
 PUID=
 PGID=
 DOMAIN=
@@ -201,7 +205,7 @@ TUNNEL_PW=
 | Variable                          | Valeur                                                                                                    | Exemples                       |
 |-----------------------------------|-----------------------------------------------------------------------------------------------------------|--------------------------------|
 | `PUID`{lang=properties}            | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell}) | `1000`                           |
-| `PGID`{lang=properties}              | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell}) | `1000 `                          |
+| `GUID`{lang=properties}              | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell}) | `1000 `                          |
 | `DOMAIN`{lang=properties}            | Le domaine que vous avez réservé                                                                          | `mondomaine.fr`                  |
 | `PLUGIN`{lang=properties}            | Le fournisseur de zone DNS, ici Cloudflare. Pensez à renseigner `cloudflare.ini` (voir [guide de swag](https://docs.linuxserver.io/general/swag/#create-container-via-dns-validation-with-a-wildcard-cert))                                                                | `cloudflare`                     |
 | `EMAIL`{lang=properties}             | Votre email pour le certificat                                                                            | `[email protected]`                 |
@@ -213,58 +217,53 @@ TUNNEL_PW=
 
 Une fois fait, déployez la stack. Cela prendra un peu de temps, vérifiez les logs, vous devriez arriver à `serveur ready`
 
-Une fois le conteneur en ligne, vérifiez dans cloudflare que votre tunnel est bien présent dans la section _Networks > Tunnels_ de [Cloudflare Zero Trust](https://one.dash.cloudflare.com/). Par défaut, l'ensemble des sous domaine sont redirigés vers le tunnel, sans avoir besoin de les déclarer [dans votre zone DNS](/general/networking/dns).
+Une fois le conteneur en ligne, vérifiez dans cloudflare que votre tunnel est bien présent dans la section _Networks > Tunnels_ de [Cloudflare Zero Trust](https://one.dash.cloudflare.com/). Par défaut, l'ensemble des sous domaine sont redirigés vers le tunnel, sans avoir besoin de les déclarer [dans votre zone DNS](/generalites/reseau/dns).
 
-::tip{icon="" to="/general/networking/dns"}
-✨ __Astuce :__ si vous voulez exposer un service sans tunnel, déclarez simplement un enregistrement A **dans votre zone DNS**. En cas de problème de résolution, désactivez la fonction _proxy_ pour cet enregistrement, par exemple pour `sous.mondomaine.fr`.
+::alert{type="success"}
+✨ __Astuce:__ si vous voulez exposer un service sans tunnel, vous pouvez toujours déclarer un enregistrement A [dans votre zone DNS](/generalites/reseau/dns). En cas de problème de résolution, désactivez la fonction _proxy_ pour cet enregistrement. Par exemple pour `sous.mondomaine.fr`
 ![dns](/img/serveex/cf-dns.png)
 ::
 
-### Terminé !
-::
 
 ## Gérer plusieurs tunnels pour plusieurs serveurs
-Par défaut, l'ensemble des sous-domaines de votre domaine passent par l'unique tunnel. Mais si vous avez un second serveur, il suffit de changer le nom du tunnel dans cette instance de SWAG, puis de rediriger les sous-domaines vers le bon tunnel dans votre zone DNS.
+---
+Par défaut, l'ensemble des sous domaine de votre nom de domaine pointent vers le tunnel que vous avez créé. Mais si vous avez un second serveur, vous pouvez avoir un second tunnel en changeant seulement le nom de tunnel dans la configuration de l'instance swag de votre serveur.
 
-::steps{level="3"}
-### Changer le nom du tunnel
+Vous devrez ensuite dans votre zone DNS rediriger les sous domaine souhaité vers le bon tunnel. Pour cela, faites comme suit.
 
-Dans la stack SWAG du second serveur, mettez un `TUNNEL_NAME` différent dans le fichier `.env`, puis redéployez.
+Rendez-vous dans dans la section _Networks > Tunnels_ de [Cloudflare Zero Trust](https://one.dash.cloudflare.com/).
 
-### Trouver les ID des tunnels
-
-Rendez-vous dans la section _Networks > Tunnels_ de [Cloudflare Zero Trust](https://one.dash.cloudflare.com/) et notez les ID des tunnels :
+Notez les deux ID des tunnels
 
 ![tunnels_id](/img/serveex/cf-tunnels-id.png)
 
-### Ajouter les enregistrements CNAME
+Rendez-vous à présent dans la section DNS de [cloudflare](https://dash.cloudflare.com/), après avoir cliqué sur le nom de domaine concerné. 
 
-Dans le [tableau de bord DNS de Cloudflare](https://dash.cloudflare.com/), cliquez sur votre nom de domaine, puis sur `Ajouter un enregistrement` et ajoutez ces deux enregistrements CNAME (en incluant bien `.cfargotunnel.com`) :
+Cliquez sur `ajouter un enregistrement` et ajoutez deux enregistrements comme suit en ajoutant bien `.cfargotunnel.com` après vos id de tunnels.
 
 | Type    | Nom            | Cible                               |
 |---------|----------------|-------------------------------------|
 | `CNAME` | `sousdomaine1` | `votreiddetunnel1.cfargotunnel.com` |
 | `CNAME` | `sousdomaine2` | `votreiddetunnel2.cfargotunnel.com` |
 
-### Terminé !
-::
+
 
 Si vous avez de nombreux sous-domaines, vous pouvez déclarer un seul sous domaine par tunnel comme ci-dessus, puis déclarer vos autres sous domaine en les faisant pointer vers ces sous domaines de référence.
 
-Ainsi, en cas de changement d'ID de tunnel, vous n'aurez qu'un seul enregistrement DNS à modifier.
-
+Ainsi, en cas de changement d'id de tunnel, vous n'aurez qu'à le changer que pour un seul sous-domaine.
 Par exemple :
     
-- `sub1` et `sub2` pointent eux aussi vers le serveur derrière `sousdomaine1` :
+- Le serveur de `sousdomaine1` doit egalement etre la cible de sub1, et sub2 :
 
     | Type    | Nom            | Cible                               |
-|---------|--------|----------------|
+    |---------|----------------|-------------------------------------|
     | `CNAME` | `sub1` | `sousdomaine1` |
     | `CNAME` | `sub2` | `sousdomaine1` |
     
-- `sub3` et `sub4` pointent vers le serveur derrière `sousdomaine2` :
+- Le serveur de `sousdomaine2` doit egalement etre la cible de sub3, et sub4 :
 
     | Type    | Nom            | Cible                               |
-|---------|--------|----------------|
+    |---------|----------------|-------------------------------------|
     | `CNAME` | `sub3` | `sousdomaine2` |
     | `CNAME` | `sub4` | `sousdomaine2` |
+

content/3.serveex/3.securite/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: La sécurité
+icon: lucide:trash-2

content/3.serveex/4.monitoring/1.uptime-kuma.md

@@ -0,0 +1,199 @@
+---
+navigation: true
+title: Uptime-Kuma
+description: Installer Uptime-Kuma pour surveiller la disponibilité de vos services auto-hébergés, configurer des alertes et protéger le tableau de bord avec Authentik.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Uptime-Kuma
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer et déployer Uptime-Kuma
+- Exposer Uptime Kuma
+- (Optionnel) Protéger Uptime-Kuma avec Authentik
+::
+
+[Uptime-Kuma ](https://github.com/louislam/uptime-kuma)est un conteneur dédié au monitoring de services. Le principe est d'envoyer des requêtes régulières à vos services afin de déterminer s'ils sont en lignes ou non, et de vous alerter le cas échéant. Uptime-Kuma est développé par le meme développeur que Dockge. 
+
+![picture](https://user-images.githubusercontent.com/1336778/212262296-e6205815-ad62-488c-83ec-a5b0d0689f7c.jpg)
+
+## Installation
+---
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── uptime-kuma
+        ├── date
+        └── compose.yaml
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `uptime-kuma` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  uptime-kuma:
+    image: louislam/uptime-kuma:2-slim
+    container_name: uptime-kuma
+    volumes:
+      - /docker/uptime-kuma/uptime-kuma-data:/app/data
+    ports:
+      - 3200:3001 # <Host Port>:<Container Port>
+    restart: always
+```
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      uptime-kuma:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Vous n'avez plus qu'à accéder à l'outil via `http://ipdevotreserveur:3200`.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer avec Swag
+---
+::alert{type="info"}
+📋 __Au préalable :__ 
+<br/><br/>
+Nous partons du principe que vous avez le sous-domaine `stats.mondomaine.fr` avec un `CNAME` qui pointe vers `mondomaine.fr` dans votre [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur via [les règles NAT](/generalites/reseau/nat).
+::
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Uptime-Kuma n'utilise pas d'authentification multifacteur. Exposer Uptime-Kuma sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Dans les dossiers de Swag, créez le fichier `stats.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce pour les allergiques au terminal :__
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/stats.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name stats.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app uptime-kuma;
+        set $upstream_port 3001;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau d'Uptime-Kuma :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:                 # Relie le conteneur au réseau custom 
+      # ...           
+      - uptime-kuma            # Nom du réseau déclaré dans la stack
+    
+networks:                      # Définit le réseau custom
+  # ...
+  uptime-kuma:                 # Nom du réseau déclaré dans la stack
+    name: uptime-kuma_default  # Nom véritable du réseau externe
+    external: true             # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Uptime-Kuma est `uptime-kuma_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Et voilà, vous avez exposé Uptime-Kuma, vous pouvez y accéder en tapant `https://stats.mondomaine.fr`
+
+::alert{type="success"}
+✨ __Astuce :__ 
+<br/><br>
+Vous pouvez protéger cette app avec Authentik en ouvrant `stats.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy). Si vous souhaitez que la page publique de stats soit joignable par tout le monde sans authentification:
+
+- Editez le fournisseur d'Uptime-Kuma
+- Dans *paramètres avancés du protocole > chemins authentifiés*, saisissez :
+
+    ```properties
+    ^/$
+    ^/status
+    ^/assets/
+    ^/assets
+    ^/icon.svg
+    ^/api/.*
+    ^/upload/.*
+    ^/metrics    
+::
+
+Déployez à nouveau la stack.
+
+Uptime-Kuma sera ainsi joignable directement depuis internet en tapant `https://stats.mondomaine.fr`.
+
+
+::alert{type="success"}
+✨ __Astuce :__ Si vous utilisez Authentik et que vous ne craignez pas d'exposer votre panneau admin à votre réseau local, vous pouvez désactiver l'authentification d'Uptime-Kuma via les paramètres, afin de ne garder que celle d'Authentik.
+::

content/3.serveex/4.monitoring/2.dozzle.md

@@ -0,0 +1,181 @@
+---
+navigation: true
+title: Dozzle
+description: Installer Dozzle pour surveiller les logs des conteneurs Docker en temps réel depuis une interface web épurée, exposée via SWAG.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Dozzle
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer Dozzle
+- Exposer Dozzle avec Swag
+::
+
+[Dozzle](https://dozzle.dev/) est un conteneur permettant d'accéder au logs de vos conteneurs et de les afficher en temps réel de via une interface user-friendly. C'est une manière simple de naviguer entre les logs et de retrouver des informations dans l'historique.
+
+![Dozzle](https://blog.unixhost.pro/wp-content/uploads/2023/03/image-5.png)
+
+## Installation
+---
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── dozzle
+        └── data
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `dozzle` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  dozzle:
+    container_name: dozzle
+    image: amir20/dozzle:latest
+    ports:
+      - 9135:8080
+    env_file:
+      - .env
+    environment:
+      - DOZZLE_HOSTNAME=${DOMAIN}
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock
+```
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      dozzle:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Renseignez le `.env` votre nom de domaine, par exemple
+
+```properties
+DOMAIN=dozzle.mondomaine.fr
+```
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:9135`. Et voilà, votre instance Dozzle en webui est disponible !
+
+## Exposer Dozzle avec Swag
+---
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Dozzle n'utilise pas d'authentification multifacteur. Exposer Dozzle sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Vous aurez peut-etre envie d'y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Dozzle via Swag.
+
+::alert{type="info"}
+📋 __Au préalable :__
+<br/><br/>
+Nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `dozzle.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau de Dozzle :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:                 # Relie le conteneur au réseau custom 
+      # ...           
+      - dozzle           # Nom du réseau déclaré dans la stack
+    
+networks:                      # Définit le réseau custom
+  # ...
+  dozzle:                 # Nom du réseau déclaré dans la stack
+    name: dozzle_default  # Nom véritable du réseau externe
+    external: true             # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Dozzle est `dozzle_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+
+Dans les dossiers de Swag, créez le fichier `dozzle.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/dozzle.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name dozzle.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app dozzle;
+        set $upstream_port 8080;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé Dozzle !
+
+::alert{type="success"}
+✨ Vous pouvez protéger cette app avec Authentik en ouvrant `dozzle.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/4.monitoring/3.speedtest-tracker.md

@@ -0,0 +1,207 @@
+---
+navigation: true
+title: Speedtest Tracker
+description: Installer Speedtest Tracker pour mesurer et enregistrer automatiquement la vitesse de votre connexion internet dans le temps, exposé avec SWAG.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Speedtest Tracker
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer Speedtest Tracker
+- Exposer Speedtest Tracker avec Swag
+::
+
+[Speedtest Tracker](https://docs.speedtest-tracker.dev/) est un conteneur permettant de programmer des speedtest régulier afin d'historiser l'état de la connexion internet de votre serveur.
+
+![speedtest-tracker](/img/serveex/speedtest-tracker.avif)
+
+## Installation
+---
+::alert{type="info"}
+:::list{type="info"}
+- Nous utiliserons l'image docker maintenue par [LinuxServer.io](https://docs.linuxserver.io/images/docker-speedtest-tracker/)
+:::
+::
+
+Structure des fichiers
+
+```sh
+root
+└── docker
+    └── speedtest-tracker
+        └── data
+            └── config
+```
+
+Dans un terminal, générez une clé avec la commande suivante :
+
+```sh
+echo -n 'base64:'; openssl rand -base64 32;
+```
+
+Notez la clé.
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `speedtest-tracker` puis copiez collez ceci :
+
+```yaml
+---
+services:
+    speedtest-tracker:
+        image: lscr.io/linuxserver/speedtest-tracker:latest
+        restart: unless-stopped
+        container_name: speedtest-tracker
+        ports:
+            - ${PORT}:80
+        environment:
+            - PUID=${PUID}
+            - PGID=${GUID}
+            - TZ=Europe/Paris
+            - APP_KEY=${API_KEY}
+            - DB_CONNECTION=sqlite
+            - SPEEDTEST_SCHEDULE=${SCHEDULE}
+        volumes:
+            - /docker/speedtest-tracker/data/config:/config
+```
+
+Trouvez votre `PUID` et votre `GUID` en tapant la commande suivante :
+
+```sh
+id nomdutilisateur
+```
+
+Dans `.env` renseignez la variable `API_KEY` avec la clé que vous avez générée et un planning de test au format cron, ainsi que vos `PUID` et `GUID`, par exemple :
+
+```properties
+SCHEDULE=15 */6 * * * # toutes les 6h
+API_KEY=base64:zihejehkj8_nzhY/OjeieR= # votre clé
+PUID=1000
+GUID=1000
+PORT=3225 # port d'accès à la webui
+```
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez configurer d'autres variables d'environnements en consultant la [documentation officielle](https://docs.speedtest-tracker.dev/getting-started/environment-variables).
+::
+
+Déployez le conteneur et rendez-vous sur http://ipduserveur:3225. Connectez vous avec le compte `[email protected]` et le mot de passe `password`. N'oubliez pas de changer votre id et votre mot de apsse une fois connecté !
+
+
+## Exposer Speedtest Tracker
+---
+::alert{type="info"}
+📋 __Prérequis :__ <br/></br>
+Nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `speedtest.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Il s'agit maintenant d'exposer Speedtest Tracker sur internet, afin de pouvoir y accéder sans que vous soyez chez vous. Pour cela, nous partons du principe que vous avez configuré un sous domaine `speedtest.mondomaine.fr` dans votre zone DNS dont le `CNAME` pointe sur `mondomaine.fr`.
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Speedtest Tracker n'utilise pas d'authentification multifacteur. Exposer Speedtest Tracker sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Ouvrez le fichier speedtest.subdomain.conf :
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/speedtest.subdomain.conf
+```
+
+Paramétrez le comme tel :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+    
+    # indique que le sous-domaine doit être dirigé
+    server_name speedtest.*;  
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    # indique que les pays dans la blacklist sont intedits
+    if ($geo-blacklist = no) { return 404; } 
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        
+        set $upstream_app speedtest-tracker; # Nom du conteneur
+        set $upstream_port 3225; # Port interne conteneur
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Sauvegardez et quittez. La configuration va se mettre à jour en quelques secondes. 
+
+::alert{type="info"}
+:::list{type="info"}
+- Par défaut, swag ne connait pas le nom "speedtest-tracker". Pour qu'il puisse y accéder, vous devez rajouter le réseau de Speedtest Tracker dans le `compose.yml` de SWAG.
+:::
+::
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau de Speedtest Tracker :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:                       # Relie le conteneur au réseau custom 
+      # ...           
+      - speedtest-tracker            # Nom du réseau déclaré dans la stack
+    
+networks:                            # Définit le réseau custom
+  # ...
+  speedtest-tracker:                 # Nom du réseau déclaré dans la stack
+    name: speedtest-tracker_default  # Nom véritable du réseau externe
+    external: true                   # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Speedtest Tracker est `speedtest-tracker_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Patientez puis tapez `https://speedtest.mondomaine.fr` dans votre navigateur, vous devriez être redirigé vers speedtest-tracker. Vous pouvez vérifier le statut du service via le dashboard (depuis votre réseau local, http://ipdevotreserveur:81).
+
+::alert{type="success"}
+✨ Vous pouvez protéger cette app avec Authentik en ouvrant `speedtest.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/4.monitoring/4.beszel.md

@@ -0,0 +1,256 @@
+---
+navigation: true
+title: Beszel
+description: Installer Beszel pour surveiller CPU, RAM, disques et réseau de vos serveurs — y compris à distance — via un tableau de bord web léger.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Beszel
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer Beszel
+- Monitorer le serveur local
+- Monitorer un serveur distant
+- Exposer Beszel avec Swag
+::
+
+[Beszel](https://beszel.dev/) est un conteneur permettant d'accéder aux informations du hardware de vos serveurs en temps réel et de les historiser. Activité CPU, usages des disques, températures, RAM, vous ne raterez rien de l'état de votre serveur. Beszel permet également de paramétrer des notifications et alertes en cas de dépassement de limites que vous avez choisies.
+
+Beszel dispose d'un hub avec une webui et d'un agent qui permet de collecter les données depuis votre serveur ou sur un serveur distant.
+
+![Beszel](/img/serveex/beszel.png)
+
+## Installation
+---
+
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── beszel
+        ├── data
+        └── socket
+
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `beszel` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  beszel:
+    image: henrygd/beszel:latest
+    container_name: beszel
+    restart: unless-stopped
+    ports:
+      - ${PORT}:8090
+    volumes:
+      - ./data:/beszel_data
+      - ./socket:/beszel_socket
+
+  beszel-agent:
+    image: henrygd/beszel-agent:latest
+    container_name: beszel-agent
+    restart: unless-stopped
+    network_mode: host
+    volumes:
+      - ./socket:/beszel_socket
+      - /var/run/docker.sock:/var/run/docker.sock:ro
+    environment:
+      LISTEN: /beszel_socket/beszel.sock
+      # Do not remove quotes around the key
+      KEY: ${KEY}
+```
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      beszel:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Renseignez le `.env`, par exemple :
+
+```properties
+PORT=8090 # port de la webui
+KEY= # clé privée à récupérer dans Beszel lors que vous ajoutez un système
+```
+Pour la valeur `KEY`, il faudra lancer Beszel une première fois pour la saisir.
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:8090`. Et voilà, votre instance Beszel en webui est disponible !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+### Ajouter les informations du serveur local
+
+Maintenant que la webui est accessible, vous devez faire remonter les informations du serveur dedans. Pour cela, il vous suffit d'ajouter une machine dans la webui et de paraméter comme ceci :
+
+![Beszel add system](/img/serveex/beszel-add.png)
+
+Note la clé privée et validez. Renseignez la clé dans votre `.env` dans dockge, et redéployez la stack. Lorsque vous retournerez sur la webui, votre serveur apparaitra :
+
+![Beszel add system](/img/serveex/beszel-system.png)
+
+
+### Ajouter les informations d'un serveur distant
+
+Vous pouvez également monitorer un serveur distant. Pour cela vous avez juste à faire tourner l'agent sur le serveur distant. Pour cela, ajoutez une nouvelle machine dans Beszel et renseignez :
+
+- Le nom qui s'affichera dans Beszel pour votre serveur distant
+- L'adresse IP ou le nom de domaine de votre serveur distant
+- Le port d'écoute de votre serveur distant (dans notre exemple cela sera `45876`)
+
+Beszel vous proposera de copier directement le `compose.yaml` à déployer sur votre serveur distant, ou vous pouvez le configurer comme suit :
+
+```yaml
+---
+services:
+  beszel-agent:
+    image: henrygd/beszel-agent
+    container_name: beszel-agent
+    restart: unless-stopped
+    network_mode: host
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock:ro
+    environment:
+      LISTEN: ${PORT}
+      KEY: ${KEY}
+```
+
+Et dans le `.env` :
+
+```properties
+PORT=45876 # port de communication entre votre hub et l'agent à distance
+KEY= # clé privée à récupérer dans Beszel lors que vous ajoutez un système
+```
+Déployez la stack sur votre serveur distant. Les informations du serveur distant remontront au bout de quelques secondes dans votre webui.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer Beszel avec Swag
+---
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Beszel n'utilise pas d'authentification multifacteur. Exposer Beszel sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Vous aurez peut-etre envie d'y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Beszel via Swag.
+
+::alert{type="info"}
+📋 __Au préalable :__
+<br/><br/>
+Nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `beszel.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau de Beszel :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:            # Relie le conteneur au réseau custom 
+      # ...           
+      - beszel            # Nom du réseau déclaré dans la stack
+    
+networks:                 # Définit le réseau custom
+  # ...
+  beszel:                 # Nom du réseau déclaré dans la stack
+    name: beszel_default  # Nom véritable du réseau externe
+    external: true        # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de beszel est `beszel_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Dans les dossiers de Swag, créez le fichier `beszel.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/beszel.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name beszel.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app beszel;
+        set $upstream_port 8090;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé Beszel !
+
+::alert{type="success"}
+✨ Vous pouvez protéger cette app avec Authentik en ouvrant `beszel.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/4.monitoring/5.upsnap.md

@@ -0,0 +1,195 @@
+---
+navigation: true
+title: UpSnap
+description: Installer UpSnap pour allumer à distance des machines de votre réseau local via Wake-on-LAN, exposé avec SWAG.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# UpSnap
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer UpSnap
+- Exposer UpSnap avec Swag
+::
+
+[UpSnap](https://github.com/seriousm4x/UpSnap) est un conteneur permettant d'allumer, éteindre, ou mettre en veille vos machines à distance. Il utilise essentiellement le systeme de Wake-On-Lan (WoL) par le réseau et dispose d'autres fonctions avancées.
+
+![Beszel](/img/serveex/upsnap.webp)
+
+## Installation
+---
+
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── upsnap
+        └── data
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `upsnap` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  upsnap:
+    container_name: upsnap
+    image: ghcr.io/seriousm4x/upsnap:5
+    network_mode: host
+    restart: unless-stopped
+    volumes:
+      - /docker/upsnap/data:/app/pb_data
+    environment:
+      - TZ=Europe/Paris
+      - UPSNAP_SCAN_RANGE=${SCAN_RANGE}
+      - UPSNAP_SCAN_TIMEOUT=500ms
+      - UPSNAP_PING_PRIVILEGED=true
+    dns:
+      - ${DNS}
+    entrypoint: /bin/sh -c "./upsnap serve --http 0.0.0.0:8095"
+    healthcheck:
+      test: curl -fs "http://localhost:8095/api/health" || exit 1
+      interval: 10s
+```
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      upsnap:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Renseignez le `.env`, par exemple :
+
+```properties
+RANGE=192.168.1.0/24 # scan toutes les machines sur le réseau local ayant une adresse IP comprise entre 192.168.0.1 et 192.168.1.255
+DNS=192.168.1.1 # IP du dns à utiliser pour résoudre les noms de domaines, ici dans l'exemple c'est généralement l'IP du routeur
+```
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:8095`. Vous n'avez plus qu'à suivre les instructions pour créer votre compte !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer UpSnap avec Swag
+---
+
+::alert{type="warning"}
+:::list{type="warning"}
+- UpSnap n'utilise pas d'authentification multifacteur. Exposer UpSnap sur internet pourrait compromettre les machines auxquel il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Vous aurez peut-etre envie d'y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer UpSnap via Swag.
+
+::alert{type="info"}
+📋 __Au préalable :__
+<br/><br/>
+Nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `upsnap.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau de UpSnap :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:                       # Relie le conteneur au réseau custom 
+      # ...           
+      - upsnap                       # Nom du réseau déclaré dans la stack
+    
+networks:                            # Définit le réseau custom
+  # ...
+  upsnap:                 # Nom du réseau déclaré dans la stack
+    name: upsnap_default             # Nom véritable du réseau externe
+    external: true                   # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de upsnap est `upsnap_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Dans les dossiers de Swag, créez le fichier `upsnap.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/upsnap.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name upsnap.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app upsnap;
+        set $upstream_port 8095;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé UpSnap !
+
+::alert{type="success"}
+✨ Vous pouvez protéger cette app avec Authentik en ouvrant `upsnap.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/4.monitoring/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Monitoring
+icon: lucide:chart-no-axes-column

content/3.serveex/5.media/1.plex.md

@@ -0,0 +1,311 @@
+---
+navigation: true
+title: Plex
+description: Installer Plex Media Server avec Tautulli sur votre homelab pour streamer films et séries depuis n'importe où sur tous vos appareils.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Plex
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer Plex
+- Installer Tautulli
+- Accéder aux media depuis l'exterieur
+::
+
+[Plex](https://www.plex.tv/fr/) est une plateforme de streaming vidéo déployable chez vous, pour manager votre bibliothèque de films ou de série, et les lire en locale ou à distance. Plex dispose d'applications TV, Android, iOS, Window et Mac OS, permettant la lecture de vos bibliothèques, à la Netflix. 
+
+Avec le *plexpass*, vous pouvez également organsier et lire vos contenus audio, à la spotify, la différence étant que c'est bien votre contenu qui est hébergé et lu depuis chez vous.
+
+![picture](/img/serveex/plex.png)
+
+On installera également [Tautulli](https://docs.linuxserver.io/images/docker-tautulli/), un outil qui permet d'avoir des stats poussées sur Plex. On utilisera, comme dès qu'on le peut, les images de linuxserver.io.
+
+- [Plus d'info sur le conteneur Plex](https://docs.linuxserver.io/images/docker-plex)
+- [Plus d'info sur le conteneur Tautulli](https://docs.linuxserver.io/images/docker-tautulli/)
+
+::alert{type="info"}
+:::list{type="info"}
+- Vous serez amenés à creer un compte *Plex.tv*. Vous n'avez pas besoin d'exposer votre service Plex, il sera accessible directement par la plateforme. Votre serveur Plex sera gérable directement depuis votre compte.
+:::
+::
+
+## Installer Plex
+---
+Structure des dossiers :
+```sh
+root
+├── docker
+│   ├── plex      
+│   │   ├── compose.yml
+│   │   ├── .env
+│   │   ├── config
+│   │   └── transcode
+│   └── tautulli
+│       └── config
+└── media
+    ├── tvseries
+    ├── movies
+    └── library
+```
+
+Créez les dossiers `movies`, `tvseries` et `library` dans /media :
+
+```sh
+mkdir -p /media/movies /media/library /media/tvseries
+```
+
+Ouvrez Dockge dans votre navigeateur, et cliquez sur `compose`.
+Nommez la stack `plex` et ajoutez la config suivante :
+
+```yaml
+---
+services:
+  linuxserver_plex:
+    image: ghcr.io/linuxserver/plex:amd64-latest
+    container_name: plex
+    network_mode: host
+    environment:
+      - PUID=${PUID}
+      - PGID=${GUID}
+      - TZ=Europe/Paris
+      - VERSION=docker
+    volumes:
+      - /docker/plex/config:/config
+      - /docker/plex/transcode:/transcode
+      - /media:/media
+    restart: unless-stopped
+    mem_limit: 4096m
+    mem_reservation: 2048m
+    devices:
+      - /dev/dri:/dev/dri
+  
+  tautulli:
+    image: lscr.io/linuxserver/tautulli:latest
+    container_name: tautulli
+    environment:
+      - PUID=${PUID}
+      - PGID=${GUID}
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/tautulli/config:/config
+    ports:
+      - 8181:8181
+    restart: unless-stopped
+```
+
+::alert{type="success"}
+✨ Ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      plex:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+          
+      tautulli:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Trouvez votre PUID et votre GUID en tapant la commande suivante :
+
+```sh
+id nomdutilisateur
+```
+Et renseignez le `.env` avec les infos que vous avez trouvées, par exemple :
+
+```properties
+PUID=1000
+GUID=1000
+```
+Déployez la stack.
+
+L'interface locale est disponible via `http://ipduserveur:32400/web/index.html`. L'interface de Tautulli est joignable via `http://ipduserveur:8181`.
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Vous devez impérativement être sur votre réseau local au moment du premier setup de Plex, sans quoi l'url vous renverra sur votre compte Plex sans detecter votre serveur. Un VPN ne vous sauvera pas. Si vous ne pouvez pas faire autrement, [vous pouvez gérer l'installation à distance via un tunnel SSH](https://support.plex.tv/articles/200288586-installation/#toc-2).
+:::
+::
+
+## Paramétrer Plex
+---
+Plex propose tout une gamme de film/série gratuitement. Après avoir créé votre compte, et pour ne pas polluer votre bibliothèque, je vous conseille de tout désactiver dans la section _Services en ligne_.
+
+Ensuite rendez-vous dans la section _Accès à distance_ et choisissez un port manuellement (ici cela sera `1234`). Il est préférable de ne pas garder le port d'origine.
+
+![picture](/img/serveex/plex-port.png)
+
+- Sur votre routeur, redirigez le port `TCP` source `1234` vers le port `32400`, vers l'IP de votre serveur via [les règles NAT](/generalites/reseau/nat).
+- Une fois fait, retournez dans Plex afin de vérifier que la connexion est bien opérationnelle
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu et autorisez le port `32400` de votre serveur.
+:::
+::
+
+- Si vous avez un abonnement PlexPass et un GPU ou iGPU, activez *l'accélération matérielle* dans la section _Transcodeur_.
+- Dans la section _Réglages/bibliothèque_, cochez _Analyser ma bibliothèque automatiquement_.
+- Dans la section _Gérer/bibliothèque_ modifiez ou ajouter les bibliothèque, et choisissez le répertoire `/media/movies` pour les films et `/media/tvseries` pour les séries.
+
+Et voilà, vous avez un Plex fonctionnel ! 
+
+Vous n'avez plus qu'a remplir les dossiers `/media/movies` et `/media/tvseries` sur votre serveur de vos média favoris. Vous pourrez alors télécharger l'application Plex sur vos appareils et lire vos média favoris, chez vous ou à distance !
+
+::alert{type="info"}
+:::list{type="info"}
+- Si pour stocker vos média vous utilisez un disque réseau (par exemple un stockage sur un NAS ou un disque dur externe branché ailleurs sur le réseau), veuillez consulter la section [montage samba](/generalites/reseau/samba) afin que Plex puisse y accéder.
+:::
+::
+
+## Exposer Tautulli avec Swag
+---
+Plex n'a pas besoin d'etre exposé, étant joignable directement depuis votre compte Plex sur plex.tv. 
+
+En  revanche, vous pouvez désirer exposer Tautulli, afin d'accéder aux stats même si vous n'est pas chez vous, depuis une simple url.
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que vous avez le sous-domaine `tautulli.mondomaine.fr` avec un `CNAME` qui pointe vers `mondomaine.fr` dans [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau de Tautulli :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:              # Relie le conteneur au réseau custom 
+      # ...           
+      - tautulli            # Nom du réseau déclaré dans la stack
+    
+networks:                   # Définit le réseau custom
+  # ...
+  tautulli:                 # Nom du réseau déclaré dans la stack
+    name: tautulli_default  # Nom véritable du réseau externe
+    external: true          # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Tautulli est `tautulli_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Copiez en renommant le fichier `tautulli.subdomain.conf.sample` en `tautulli.subdomain.conf` et éditez le :
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo cp /docker/swag/config/nginx/proxy-confs/tautulli.subdomain.conf.sample /docker/swag/config/nginx/proxy-confs/tautulli.subdomain.conf
+sudo vi /docker/swag/config/nginx/proxy-confs/tautulli.subdomain.conf
+```
+
+Et vérifiez que la configuration correspond bien à ceci, sinon éditez le fichier en appuyant sur `i`:
+
+```nginx
+## Version 2023/05/31
+# make sure that your tautulli container is named tautulli
+# make sure that your dns has a cname set for tautulli
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name tautulli.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app tautulli;
+        set $upstream_port 8181;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/tautulli)?/api {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app tautulli;
+        set $upstream_port 8181;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/tautulli)?/newsletter {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app tautulli;
+        set $upstream_port 8181;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/tautulli)?/image {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app tautulli;
+        set $upstream_port 8181;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+::alert{type="success"}
+✨ Vous pouvez protéger cette app avec Authentik en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tappant `:x`
+
+Patientez quelques minutes puis tapez dans votre navigateur `http://tautulli.mondomaine.fr`.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+Et voilà !

content/3.serveex/5.media/2.qbittorrent.md

@@ -0,0 +1,325 @@
+---
+navigation: true
+title: Qbittorrent
+description: Installer qBittorrent avec Gluetun et ProtonVPN pour télécharger des torrents de manière sécurisée derrière un VPN sur votre serveur auto-hébergé.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Qbittorrent
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer et configurer Qbittorrent
+- Etre relié au réseau bittorent en toute sécurité avec Gluetun et Proton VPN
+::
+
+![Picture](/img/serveex/qbit-vue.jpeg)
+
+Afin de télécharger vos media favoris en toute sécurité, nous allons monter un système à base de :
+
+- [Qbittorent](https://github.com/linuxserver/docker-qbittorrent) comme logiciel de téléchargement bittorent
+- [Proton VPN Plus](https://protonvpn.com/torrenting), VPN pour sécuriser vos échanges, auquel vous devez souscrire (il y a de nombreux codes promo) pour accéder au protocole Bittorent, mais vous pouvez également en choisir un autre, à condition qu'il propose le protocole bittorent.
+- [Gluetun](https://github.com/qdm12/gluetun)
+- [Qbittorrent port update](https://codeberg.org/TechnoSam/qbittorrent-gluetun-port-update) pour mettre automatiquement à jour le port de votre VPN (qui change régulièrement).
+- Et le mode [vuetorrent](https://github.com/gabe565/linuxserver-mod-vuetorrent) pour une interface moderne et intuitive.
+
+Nous monterons ici le système ci-dessous :
+
+![Picture](/img/serveex/qbit.svg)
+
+## Configuration
+---
+Structure des dossiers
+
+```sh
+root
+├── docker
+│   └── seedbox
+│       ├── qbittorrent
+│       │   └── config
+│       ├── gluetun
+│       ├── compose.yaml
+│       └── .env
+│       
+└── media #relié à plex et Qbittorrent
+    ├── downloads #vos téléchargements génériques, à selectionner dans les parametres
+    ├── movies #à selectionner dans l'interface pour télécharger vos films
+    └── tvseries #à selectionner dans l'interface pour télécharger vos séries
+```
+
+Si ce n'est pas déjà fait, créez le dossier `downloads` dans `/media` :
+
+```sh
+mkdir -P /media/downloads
+```
+
+Ouvrez Dockge, cliquez sur `compose` et nommez la stack `seedbox`. Collez la config ci-dessous : 
+
+```yaml
+---
+services:
+  qbit:
+    image: ghcr.io/linuxserver/qbittorrent:libtorrentv1
+    container_name: qbittorrent
+    restart: unless-stopped
+    network_mode: service:gluetun
+    mem_limit: 4g
+    environment:
+      - DOCKER_MODS=ghcr.io/gabe565/linuxserver-mod-vuetorrent|ghcr.io/t-anc/gsp-qbittorent-gluetun-sync-port-mod:main
+      - TZ=Europe/Paris
+      - PUID=${PUID}
+      - PGID=${GUID}
+      - WEBUI_PORT=${UI_PORT}
+      - GSP_GTN_API_KEY=${GSP_KEY}
+      - GSP_QBT_USERNAME=${ID}
+      - GSP_QBT_PASSWORD=${PW}
+    volumes:
+      - /docker/seedbox/qbittorrent/config:/config
+      - /media:/media
+    depends_on:
+      - gluetun
+
+  gluetun:
+    image: qmcgaw/gluetun:v3.41.3
+    container_name: gluetun
+    restart: unless-stopped
+    mem_limit: 4g
+    volumes:
+      - /docker/gluetun/config.toml:/gluetun/auth/config.toml:ro
+    devices:
+      - /dev/net/tun:/dev/net/tun
+    ports:
+      - ${UI_PORT}:5695 # Port de la web-ui
+      - 8000:8000 # Port de controle de Gluetun
+    cap_add:
+      - NET_ADMIN
+    environment:
+      - TZ=Europe/Paris
+      - VPN_SERVICE_PROVIDER=protonvpn
+      - VPN_PORT_FORWARDING=on
+      - VPN_PORT_FORWARDING_PROVIDER=protonvpn
+      - VPN_TYPE=wireguard
+      - WIREGUARD_PRIVATE_KEY=${PR_KEY}
+      - SERVER_COUNTRIES=France
+      - PORT_FORWARD_ONLY=on
+      
+```
+
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      qbittorrent:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+      gluetun:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Avant de renseigner le `.env` dans Dockge, nous allons configurer la mise à jour du port de téléchargement. En effet, Proton, et la plupart des VPN, changent régulièrement le port de téléchargement, et celui-ci doit etre communiqué à Qbitorrent. 
+
+Pour ce faire, nous avons ajouté le mod `ghcr.io/t-anc/gsp-qbittorent-gluetun-sync-port-mod` dans le conteneur. 
+
+Il faut à présent permettre au mod de récupérer l'information via Gluetun, qui n'accepte que les communications chiffrées via son API.
+
+A cet effet, ouvrez un terminal. Nous allons à présent générer une clé d'authentification :
+
+```sh
+sudo docker run --rm qmcgaw/gluetun genkey
+```
+
+Notez la clé. Puis créez le dossier `/docker/gluetun`
+
+```sh
+sudo mkdir /docker/gluetun
+```
+
+Et créez le fichier `config.toml`
+
+```sh
+sudo vi /docker/gluetun/config.toml
+```
+
+Entrez en modification en tapant `i` et éditez le comme suit en ajoutant la clée que vous avez générée :
+
+```toml
+[[roles]]
+name = "t-anc/GSP-Qbittorent-Gluetun-sync-port-mod"
+routes = ["GET /v1/portforward"]
+auth = "apikey"
+apikey = "votre_clée" # clée que vous avez générée précédemment
+```
+
+Appuyez sur `échap` et quittez en sauvegardant en tapant `:x`. Rendez-vous dans Dockge, et renseignez les variables dans `.env`:
+
+```properties
+PUID=
+GUID=
+UI_PORT=
+PR_KEY=
+GSP_KEY= # la clé que vous avez générée et renseignée dans config.toml
+ID=
+PW=
+```
+
+En détails :
+
+| Variable                    | Valeur                                                                                                                                            | Exemples                     |
+|-----------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------|
+| `PUID`{lang=properties}      | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell})                                         | `1000`                         |
+| `GUID`{lang=properties}   | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell})                                         | `1000`                         |
+| `UI_PORT`{lang=properties}     | Le port d'accès à la web ui, elle sera joignable via `http//ipduserveur:port`                                                                     | `5695`                         |
+| `PR_KEY`{lang=properties}      | La clée privée fournie par Proton                                                                                                                 | `buKsjNHLyzKMM1qYnzOy4s7SHfly` |
+| `GSP_KEY`{lang=properties}     | Clé que vous avez générée pour la mise à jour du port         | `MnBa47MeVmk7xiv`                |
+| `ID`{lang=properties}     | username que vous utilisez pour vous logger dans l'interface de Qbittorrent         | `user`                |
+| `PW`{lang=properties}     | mot de passe que vous utilisez pour vous logger dans l'interface de Qbittorrent         | `password`                |
+
+## Déploiement
+---
+Une fois fait, déployez le conteneur.
+
+
+::alert{type="warning"}
+:::list{type="warning"}
+- **Dans les logs de lancement, vous trouverez un mot de passe temporaire pour l'utilisateur `admin`**
+:::
+::
+
+Loggez vous sur `http://ipduserveur:5695` (ou le port que vous avez configuré). 
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+Changez votre nom d'utilisateur et votre mot de passe dans les paramètres "webui".
+
+Et voilà ! Dans les paramètres de Qbittorrent, dans "téléchargements" selectionnez `/media/downloads` comme chemin par défaut pour télécharger vos media.
+
+Lorsque vous lancez un téléchargement, n'oubliez pas de préciser le bon répertoire de téléchargement afin que Plex puisse synchroniser correctement sa bibliothèque (`/media/movies` et `/media/tvseries`). Vous pouvez aussi l'automatiser en créant une catégorie et un répertoire associé.
+
+## Exposer la webui
+---
+
+::alert{type="warning"}
+:::list{type="warning"}
+- Qbitorrent n'utilise pas d'authentification multifacteur. Exposer Qbitorrent sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+
+Afin de lancer des téléchargement hors de chez vous, sans VPN, vous pouvez exposer la webui de Qbittorrent. 
+
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que vous avez le sous-domaine `seedbox.mondomaine.fr` avec un `CNAME` qui pointe vers `mondomaine.fr` dans [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau de Gluetun :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:             # Relie le conteneur au réseau custom 
+      # ...           
+      - seedbox            # Nom du réseau déclaré dans la stack
+    
+networks:                  # Définit le réseau custom
+  # ...
+  seedbox:                 # Nom du réseau déclaré dans la stack
+    name: seedbox_default  # Nom véritable du réseau externe
+    external: true         # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de la seedbox est `seedbox_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+
+Puis nous allons créer et éditer le fichier `seedbox.subdomain.conf`.
+
+::alert{type="success"}
+✨__Astuce pour les allergiques au terminal :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/seedbox.subdomain.conf
+```
+
+Entrez en modification en appuyant sur `i` et copiez la configuration ci-dessous, en prenant soin de vérifier le port : 
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name seedbox.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app gluetun;
+        set $upstream_port 5555;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+::alert{type="success"}
+✨ Vous pouvez protéger cette app avec Authentik en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x`.
+
+Patientez quelques minutes puis tapez dans votre navigateur `https://seedbox.mondomaine.fr`, vous arriverez sur l'interface de Qbittorrent.
+
+Et voilà, vous avez un mediacenter pret à l'emploi !
+
+![Picture](/img/serveex/seed.svg)

content/3.serveex/5.media/3.servarr.md

@@ -0,0 +1,514 @@
+---
+navigation: true
+title: Automatisation
+description: Automatiser les téléchargements de médias avec la suite Servarr — Radarr, Sonarr, Bazarr, Prowlarr et Overseerr pour films et séries.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Servarr
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Automatiser les téléchargements de films et de séries avec Radarr, Sonarr, Bazarr, Prowlarr et Overseerr.
+::
+
+[Servarr](https://wiki.servarr.com/) est une collection d'applications développées dans le but d'automatiser le téléchargement, la mise à jour et la gestions des media. Ici nous allons porter notre attention sur les films et séries avec comme objectif :
+- Pouvoir choisir un film dans un catalogue via une interface web
+- N'avoir plus rien à faire à part en profiter quelques minutes plus tard sur Plex
+
+Simple.
+
+![arr](/img/serveex/arr.svg)
+
+Je vous propose de déployer la stack puis nous verrons par la suite la configuration de chacune des apps et leur fonctionnement.
+
+## Installer les apps
+---
+
+### Docker compose
+
+Structure des dossiers :
+
+```sh
+root
+├── docker
+│   ├── plex      
+│   │   ├── compose.yml
+│   │   ├── config
+│   │   └── transcode
+│   ├── tautulli
+│   │   └── config
+│   ├── sonarr
+│   │   └── config
+│   ├── radarr
+│   │   └── config
+│   ├── bazarr
+│   │   └── config
+│   ├── prowlarr
+│   │   └── config
+│   └── overseerr
+│       └── config
+└── media
+    ├── downloads
+    ├── tvseries
+    ├── movies
+    └── library
+```
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Respectez bien ce type de structure de fichier, notamment le dossier `media`. Ce dossier doit etre monté de la même manière dans les compose de _Qbittorrent_ (`/votre/chemin/media:/media`) et des _arr_. Sans cela, les _arr_ risquent de ne pas trouver le chemin fourni par Qbittorrent et de ne pas créer de _hardlinks_. Sans hardlink, les _arr_ copieront les films et cela doublera l'espace utilisé sur votre stockage.
+:::
+::
+
+Ouvrez dockge et votre stack `plex`. Modifiez le compose comme ceci :
+
+```yaml
+---
+services:
+  linuxserver_plex:
+    image: ghcr.io/linuxserver/plex:latest
+    container_name: plex
+    network_mode: host
+    environment:
+      - PUID=${PUID}
+      - PGID=${PGID}
+      - TZ=Europe/Paris
+      - VERSION=docker
+      - PLEX_CLAIM= #optional
+    volumes:
+      - /docker/plex/config:/config
+      - /docker/plex/transcode:/transcode #optional
+      - ${MEDIA_PATH}:/media
+    labels:
+      - com.centurylinklabs.watchtower.enable=true
+    restart: unless-stopped
+    mem_limit: 4096m
+    mem_reservation: 2048m
+    devices:
+      - /dev/dri:/dev/dri
+
+  tautulli:
+    image: lscr.io/linuxserver/tautulli:latest
+    container_name: tautulli
+    environment:
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/tautulli/config:/config
+    ports:
+      - 8181:8181
+    restart: unless-stopped
+  
+  sonarr:
+    image: lscr.io/linuxserver/sonarr:latest
+    container_name: sonarr
+    environment:
+      - PUID=${PUID}
+      - PGID=${PGID}
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/sonarr/config:/config
+      - ${MEDIA_PATH}:/media
+    ports:
+      - 8989:8989
+    restart: unless-stopped
+
+  radarr:
+    image: lscr.io/linuxserver/radarr:latest
+    container_name: radarr
+    environment:
+      - PUID=${PUID}
+      - PGID=${PGID}
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/radarr/config:/config
+      - ${MEDIA_PATH}:/media
+    ports:
+      - 7878:7878
+    restart: unless-stopped
+
+  prowlarr:
+    image: lscr.io/linuxserver/prowlarr:latest
+    container_name: prowlarr
+    environment:
+      - PUID=${PUID}
+      - PGID=${PGID}
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/prowlarr/data:/config
+    ports:
+      - 9696:9696
+    restart: unless-stopped
+
+  overseerr:
+    image: lscr.io/linuxserver/overseerr:latest
+    container_name: overseerr
+    dns:
+      - 1.1.1.1
+      - 8.8.8.8
+    environment:
+      - PUID=${PUID}
+      - PGID=${PGID}
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/overseerr/config:/config
+    ports:
+      - 5055:5055
+    restart: unless-stopped
+
+  bazarr:
+    image: lscr.io/linuxserver/bazarr:latest
+    container_name: bazarr
+    restart: unless-stopped
+    environment:
+      - PUID=1000
+      - PGID=1000
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/bazarr/config:/config
+      - ${MEDIA_PATH}:/media
+    ports:
+      - 6767:6767
+```
+
+::alert{type="success"}
+✨ Ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      plex:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+          
+      tautulli:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Renseignez le `.env` avec les variables ci-dessous
+
+```properties
+PUID=
+GUID=
+MEDIA_PATH=
+```
+
+| Variable                    | Valeur                                                                                                                                            | Exemples                     |
+|-----------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------|
+| `PUID`{lang=properties}      | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell})                                         | `1000`                         |
+| `GUID`{lang=properties}   | A renseigner avec les infos de votre user (trouvables via la commande `id nomdutilisateur`{lang=shell})                                         | `1000`                         |
+| `MEDIA_PATH`{lang=properties}     | le chemin vers votre dossier media, ici : `/media`. Attention, il doit correspondre aussi à celui qu'utilise Qbittorrent.                | `/media`                         |
+
+Déployez la stack.
+
+### Paramétrer Radarr
+---
+Radarr est une app qui permet de requêter à votre place vos sources de torrent et de définir quel type de release vous souhaitez télécharger en priorité. Radarr permet aussi de mettre à jour vos films si une meilleure version est disponible.
+
+Maintenant que vous avez déployé la stack, vous pouvez vous rendre sur `http://ipduserveur:7878`.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+Créez vous un compte, choisissez bien *forms login*.
+
+##### Ajouter un *root folder*
+
+- Dans le menu à gauche, cliquez sur *Settings > Media Management*.
+- Ajoutez un *root folder*, choisisez `/media/movies`
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Si vous avez déjà des films dans `movies` issus de Qbittorrent, ne les ajoutez pas dans Sonarr si ce dernier vous le propose. Radarr risque de les modifier ce qui entrainerait l'arrêt du seed par Qbittorrent.
+:::
+::
+
+##### Configurer les profils
+
+Dans le menu *Settings > Profiles*, vous trouverez les profils par défaut de Radarr. Comprendre que lorsque vous faites une requete, vous demandez un de ces profils. Ainsi, radarr va chercher en priorité le parametre le plus élevé, puis s'il ne trouve pas, il va passer à celui d'en dessous etc. Vous pouvez par exemple régler comme ceci pour le profile "any", en décochant tout sauf ce qui est sur l'image, et en les mettant dans le même ordre. Avec ce profil "any", Radarr va chercher en priorité du 4K REMUX (meilleure qualité), puis s'il ne trouve pas, il va passer au critère du dessous.
+
+![profiles_radarr](/img/serveex/radarr1.png)
+
+##### Ajouter Qbittorrent
+
+Dans *Settings > Downloads Clients* vous allez ajouter Qbittorrent. 
+
+- Renseignez le *Host* avec l'IP de votre serveur et précisez le port de la webui, si vous avez suivi mon tuto c'est le `5695`. 
+- Renseignez le *Username* et le *Password* de votre interface Qbittorrent.
+- Cliquez sur *test*.
+- Si tout est ok, cliquez sur *save*.
+
+
+##### Connecter à Plex
+
+Dans *Settings > Connect*, ajoutez une nouvelle connexion, choisissez *Plex Media Server*.
+- Dans *Host* mettez `plex` ou l'adresse IP de votre serveur.
+- Dans port mettez `32400`.
+- Cliquez sur le bouton bleu "authenticate with Plex.tv" et authentifiez vous avec votre compte Plex.
+- Appuyez sur le bouton *test*.
+- Si tout est ok, appuyez sur le bouton *save*.
+
+
+
+##### Récupérer la clé API pour Prowlarr et Overserr
+
+- Dans *Settings > General*, copiez la *API Key* et notez la précieusement.
+
+### Paramétrer Sonarr
+---
+Sonarr est une app qui permet de requêter à votre place vos sources de torrent et de définir quel type de release vous souhaitez télécharger en priorité. Radarr permet aussi de mettre à jour vos séries si une meilleure version est disponible.
+
+- Rendez-vous sur `http://ipduserveur:8989`.
+- Suivez exactement les mêmes étapes que pour Radarr, et en *root folder* mettez `/media/tvseries`.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+### Paramétrer Prowlarr
+---
+Prowlarr est un proxy qui permet de gérer vos sources de torrents et de les passer à Radarr et Sonarr.
+
+Rendez-vous sur `http://ipduserveur:9696` et créez vous un compte en choisissant bien *forms login*.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+
+##### Ajouter une source
+
+- Dans la section *Indexers*, ajoutez l'indexer de votre source de torrent.
+
+##### Ajouter Radarr et Sonarr
+
+Dans la section *Settings > Apps*, ajoutez Radarr et Sonarr avec les informations ci-dessous :
+- Prowlarr Server : `http://prowlarr:9696` (ou remplacez prowlarr par l'IP de votre serveur)
+- Sonarr / Radarr Server : `http://sonarr:8989` ou `http://radarr:7878`(ou remplacez sonarr/radarr par l'IP de votre serveur)
+- API Key, la clé que vous avez notée pour Radarr et celle de Sonarr.
+- Appuyez sur *Test*.
+- Si tout va bien, appuyez sur *Save*.
+
+
+### Paramétrer Bazarr
+---
+Bazarr est une app qui permet de chercher automatiquement les bons sous-titre dans les langues souhaitez pour tout les films et séries que Radarr et Sonarr ajoutent pour vous.
+
+Rendez-vous sur `http://ipduserveur:6767`.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+Rendez-vous dans *Settings > General* et créez un identifiant et un mot de passe en utilisant le *forms login*.
+
+#### Ajouter un profil de langage
+
+- Dans *Settings > Languages* cliquez sur le bouton rose *Add new profile* et nommez le.
+- Cliquez sur le bouton rose *Add Languages* et ajoutez les langues que vous souhaitez, par exemple *French* et *English*.
+- Sauvegardez et quittez.
+- En bas de l'ecran dans *Default Language For Newly Added Show*, cochez les deux cases et renseignez le profil que vous venez de créer.
+![Bazarr](/img/serveex/bazarr2.png)
+- Enregistrez avec le bouton tout en haut de l'écran.
+
+#### Ajouter des fournisseurs de sous-titre
+
+- Dans *Settings > Providers*, ajoutez vos fournisseurs favoris, comme par exemple :
+
+![Bazarr](/img/serveex/bazarr.png)
+
+- Enregistrez avec le bouton tout en haut de l'écran.
+
+#### Ajouter Radarr et Sonarr
+
+- Rendez-vous dans *Settings > Sonarr*
+- Dans *Adress*, mettez `sonarr` ou l'adresse IP du serveur.
+- Dans *Port* mettez `8989`.
+- Dans *API Key* mettez la clé API de Sonarr.
+- Cliquez sur *Test*.
+- Enregistrez avec le bouton tout en haut de l'écran.
+
+Faites de même avec Radarr.
+
+
+### Paramétrer Overseerr
+---
+
+[Overseerr](https://overseerr.dev/) est une application qui permet de naviguer dans un catalogue de film et de faire des requetes à Sonarr et à Radarr. Il suffit de naviguer dans les films ou séries, puis de cliquer sur *Demander*, et le film ou la série sera automatiquement téléchargée selon les paramètres de Radarr ou de Sonarr. Si le film ou la série n'est pas sortie, cela sera automatiquement téléchargé lorsque cela sera disponible. Ainsi, les épisodes d'une séerie arrivent automatiquement au fur et à mesure dans Plex sans aucune intervention manuelle.
+
+![Overseerr](/img/serveex/overseerr.webp)
+
+Rendez-vous sur `http://ipduserveur:5055` et authentifiez vous avec votre compte Plex.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+#### Ajouter Radarr et Sonarr
+
+Lorsque cela vous est demandé, ajoutez un serveur radarr :
+- Cochez *serveur par défaut*.
+- __Nom du serveur :__ Radarr
+- __Nom d'hôte ou adresse IP :__ `radarr` ou l'adresse IP de votre serveur
+- __Port :__ `7878`.
+- __Clé d'API :__ la clé API de Radarr.
+- Cliquez sur *Tester* en bas.
+
+Si tout va bien, continuez à renseigner les champs.
+- __Profil de qualité :__ celui que vous avez configuré (par exemple, `any`).
+- __Dossier racine :__ le dossier de plex. Dans nos exemples : `/media/movies`.
+- __Disponibilité minimale :__ `Annoncé`. Ainsi, si un film n'est pas sorti, vous pouvez le demander et il sera automatiquement récupéré à sa sortie.
+- Cochez les 3 cases du bas.
+- Sauvegardez et continuez.
+
+Puis faites de même avec Sonarr :
+- Cochez *serveur par défaut*.
+- __Nom du serveur :__ Radarr
+- __Nom d'hôte ou adresse IP :__ `sonarr` ou l'adresse IP de votre serveur
+- __Port :__ `8989`.
+- __Clé d'API :__ la clé API de Sonarr.
+- Cliquez sur *Tester* en bas.
+
+Si tout va bien, continuez à renseigner les champs.
+- __Profil de qualité :__ celui que vous avez configuré (par exemple, `any`).
+- __Dossier racine :__ le dossier de plex. Dans nos exemples : `/media/tvseries`.
+- __Profil de langue :__ `Deprecated`.
+- Cochez les 4 cases du bas.
+- Sauvegardez et continuez.
+
+Et voilà ! Vous n'avez plus qu'à faire une demande d'un film et d'une serie, puis de vérifier dans qbittorrent ou dans radarr/sonarr que tout va bien. Dans quelques minutes, votre media sera sur Plex !
+
+## Exposer Overseerr avec Swag
+---
+
+Il peut etre intéressant d'exposer Overseerr, si vous souhaitez pouvoir faire des requêtes depuis l'exterieur sans VPN, ou si vous avez partagé votre Bibliothèque Plex à des utilisateurs et que vous souhaitez qu'ils aient accès à Overseerr.
+
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que vous avez le sous-domaine `films.mondomaine.fr` avec un `CNAME` qui pointe vers `films.fr` dans [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+
+Rendez-vous dans dockge, et éditez le compose de SWAG en ajoutant le réseau d'overseer, qui est celui de Plex car dans la stack Plex :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:              # Relie le conteneur au réseau custom 
+      # ...           
+      - plex            # Nom du réseau déclaré dans la stack
+    
+networks:                   # Définit le réseau custom
+  # ...
+  plex:                 # Nom du réseau déclaré dans la stack
+    name: plex_default  # Nom véritable du réseau externe
+    external: true          # Précise que c'est un réseau à rechercher en externe
+```
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Tautulli est `plex_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant `http://ipduserveur:81`.
+:::
+::
+
+Créez le fichier `films.subdomain.conf` et éditez le :
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/films.subdomain.conf
+```
+
+Rentrez en édition en appuyant sur `i`:
+
+```nginx                                                                                                     
+## Version 2024/07/16
+# make sure that your overseerr container is named overseerr
+# make sure that your dns has a cname set for overseerr
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name films.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app overseerr;
+        set $upstream_port 5055;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/overseerr)?/api {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app overseerr;
+        set $upstream_port 5055;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tappant `:x`
+
+Patientez quelques minutes puis tapez dans votre navigateur `http://films.mondomaine.fr`.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+Et voilà, vous avez exposé Overseerr !

content/3.serveex/5.media/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Media & Seedbox
+icon: lucide:list-video

content/3.serveex/6.cloud/1.immich.md

@@ -0,0 +1,175 @@
+---
+navigation: true
+title: Immich
+description: Installer Immich, une alternative auto-hébergée à Google Photos et iCloud avec reconnaissance faciale, géolocalisation et synchronisation multi-appareils.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Immich
+
+::alert{type="info"}
+🎯 __Objectifs :__ installer [Immich](https://immich.app/docs/overview/introduction) pour gérer vos photos sur tout vos appareils.
+::
+
+[Immich](https://immich.app/docs/overview/introduction) est une solution de gestion de photos et de vidéos que vous pouvez installer directement sur votre serveur. Cette solution remplace les clouds type Google Photo ou iCloud. Elle dispose de nombreuse fonctionnalités comme la reconnaissance de visage ou la géolocalisation.
+
+![Picture](/img/serveex/immich.png)
+
+## Installation
+---
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── immich
+        ├── library
+        ├── compose.yaml
+        └── .env
+```
+
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `immich` puis copiez collez le contenu du dernier `docker-compose.yml` [publié ici](https://github.com/immich-app/immich/blob/main/docker/docker-compose.yml). 
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention__ : n'ajoutez pas le label de Watchtower à la stack d'Immich. Immich étant une solution en perpetuelle évolution, des mises à jour automatiques risqueraient de casser votre installation.
+:::
+::
+
+Configurer le `.env` en copiant collant le contenu de la dernière version [publiée ici](https://github.com/immich-app/immich/blob/main/docker/example.env) et suivez les commentaires indiqués dans le fichier.
+
+
+::alert{type="info"}
+:::list{type="info"}
+- Si vous avez un NAS ou un disque réseau partagé via [samba](/generalites/reseau/samba/) pour stocker vos données, remplacez la valeur de `UPLOAD_LOCATION`{lang=properties} par le chemin d'accès de votre dossier partagé.
+:::
+::
+
+::alert{type="success"}
+✨ __Astuce :__ si votre CPU/iGPU/GPU le supporte, Immich permet d'utiliser l'accélération matérielle pour lire les vidéos ou pour la reconnaissance d'images. Ces fonctionnalités peuvent tripler les performances d'Immich. Plus d'infos sur le [Transcoding](https://immich.app/docs/features/hardware-transcoding/) et sur le [Machine learning](https://immich.app/docs/features/ml-hardware-acceleration).
+::
+
+Déployez le conteneur.
+
+Et voilà, vous pouvez vous connecter et suivre les instructions sur `http://ipduserveur:2283`
+
+## Exposer Immich avec Swag
+---
+Tout l'intérêt d'une telle solution, c'est de pouvoir y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Immich via Swag.
+
+::alert{type="info"}
+📋 __Au préalable :__ 
+<br/><br/>
+Nous partons du principe que vous avez le sous-domaine `immich.mondomaine.fr` avec un `CNAME` qui pointe vers `mondomaine.fr` dans votre [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur via [les règles NAT](/generalites/reseau/nat).
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de immich :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:            # Relie le conteneur au réseau custom 
+      # ...           
+      - immich            # Nom du réseau déclaré dans la stack
+    
+networks:                 # Définit le réseau custom
+  # ...
+  immich:                 # Nom du réseau déclaré dans la stack
+    name: immich_default  # Nom véritable du réseau externe
+    external: true        # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de immich est `immich_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+
+Dans les dossiers de Swag, créez le fichier `immich.subdomain.conf`.
+
+::alert{type="success"}
+:::list{type="success"}
+- __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+:::
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/immich.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name immich.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app immich_server;
+        set $upstream_port 3001;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/immich)?/api {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app immich_server;
+        set $upstream_port 3001;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé Immich ! N'oubliez pas d'installer les applications [iOS](https://apps.apple.com/us/app/immich/id1613945652)/[Android](https://play.google.com/store/apps/details?id=app.alextran.immich) afin de synchroniser vos appareils.
+
+::alert{type="success"}
+✨ __Astuce :__ Vous pouvez protéger cette app avec Authentik de façon native en [suivant ces instructions](https://docs.goauthentik.io/integrations/services/immich/).
+::

content/3.serveex/6.cloud/2.nextcloud.md

@@ -0,0 +1,195 @@
+---
+navigation: true
+title: Nextcloud
+description: Installer Nextcloud pour auto-héberger vos fichiers, photos et agenda — une alternative respectueuse de la vie privée à Google Drive, OneDrive et iCloud.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Nextcloud
+
+::alert{type="info"}
+🎯 __Objectifs :__ installer [Nextcloud](https://nextcloud.com/) pour gérer vos photos sur tout vos appareils.
+::
+
+[Nextcloud](https://nextcloud.com/) est une solution qui vous permet d'accéder à vos données sur tout vos appareils, et de les synchroniser. Nexctloud dispose également de fonctionnalités de collaboration, de calendrier et bien d'autres. Cette solution remplace des solutions du type Google Drive, iCloud, ou encore OneDrive.
+
+![Picture](/img/serveex/nextcloud.png)
+
+## Installation
+---
+::alert{type="info"}
+:::list{type="info"}
+- Nous utiliserons l'image docker maintenue par [LinuxServer.io](https://docs.linuxserver.io/images/docker-nextcloud/)
+:::
+::
+
+Structure des fichiers
+
+```sh
+root
+└── docker
+    └── nextcloud
+        ├── config
+        ├── data
+        ├── compose.yaml
+        └── .env
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `nextcloud` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  nextcloud:
+    image: lscr.io/linuxserver/nextcloud:latest
+    container_name: nextcloud
+    environment:
+      - PUID=${PUID}
+      - PGID=${GUID}
+      - TZ=Etc/UTC
+    volumes:
+      - /docker/nextcloud/config:/config
+      - /docker/nextcloud/data:/data
+    ports:
+      - ${PORT}:443
+    restart: unless-stopped
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Si vous avez un NAS ou un disque réseau partagé via [samba](/generalites/reseau/samba) pour stocker vos données, remplacez `/docker/nextcloud/data` par le chemin d'accès de votre dossier partagé.
+:::
+::
+
+Trouvez votre `PUID` et votre `GUID` en tapant la commande suivante :
+
+```sh
+id nomdutilisateur
+```
+Et renseignez le `.env` avec le port souhaité, et les infos que vous avez trouvées, par exemple :
+
+```properties
+PUID=1000
+GUID=1000
+PORT=4545
+```
+
+Déployez la stack et rendez-vous sur `http://ipduserveur:4545` et suivez les instructions.
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer Nextcloud avec Swag
+---
+Tout l'intérêt d'une telle solution, c'est de pouvoir y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Nextcloud via Swag.
+
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que vous avez le sous-domaine `nextcloud.mondomaine.fr` avec un `CNAME` qui pointe vers `mondomaine.fr` dans votre [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur via [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de nextcloud :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:               # Relie le conteneur au réseau custom 
+      # ...           
+      - nextcloud            # Nom du réseau déclaré dans la stack
+    
+networks:                    # Définit le réseau custom
+  # ...
+  nextcloud:                    # Nom du réseau déclaré dans la stack
+    name: nextcloud_default  # Nom véritable du réseau externe
+    external: true           # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de nextcloud est `nextcloud_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les fichiers de nextcloud, éditez le fichier `config.php`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/nextcloud/config/www/nextcloud/config/config.php
+```
+
+Entrez en modification avec la touche `i` et copiez les informations suivantes __avant__ `);`.
+
+```js
+'trusted_proxies' => [gethostbyname('swag')],  'overwrite.cli.url' => 'https://nextcloud.example.com/',
+'overwritehost' => 'nextcloud.example.com',
+'overwriteprotocol' => 'https',
+```
+
+Ajoutez également votre nom de domaine dans la section `array` , cela devrait ressembler à ceci
+```js
+ array (
+   0 => '192.168.0.1:444', # Cette ligne est surement différente chez vous, ne la modifiez pas !
+   1 => 'nextcloud.mondomaine.fr', # Renseignez votre domaine
+  ),
+```
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Dans les dossiers de Swag, créez le fichier `nextcloud.subdomain.conf`.
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/nexctloud.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2024/04/25
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name nextcloud.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    location / {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app nextcloud;
+        set $upstream_port 443;
+        set $upstream_proto https;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+        # Hide proxy response headers from Nextcloud that conflict with ssl.conf
+        # Uncomment the Optional additional headers in SWAG's ssl.conf to pass Nextcloud's security scan
+        proxy_hide_header Referrer-Policy;
+        proxy_hide_header X-Content-Type-Options;
+        proxy_hide_header X-Frame-Options;
+        proxy_hide_header X-XSS-Protection;
+
+        # Disable proxy buffering
+        proxy_buffering off;
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé Nextcloud ! Et n'oubliez pas d'installer [les applications pour ordinateurs et mobiles](https://nextcloud.com/fr/install/).
+
+::alert{type="success"}
+✨ __Astuce :__ Vous pouvez protéger cette app avec Authentik de façon native en [suivant ces instructions](https://docs.goauthentik.io/integrations/services/nextcloud/).
+::

content/3.serveex/6.cloud/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Cloud Drive & Photos
+icon: lucide:cloud-upload

content/3.serveex/7.files/1.file-browser.md

@@ -0,0 +1,164 @@
+---
+navigation: true
+title: File Browser
+description: Installer File Browser pour parcourir et gérer les fichiers de votre serveur depuis une interface web, exposée de manière sécurisée avec SWAG.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# File Browser
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer File Browser
+- Exposer File Browser avec Swag
+::
+
+[File Browser](https://github.com/filebrowser/filebrowser) est une interface permettant d'accéder aux fichiers de votre serveur et de les éditer.
+
+![File Browser](/img/serveex/filebrowser.png)
+
+## Installation
+---
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `filebrowser` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  filebrowser:
+    container_name: filebrowser
+    volumes:
+     - /docker/filebrowser/config:/config/
+     - /chemin/vers/vos/dossiers:/vosdossiers #ajoutez ici les dossiers que vous voulez voir apparaitre dans filebrowser
+    ports:
+      - 8010:80
+    image: filebrowser/filebrowser:s6
+```
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      filebrowser:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:8010`. Et voilà, votre instance File Browser en webui est disponible !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer File Browser avec Swag
+---
+
+::alert{type="warning"}
+:::list{type="warning"}
+- File Browser n'utilise pas d'authentification multifacteur. Exposer File Browser sur internet pourrait compromettre les machines auxquelles il est relié. Ne le faite que si vous utilisez un systeme d'authentification multifacteur comme [Authentik](/serveex/securite/authentik/). Sinon, n'exposez pas avec SWAG et utilisez plutôt un VPN comme [Wireguard](/serveex/securite/wireguard).
+:::
+::
+
+Vous aurez peut-etre envie d'y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer IT Tools via Swag.
+
+::alert{type="info"}
+:::list{type="info"}
+- __Au préalable :__ nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `files.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de filebrowser :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:                 # Relie le conteneur au réseau custom 
+      # ...           
+      - filebrowser            # Nom du réseau déclaré dans la stack
+    
+networks:                      # Définit le réseau custom
+  # ...
+  filebrowser:                 # Nom du réseau déclaré dans la stack
+    name: filebrowser_default  # Nom véritable du réseau externe
+    external: true             # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de filebrowser est `filebrowser_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les dossiers de Swag, créez le fichier `files.subdomain.conf`.
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/files.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name files.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app filebrowser;
+        set $upstream_port 80;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé File Browser !
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez protéger cette app avec Authentik en ouvrant `files.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/7.files/2.pingvin.md

@@ -0,0 +1,214 @@
+---
+navigation: true
+title: Pingvin
+description: Installer Pingvin Share, une plateforme d'envoi de fichiers auto-hébergée pour partager des fichiers de façon sécurisée sans WeTransfer ni Google Drive.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Pingvin
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer Pingvin
+- Exposer Pingvin
+::
+
+[Pingvin](https://github.com/stonith404/pingvin-share) est un outil permettant de partager rapidement des fichiers, à la manière de WeTransfer. Ses nombreuses options de partage (mot de passe, durée d'expiration, personnalisation du lien...) en font l'outil idéal pour partager rapidement des fichiers. Pingvin permet également de créer des _demandes de dépot_, c'est à dire un lien partageable à envoyer à quelqu'un de votre choix pour qu'il puisse téléverser ses fichiers afin que vous puissiez les récupérer.
+
+![File Browser](/img/serveex/pingvin.png)
+
+## Installation
+---
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `pingvin` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  pingvin-share:
+    container_name: pingvin
+    image: stonith404/pingvin-share
+    restart: unless-stopped
+    ports:
+      - 3600:3000
+    volumes:
+      - /docker/pingvin/data:/opt/app/backend/data
+      - /docker/pingvin/data/img:/opt/app/frontend/public/img
+      - /docker/pingvin/uploads:/opt/app/backend/uploads # chemin du dossier dans lequel vous souhaitez stocker les fichiers uploadés dans pingvin. A changer selon vos préférences.
+    depends_on:
+      clamav:
+        condition: service_healthy
+    networks:
+      - swag
+
+  clamav: #antivirus pour les fichiers
+    restart: unless-stopped
+    image: clamav/clamav
+```
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Swag est `swag_default`.
+:::
+::
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      filebrowser:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+      
+      clamav:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:3600`. Et voilà, votre instance File Browser en webui est disponible !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer Immich avec Swag
+---
+Tout l'intérêt d'une telle solution, c'est de pouvoir y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Pingvin via Swag.
+
+::alert{type="info"}
+📋 __Au préalable :__ 
+<br/><br/>
+Nous partons du principe que vous avez le sous-domaine `pingvin.mondomaine.fr` avec un `CNAME` qui pointe vers `mondomaine.fr` dans votre [zone DNS](/generalites/reseau/dns). Et que bien sûr, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), le port `443` de votre box pointe bien sur le port `443` de votre serveur via [les règles NAT](/generalites/reseau/nat).
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de pingvin :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:             # Relie le conteneur au réseau custom 
+      # ...           
+      - pingvin            # Nom du réseau déclaré dans la stack
+    
+networks:                  # Définit le réseau custom
+  # ...
+  pingvin:                 # Nom du réseau déclaré dans la stack
+    name: pingvin_default  # Nom véritable du réseau externe
+    external: true         # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de pingvin est `pingvin_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les dossiers de Swag, créez le fichier `pingvin.subdomain.conf`.
+
+::alert{type="success"}
+:::list{type="success"}
+- __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+:::
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/pingvin.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name pingvin.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app pingvin;
+        set $upstream_port 3000;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+
+```
+
+Appuyez sur `Echap puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé Pingvin !
+
+## Sécuriser Pingvin avec Authentik
+
+Vous pouvez protéger cette app avec Authentik de façon native en suivant les instructions ci-dessous.
+
+1. Dans votre espace admin authentik, créez un fournisseur OAuth2/OpenID.
+
+2. Remplissez chaque section comme suit en remplaçant `mondomaine.fr` par votre domaine. Copiez quelque part le contenu des champs `ID du client` et `Secret du client`.
+
+![Picture](/img/serveex/pingvin-auth1.png)
+![Picture](/img/serveex/pingvin-auth2.png)
+![Picture](/img/serveex/pingvin-auth3.png)
+
+3. Enregistrez et créez une application `pingvin` comme suit.
+
+![Picture](/img/serveex/pingvin-auth4.png)
+
+4. Enregistrez et aller dans la liste de vos avant-postes. Ajoutez le fournisseur pingvin` à votre avant-poste.
+
+5. Quittez authentik, et allez dans l'interface d'administration de Pingvin.
+
+6. Dans la section _« Identifiant social »_ renseignez les champs suivant :
+- `URI de découverte OpenID` avec `https://pingvin.mondomaine.fr/application/o/pingvin/.well-known/openid-configuration` (n'oubliez pas de remplacer `mondomaine.fr` par votre domaine)
+- `Revendication du nom d’utilisateur OpenID` avec `preferred_username`
+- `ID du client OpenID` avec l'ID que vous avez copié en étape 2.
+- `Secret du client OpenID` avec le token que vous avez copié en étape 2.
+
+Et voilà, désormais lorsque vous vous connectez à Pingvin, un bouton "Open ID" sera disponible en dessous de la mire de connexion.
+
+
+
+
+

content/3.serveex/7.files/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Fichiers & partage
+icon: lucide:folder-tree

content/3.serveex/8.development/1.code-server.md

@@ -0,0 +1,224 @@
+---
+navigation: true
+title: Code-Serveur
+description: Installer code-server pour utiliser VS Code dans votre navigateur depuis votre homelab — montez des dossiers et exposez-le de manière sécurisée avec SWAG.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Code-Server
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer code-server
+- Monter des dossiers dans vscode
+- Exposer code-server avec Swag
+::
+
+[code-server](https://github.com/linuxserver/docker-code-server) est un conteneur permettant d'accéder à [vscode](https://code.visualstudio.com/) en web-ui dans un environnement linux. C'est littéralement vscode et vos projets directement dans votre poche, disponibles partout.
+
+![code-server](https://github.com/coder/code-server/raw/main/docs/assets/screenshot-2.png)
+
+## Installation
+---
+::alert{type="info"}
+:::list{type="info"}
+- Pour cette installation nous utiliserons [l'image maintenue par LinuxServer.io](https://docs.linuxserver.io/images/docker-code-server/).
+:::
+::
+
+Structure des dossiers
+
+```sh
+root
+├── docker
+│   └── code-server
+│       └── config
+└── #n'importe quel dossier à monter dans vscode
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `code-server` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  code-server:
+    image: lscr.io/linuxserver/code-server:latest
+    container_name: code-server
+    environment:
+      - PUID=${PUID}
+      - PGID=${GUID}
+      - TZ=Etc/UTC
+      - HASHED_PASSWORD=${PW}
+    volumes:
+      - /docker/code-server/config:/config
+    # ajoutez vos dossier à monter dans vscode
+    # - /chemin/vers/dossier:/dossier
+    ports:
+      - 8443:8443
+    restart: unless-stopped
+```
+
+::alert{type="success"}
+✨ Ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      code-server:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Choisissez un mot de passe et générez un hash
+
+```sh
+echo -n "votremotdepasse" | npx argon2-cli -e
+```
+
+Notez précieusement le résultat. Trouvez votre PUID et votre GUID en tapant la commande suivante :
+
+```sh
+id nomdutilisateur
+```
+
+Et renseignez le `.env` avec les infos que vous avez trouvées, par exemple :
+
+```properties
+PW='$argon2i$v=19$m=4096,t=3,p=1$wST5QhBgk2lu1ih4DMuxvg$LS1alrVdIWtvZHwnzCM1DUGg+5DTO3Dt1d5v9XtLws4'
+PUID=1000
+GUID=1000
+```
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Pensez à mettre un guillemet simple `'`au debut et à la fin du hash
+:::
+::
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:8443`. Et voilà, votre instance code-server en webui est disponible !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Monter des dossiers
+---
+Vous pouvez monter les dossiers à partager dans vscode en ajoutant les volumes concernés dans le compose.yaml (ou via dockge), et en redéployant le conteneur.
+
+```yaml
+services:
+  code-server:
+    #...
+    volumes:
+      - /chemin/vers/dossier:/dossier
+```
+Une fois dans vscode, vous pourrez accéder au dossier.
+
+## Exposer code-server avec Swag
+---
+Tout l'intérêt d'une telle solution, c'est de pouvoir y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer coder-server via Swag.
+
+::alert{type="info"}
+:::list{type="info"}
+- __Au préalable :__ Nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `code.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de code-server :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:           # Relie le conteneur au réseau custom 
+      # ...           
+      - code-server      # Nom du réseau déclaré dans la stack
+    
+networks:                # Définit le réseau custom
+  # ...
+  code-server:           # Nom du réseau déclaré dans la stack
+    name: code-serveur   # Nom véritable du réseau externe
+    external: true       # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de code-server est `code-server_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les dossiers de Swag, créez le fichier `code.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/code.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name code.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app code-server;
+        set $upstream_port 8443;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé code-server !
+
+::alert{type="success"}
+✨ __Astuce :__ Vous pouvez protéger cette app avec Authentik en ouvrant `code.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}.N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/8.development/2.gitea.md

@@ -0,0 +1,199 @@
+---
+navigation: true
+title: Gitea
+description: Installer Gitea, un service Git auto-hébergé léger pour gérer vos dépôts de code de façon privée sur votre propre serveur.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Gitea
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer Gitea
+- Exposer Gitea avec Swag
+::
+
+[Gitea](https://https://about.gitea.com/) est une plateforme DevOps, permettant de gérer des dépots, à la manière de GitHub mais chez vous en selfhost.
+
+![gitea](https://about.gitea.com/img/home-screenshot.png)
+
+## Installation
+---
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── gitea
+        └── data
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `gitea` puis copiez collez ceci :
+
+```yaml
+---
+networks:
+  gitea:
+    external: false
+services:
+  server:
+    image: gitea/gitea:1.22.0
+    container_name: gitea
+    environment:
+      - USER_UID=${UID}
+      - USER_GID=${GID}
+      - TZ=Europe/Paris
+    restart: unless-stopped
+    networks:
+      - gitea
+    volumes:
+      - ./data:/data
+    ports:
+      - 3333:3000
+      - 222:22
+```
+Et renseignez le `.env` avec les infos que vous avez trouvées, par exemple :
+
+```properties
+UID=1000
+GID=1000
+```
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:3333`. Et voilà, votre instance Gitea est disponible !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer Gitea avec Swag
+---
+Tout l'intérêt d'une telle solution, c'est de pouvoir y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Gitea via Swag.
+
+::alert{type="info"}
+:::list{type="info"}
+- __Au préalable :__ nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `gitea.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de gitea :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:           # Relie le conteneur au réseau custom 
+      # ...           
+      - gitea            # Nom du réseau déclaré dans la stack
+    
+networks:                # Définit le réseau custom
+  # ...
+  gitea:                 # Nom du réseau déclaré dans la stack
+    name: gitea_default  # Nom véritable du réseau externe
+    external: true       # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de gitea est `gitea_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les dossiers de Swag, créez le fichier `gitea.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/gitea.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name gitea.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+	      #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app gitea;
+        set $upstream_port 3000;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/gitea)?/info/lfs {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app gitea;
+        set $upstream_port 3000;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Ouvrez le fichier `app.ini` dans les fichiers du conteneur
+
+```sh
+sudo vi /docker/gitea/data/gitea/conf/app.ini
+```
+
+Entrez en modification avec la touche `i` et et modifiez la section serveur avec les infos de votre domaine
+
+```properties
+[server]
+DOMAIN = gitea.mondomaine.fr
+SSH_DOMAIN = gitea.mondomaine.fr
+ROOT_URL = https://gitea.mondomaine.fr/
+```
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Relancez le conteneur.
+
+Et voilà, vous avez exposé Gitea !
+
+::alert{type="success"}
+✨ __Astuce :__ Vous pouvez protéger cette app avec Authentik de façon native en [suivant ces instructions](https://docs.goauthentik.io/integrations/services/gitea/).
+::

content/3.serveex/8.development/3.it-tools.md

@@ -0,0 +1,168 @@
+---
+navigation: true
+title: IT-Tools
+description: Installer IT Tools, une collection auto-hébergée d'utilitaires pratiques pour développeurs — convertisseurs, encodeurs, formateurs et plus encore.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# IT Tools
+
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer IT-Tools
+- Exposer IT Tools avec Swag
+::
+
+[IT Tools](https://github.com/CorentinTh/it-tools) est un conteneur exposant une page web permettant d'accéder à un grand nombre d'outil de développement.
+
+![IT Tools](/img/serveex/it-tools.png)
+
+## Installation
+---
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `it-tools` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  it-tools:
+    container_name: it-tools
+    restart: unless-stopped
+    image: corentinth/it-tools:latest
+    ports:
+      - 3222:80
+```
+
+::alert{type="success"}
+✨ __Astuce :__ ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      it-tools:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+
+Déployez le conteneur et rendez-vous sur `http://ipduserveur:3222`. Et voilà, votre instance IT Tools en webui est disponible !
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer IT Tools avec Swag
+---
+Vous aurez peut-etre envie d'y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer IT Tools via Swag.
+
+::alert{type="info"}
+:::list{type="info"}
+- __Au préalable :__ nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `tools.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+:::
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de it-tools :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:              # Relie le conteneur au réseau custom 
+      # ...           
+      - it-tools            # Nom du réseau déclaré dans la stack
+    
+networks:                   # Définit le réseau custom
+  # ...
+  it-tools:                 # Nom du réseau déclaré dans la stack
+    name: it-tools_default  # Nom véritable du réseau externe
+    external: true          # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de it-tools est `it-tools_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de Swag est `swag_default`.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les dossiers de Swag, créez le fichier `tools.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/tools.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+## Version 2023/12/19
+
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name tools.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 0;
+
+    #if ($lan-ip = yes) { set $geo-whitelist yes; }
+    #if ($geo-whitelist = no) { return 404; }
+    if ($geo-blacklist = no) { return 404; }
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app it-tools;
+        set $upstream_port 80;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé it-tools !
+
+::alert{type="success"}
+✨ __Astuce :__ Vous pouvez protéger cette app avec Authentik en ouvrant `tools.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/8.development/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Développement
+icon: lucide:code-xml

content/3.serveex/9.apps/1.adguard.md

@@ -1,10 +1,20 @@
 ---
+navigation: true
 title: Adguard Home
 description: Installer AdGuard Home pour bloquer publicités et trackers à l'échelle du réseau avec DNS-over-HTTPS, gestion des clients et règles de filtrage personnalisées.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Adguard Home
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+::alert{type="info"}
+🎯 __Objectifs :__
+- Installer et déployer Adguard
+- Exposer Adguard
+- Sécuriser les requêtes avec SSL/TLS
+- Configurer les appareils clients
+::
 
 [AdGuard Home](https://github.com/AdguardTeam/AdGuardHome) est un serveur DNS anti-pub et anti-traçage qui fonctionne au niveau du système. Une fois configuré, il couvrira TOUS vos appareils domestiques et vous n'aurezbesoin d'aucun logiciel côté client pour cela.
 
@@ -12,8 +22,6 @@ Il fonctionne comme un serveur DNS qui redirige les domaines de suivi vers un «
 
 En pratique, une fois en place, il vous faudra juste configurer les serveurs DNS de vos appareils, pour que ces derniers l'utilisent.
 
-![adguard](/img/serveex/adguard.png)
-
 **Rappel sur le fonctionnement d'un DNS :**
 
 Lorsque vous naviguez sur un site, ou une application, des requêtes sont émises vers un ou des domaines afin d'afficher le contenu de votre page. Les publicités notamment. Votre appareil ne connait pas les adresses IP de ces serveurs à joindre. Pour les connaitre, il va contacter un _serveur de nom_ (Domain Name Server) qui lui va lui répondre avec l'adresse IP la plus à jour pour le domaine de la requête. 
@@ -28,140 +36,126 @@ Adguard lui, va s'intercaler entre le serveur de nom et votre appareil. Si vous
 C'est ainsi que les pubs et domaines malveillants sont bloqués : leurs domaines sont présents dans la blocklist, le reste de la page lui charge correctement.
 
 ![Picture](/img/serveex/adguard.svg)
-
 ## Installation
+---
+Structure des dossiers : 
 
-::file-tree
----
-tree:
-  /:
-    - srv:
-      - docker:
-        - adguardhome:
-          - confdir/
-          - workdir/
-          - compose.yaml
-          - .env
----
+```sh
+root
+└── docker
+    └── adguard
+        ├── confdir
+        ├── workdir
+        ├── compose.yaml
+        └── .env
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Nous monterons aussi le dossier `/docker/swag/config/etc/letsencrypt` afin d'avoir accès au certificat SSL de Swag.
+:::
 ::
 
-::note
+Ouvrez Dockge, et cliquez sur `compose`
 
-Nous monterons également le dossier `/srv/docker/swag/config/etc/letsencrypt` pour accéder au certificat SSL de Swag.
-::
+Nommez la stack `adguardhome` et copiez la configuration ci-dessous
 
-::steps{level="3"}
-### Déployer la stack
-
-Ouvrez Dockge et cliquez sur `compose`
-
-Nommez la stack `adguardhome` et collez la configuration ci-dessous :
-
-```yaml [compose.yaml]
+```yaml
 ---
 services:
+  
   adguardhome:
     container_name: adguard
-    image: adguard/adguardhome:latest
+    image: adguard/adguardhome
     restart: unless-stopped
     ports:
       - 53:53/udp
-      - 53:53/tcp
       - 8080:80/tcp
       - 4443:443/tcp
       - 853:853/tcp
       - 3000:3000/tcp
     volumes:
-      - /srv/docker/adguardhome/confdir:/opt/adguardhome/conf
-      - /srv/docker/adguardhome/workdir:/opt/adguardhome/work
-      - /srv/docker/swag/config/etc/letsencrypt:/swag-ssl:ro
+      - /docker/adguardhome/confdir:/opt/adguardhome/conf
+      - /docker/adguardhome/workdir:/opt/adguardhome/work
+      - /docker/swag/config/etc/letsencrypt:/swag-ssl:ro
+
 ```
 
-::tip{icon=""}
-✨ __Astuce :__ ajoutez le label watchtower à chaque conteneur pour automatiser les mises à jour
 
-```yaml [compose.yaml]
----
+
+::alert{type="success"}
+✨ __Astuce :__ Ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
     services:
       adguardhome:
         #...
         labels:
           - com.centurylinklabs.watchtower.enable=true
-```
 ::
 
 Déployez la stack.
 
-Allez sur `http://ipdevotreserveur:3000` et suivez les instructions de configuration.
+Rendez-vous sur `http//ipduserveur:3000` et suivez les instructions
 
-::warning
+Et voilà, vous avez déployé Adguard !
 
-L'assistant de configuration vous demande de choisir un port pour l'interface d'administration. Gardez `3000` : la configuration SWAG plus bas suppose que l'interface reste sur ce port, et le changer ici ferait échouer l'exposition d'AdGuard avec SWAG (erreur 502).
-::
-
-### Terminé !
-::
-
-C'est tout ! Adguard est déployé.
-
-## Exposer AdGuard avec SWAG
-Pour rendre AdGuard utilisable en dehors de votre réseau domestique, vous devez l'exposer.
-
-::note{icon=""}
-
-📋 __Prérequis :__ nous partons du principe que vous avez créé un sous-domaine du type `adguard.mondomaine.fr` dans votre [zone DNS](/general/networking/dns) avec un `CNAME` pointant vers `mondomaine.fr`, et que vous avez déjà redirigé le port `443` de votre box vers le port `443` de votre serveur dans vos [règles NAT](/general/networking/nat). Redirigez également les ports `53` et `853` vers votre serveur. Ces ports servent à router les requêtes DNS.
-::
-
-::warning
-
-N'utilisez pas les tunnels Cloudflare pour exposer AdGuard, et assurez-vous que tout proxy est désactivé.
-::
-
-::steps{level="3"}
-### Ajouter le réseau d'AdGuard à SWAG
-
-Dans Dockge, allez sur la stack SWAG et modifiez le fichier compose pour y ajouter le réseau d'AdGuard :
-
-```yaml [compose.yaml]
+## Exposer Adguard avec Swag
 ---
+Pour être utilisable hors de chez vous, vous devez exposer Adguard
+
+::alert{type="info"}
+:::list{type="info"}
+- __Au préalable :__ nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `adguard.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat). Redirigez également le port `53` et le port `853` vers votre serveur. Ces ports serviront à router les requêtes DNS.
+:::
+::
+
+::alert{type="warning"}
+:::list{type="warning"}
+- N'utilisez pas les tunnels cloudflare pour exposer Adguard, et désactivez tout proxy.
+:::
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau d'adguard :
+
+```yaml
 services:
   swag:
      container_name: # ...
       # ... 
-    networks:             # Rattache le conteneur au réseau personnalisé 
+     networks:             # Relie le conteneur au réseau custom 
       # ...           
       - adguard            # Nom du réseau déclaré dans la stack
     
-networks:                  # Définit le réseau personnalisé
+networks:                  # Définit le réseau custom
   # ...
   adguard:                 # Nom du réseau déclaré dans la stack
-    name: adguard_default  # Nom réel du réseau externe
-    external: true         # Précise qu'il s'agit d'un réseau externe
+    name: adguard_default  # Nom véritable du réseau externe
+    external: true         # Précise que c'est un réseau à rechercher en externe
 ```
 
-::note
-
-Nous partons ici du principe que le réseau d'AdGuard s'appelle `adguard_default`. Vous pouvez vérifier que la connexion fonctionne en visitant le tableau de bord de SWAG sur http://ipdevotreserveur:81.
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau d'adguard est `adguard_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
 ::
 
-Redémarrez la stack en cliquant sur « Deploy » et attendez que SWAG soit pleinement opérationnel.
-
-### Créer le fichier subdomain.conf
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
     
 Créez et ouvrez le fichier `adguard.subdomain.conf`
 
-::tip{icon="" to="/serveex/files/file-browser-quantum"}
+::alert{type="success"}
 ✨ __Astuce pour les allergiques au terminal :__
-vous pouvez utiliser **File Browser Quantum** pour naviguer et modifier vos fichiers plutôt que des commandes dans le terminal.
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
 ::
 
-```bash [Terminal]
-sudo nano /srv/docker/swag/config/nginx/proxy-confs/adguard.subdomain.conf
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/adguard.subdomain.conf
 ```
 
-Collez la configuration ci-dessous :
+Editez le fichier en appuyant sur `i` puis copiez la configuration ci-dessous :
 
-```nginx [adguard.subdomain.conf]
+```nginx
 ## Version 2023/05/31
 # make sure that your adguard container is named adguard
 # make sure that your dns has a cname set for adguard
@@ -234,128 +228,24 @@ server {
 
     }
 }
+
 ```
 
-### Terminé !
-::
-
-## Protéger AdGuard avec TinyAuth
-Ajoutez la vérification forward-auth de [TinyAuth](/serveex/security/tinyauth) directement dans `adguard.subdomain.conf`, de la même façon que dans [le tutoriel TinyAuth](/serveex/security/tinyauth#protecting-an-app-via-reverse-proxy). Le `location /dns-query` est laissé en dehors de la vérification `auth_request`, puisque les clients DNS-over-HTTPS ne peuvent pas faire de connexion interactive :
-
-```nginx [adguard.subdomain.conf]{28-40,43-44,69-70}
-## Version 2023/05/31
-# make sure that your adguard container is named adguard
-# make sure that your dns has a cname set for adguard
-
-server {
-    listen 443 ssl;
-    listen [::]:443 ssl;
-
-    server_name adguard.*;
-
-    include /config/nginx/ssl.conf;
-
-    client_max_body_size 0;
-
-    #if ($lan-ip = yes) { set $geo-whitelist yes; }
-    #if ($geo-whitelist = no) { return 404; }
-    if ($geo-blacklist = no) { return 404; }
-
-    # enable for ldap auth (requires ldap-location.conf in the location block)
-    #include /config/nginx/ldap-server.conf;
-
-    # enable for Authelia (requires authelia-location.conf in the location block)
-    #include /config/nginx/authelia-server.conf;
-
-    # enable for Authentik (requires authentik-location.conf in the location block)
-    #include /config/nginx/authentik-server.conf;
-
-    location /tinyauth {
-        internal;
-        proxy_pass http://tinyauth:3000/api/auth/nginx;
-        proxy_pass_request_body off;
-        proxy_set_header Content-Length "";
-        proxy_set_header X-Forwarded-Proto $scheme;
-        proxy_set_header X-Forwarded-Host $http_host;
-        proxy_set_header X-Forwarded-Uri $request_uri;
-    }
-
-    location @tinyauth_login {
-        return 302 https://tinyauth.mondomaine.fr/login?redirect_uri=$scheme://$http_host$request_uri;
-    }
-
-    location / {
-        auth_request /tinyauth;
-        error_page 401 = @tinyauth_login;
-
-        # enable the next two lines for http auth
-        #auth_basic "Restricted";
-        #auth_basic_user_file /config/nginx/.htpasswd;
-
-        # enable for ldap auth (requires ldap-server.conf in the server block)
-        #include /config/nginx/ldap-location.conf;
-
-        # enable for Authelia (requires authelia-server.conf in the server block)
-        #include /config/nginx/authelia-location.conf;
-
-        # enable for Authentik (requires authentik-server.conf in the server block)
-        #include /config/nginx/authentik-location.conf;
-
-        include /config/nginx/proxy.conf;
-        include /config/nginx/resolver.conf;
-        set $upstream_app adguard;
-        set $upstream_port 3000;
-        set $upstream_proto http;
-        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
-
-    }
-
-    location /control {
-        auth_request /tinyauth;
-        error_page 401 = @tinyauth_login;
-
-        include /config/nginx/proxy.conf;
-        include /config/nginx/resolver.conf;
-        set $upstream_app adguard;
-        set $upstream_port 3000;
-        set $upstream_proto http;
-        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
-
-    }
-
-    location /dns-query {
-        # to properly use this please set `allow_unencrypted_doh: true` and `force_https: false` in adguard
-        # see https://github.com/AdguardTeam/AdGuardHome/wiki/Configuration#configuration-file
-        include /config/nginx/proxy.conf;
-        include /config/nginx/resolver.conf;
-        set $upstream_app adguard;
-        set $upstream_port 3000;
-        set $upstream_proto http;
-        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
-
-    }
-}
-```
-
-::note{to="/serveex/security/tinyauth#exposing-tinyauth-with-swag"}
-
-Le bloc `location /tinyauth` s'exécute dans le conteneur de SWAG lui-même, SWAG doit donc être sur le réseau Docker de TinyAuth pour le joindre par son nom (`tinyauth` ici). Cela devrait déjà être en place depuis **l'exposition de TinyAuth**. Si vous rencontrez une erreur, revérifiez que le fichier compose de SWAG a toujours ce réseau rattaché.
-::
-
-::tip{icon=""}
+::alert{type="success"}
 ✨ __Astuce :__ 
 <br/><br/>
-Vous pouvez protéger cette app avec Authentik en ouvrant `adguard.subdomain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. n'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/advanced/authentik#protéger-une-app-par-reverse-proxy). Il vous faudra exclure l'url `https://adguard.mondomaine.fr/dns-query` de l'authentification :
+Vous pouvez protéger cette app avec Authentik en ouvrant `adguard.subdomain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. n'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik/#protéger-une-app-par-reverse-proxy). Il vous faudra exclure l'url `https://adguard.mondomaine.fr/dns-query` de l'authentification :
 
 - Editez le fournisseur d'Adguard
 - Dans *paramètres avancés du protocole > chemins authentifiés*, saisissez `^/dns-query`
 ::
 
-Enregistrez avec :kbd{value="Ctrl+O"} puis :kbd{value="Entrée"}, puis quittez avec :kbd{value="Ctrl+X"}.
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x`
 
 Et voilà, vous exposez Adguard à présent !
 
 ## Configurer le chiffrement SSL/TLS
+---
 Le chiffrement est essentiel si vous souhaitez garder privées les requêtes que vous faites vers adguard. Chiffrer ces requêtes c'est vous assurez que personne, meme votre FAI ne connaissent votre historique. C'est aussi vous assurer que personne d'autre que votre serveur vous répond.
 
 Afin de configurer le chiffrement :
@@ -374,6 +264,7 @@ Afin de configurer le chiffrement :
 Et voilà ! Vous avez protégé vos futures requêtes DNS !
 
 ## Configurer les appareils
+---
 Pour configurer vos appareils, vous avez plusieurs choix (que vous pouvez cumuler).
 ### Sécuriser le réseau local
 Vous pouvez sécuriser votre réseau local avec adguard en configurant votre box pour que chaque requête DNS soit dirigée par défaut vers adguard plutot que les services de votre FAI. Attention, votre box doit pouvoir permettre le changement de DNS (Orange ne le permet pas). 
@@ -385,9 +276,10 @@ Généralement cette option est dans les paramètres _DHCP_ de votre box. Pensez
 
 En effet, sans cela, si votre serveur tombe, vos appareils n'arriveraient plus à se connecter à internet.
 
-::note
-
-Des appareils peuvent avoir un autre DNS paramétré et ne pas utiliser ceux de la box.
+::alert{type="info"}
+:::list{type="info"}
+- Des appareils peuvent avoir un autre DNS paramétré et ne pas utiliser ceux de la box.
+:::
 ::
 
 ### Forcer un navigateur à utiliser Adguard
@@ -410,6 +302,8 @@ Dans windows, vous devez paramétrer Adguard pour chaque carte réseau que vous
 
 Tous les programmes de votre machine utilisant cette carte réseau seront filtrés par Adguard.
 
+
 ## Ajouter des filtres
+---
 
 - Allez dans les paramètres et changez les filtres.

content/3.serveex/9.apps/2.vaultwarden.md

@@ -0,0 +1,249 @@
+---
+navigation: true
+title: Vaultwarden
+description: Installer Vaultwarden, un gestionnaire de mots de passe auto-hébergé compatible Bitwarden pour remplacer les gestionnaires Google ou Apple sur tous vos appareils.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Vaultwarden
+
+::alert{type="info"}
+🎯 __Objectifs :__ Installer [Vaultwarden](https://github.com/dani-garcia/vaultwarden) pour gérer vos mot de passe sur tout vos appareils (remplace la gestion de mot de passe Google ou Apple).
+::
+
+![Vaultwarden](/img/serveex/vaultwarden.png)
+
+[Vaultwarden](https://github.com/dani-garcia/vaultwarden) est une solution de gestion de vos mot de passe (génération, saisie semi-automatique...) que vous pouvez installer directement sur votre serveur. Cette solution remplace les gestionnaires comme Google, Apple ou Keepass. Cette solution permet de synchroniser tout vos mots de passe sur vos différentes machines, avec un chiffrement de bout en bout.
+
+Vaultwarden est un fork de la solution [Bitwarden](https://bitwarden.com/fr-fr/help/).
+
+## Installation
+---
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── vaultwarden
+        ├── data
+        ├── compose.yaml
+        └── .env
+```
+
+Ouvrez Dockge, cliquez sur `compose`, appelez la stack `vaultwarden` puis copiez collez ceci :
+
+```yaml
+---
+services:
+  vaultwarden:
+    container_name: vaultwarden
+    image: vaultwarden/server:latest
+    restart: unless-stopped
+    env_file:
+      - .env
+    volumes:
+      - ./data/:/data/
+    ports:
+      - 3050:80
+    environment:
+      - DOMAIN=${URL}
+      - LOGIN_RATELIMIT_MAX_BURST=10
+      - LOGIN_RATELIMIT_SECONDS=60
+      - ADMIN_RATELIMIT_MAX_BURST=10
+      - ADMIN_RATELIMIT_SECONDS=60
+      - ADMIN_TOKEN=${TOKEN}
+      - SENDS_ALLOWED=true
+      - EMERGENCY_ACCESS_ALLOWED=true
+      - WEB_VAULT_ENABLED=true
+      - SIGNUPS_ALLOWED=false
+      - SIGNUPS_VERIFY=true
+      - SIGNUPS_VERIFY_RESEND_TIME=3600
+      - SIGNUPS_VERIFY_RESEND_LIMIT=5
+
+```
+
+::alert{type="success"}
+✨ __Astuce :__ Ajoutez le label de watchtower dans chaque conteneur afin d'automatiser les mises à jour
+
+    ```yaml
+    services:
+      vaultwarden:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Nous allons maintenant générer un hash de mot de passe, qu'il faudra renseigner dans la variable `TOKEN` du `.env`
+
+```sh
+echo -n 'votremotdepasse' | argon2 "$(openssl rand -base64 32)" -e -id -k 65540 -t 3 -p 4
+```
+
+Copiez le résultat précieusement et gardez en tête le mot de passe que vous avez choisi.
+
+Dans le `.env`, renseignez les variables suivantes :
+
+```properties
+URL=
+TOKEN=
+```
+
+| Variable                | Valeur                                                  | Exemple                    |
+|-------------------------|---------------------------------------------------------|----------------------------|
+| `URL`{lang=properties}   | L'url de votre serveur vaultwarden                      | `https://vault.domaine.fr` |
+| `TOKEN`{lang=properties} | Le token que vous avez précédemment copié précieusement | `'$argon2id$v=19$m=65540,t=3,p=4$bXBGME` |
+
+Puis déployez le conteneur.
+
+Depuis quelques temps, Vaultwarden ne permet pas d'etre accéder sans certificat SSL, ce qui empeche d'y accéder via son IP local. Nous y accèderons donc après l'avoir exposé avec SWAG, qui ajoute lui même un certificat SSL.
+
+
+::alert{type="danger"}
+:::list{type="danger"}
+- __En cas d'échec :__ vérifiez les règles de votre pare-feu.
+:::
+::
+
+## Exposer Vaultwarden avec SWAG
+---
+Tout l'intérêt d'une telle solution, c'est de pouvoir y accéder à distance et sur tout vos appareils. Pour cela, nous allons exposer Vaultwarden via [SWAG](/serveex/coeur/swag).
+
+::alert{type="info"}
+✨ __Au préalable :__ nous partons du principe que vous avez créé dans votre [zone DNS](/generalites/reseau/dns) un sous domaine du type `vault.mondomaine.fr` avec pour `CNAME` `mondomaine.fr` et, [à moins que vous utilisiez Cloudflare Zero Trust](/serveex/securite/cloudflare), que que vous avez déjà redirigé le port `443` de votre box vers le `443` de votre serveur dans [les règles NAT](/generalites/reseau/nat).
+::
+
+Dans Dockge, rendez-vous dans la stack de SWAG et éditez le compose en ajoutant le réseau de vaultwarden :
+
+```yaml
+services:
+  swag:
+     container_name: # ...
+      # ... 
+     networks:             # Relie le conteneur au réseau custom 
+      # ...           
+      - vaultwarden            # Nom du réseau déclaré dans la stack
+    
+networks:                  # Définit le réseau custom
+  # ...
+  vaultwarden:                 # Nom du réseau déclaré dans la stack
+    name: vaultwarden_default  # Nom véritable du réseau externe
+    external: true         # Précise que c'est un réseau à rechercher en externe
+```
+
+::alert{type="info"}
+:::list{type="info"}
+- Ici nous partons du principe que le nom du réseau de vaultwarden est `vaultwarden_default`. Vous pouvez vérifier que la connexion est opérationnelle en visitant le dashboard de SWAG en tapant http://ipduserveur:81.
+:::
+::
+
+Relancez la stack en cliquant sur "déployer" et patientez le temps que SWAG soit complètement opérationnel.
+
+Dans les dossiers de Swag, créez le fichier `vault.subdomain.conf`.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo vi /docker/swag/config/nginx/proxy-confs/vault.subdomain.conf
+```
+Entrez en modification avec la touche `i` et collez la configuration ci-dessous :
+
+```nginx
+server {
+    listen 443 ssl;
+    listen [::]:443 ssl;
+
+    server_name vault.*;
+
+    include /config/nginx/ssl.conf;
+
+    client_max_body_size 128M;
+
+    # enable for ldap auth (requires ldap-location.conf in the location block)
+    #include /config/nginx/ldap-server.conf;
+
+    # enable for Authelia (requires authelia-location.conf in the location block)
+    #include /config/nginx/authelia-server.conf;
+
+    # enable for Authentik (requires authentik-location.conf in the location block)
+    #include /config/nginx/authentik-server.conf;
+
+    location / {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app vaultwarden;
+        set $upstream_port 80;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ ^(/vaultwarden)?/admin {
+        # enable the next two lines for http auth
+        #auth_basic "Restricted";
+        #auth_basic_user_file /config/nginx/.htpasswd;
+
+        # enable for ldap auth (requires ldap-server.conf in the server block)
+        #include /config/nginx/ldap-location.conf;
+
+        # enable for Authelia (requires authelia-server.conf in the server block)
+        #include /config/nginx/authelia-location.conf;
+
+        # enable for Authentik (requires authentik-server.conf in the server block)
+        #include /config/nginx/authentik-location.conf;
+
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app vaultwarden;
+        set $upstream_port 80;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/vaultwarden)?/api {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app vaultwarden;
+        set $upstream_port 80;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+
+    location ~ (/vaultwarden)?/notifications/hub {
+        include /config/nginx/proxy.conf;
+        include /config/nginx/resolver.conf;
+        set $upstream_app vaultwarden;
+        set $upstream_port 80;
+        set $upstream_proto http;
+        proxy_pass $upstream_proto://$upstream_app:$upstream_port;
+
+    }
+}
+```
+
+Appuyez sur `Echap` puis sauvegardez et quittez en tapant `:x` puis en appuyant sur `Entrée`.
+
+Et voilà, vous avez exposé Vaultwarden ! Accédez au panneau d'administration via `https://vault.mondomaine.fr/admin` et collez le mot de passe que vous avez choisi pour générer l'`ADMIN_TOKEN`. Plus d'info sur les fonctionnalités de [Bitwarden](https://bitwarden.com/help/).
+
+N'oubliez pas d'installer les extensions Bitwarden (elles sont compatibles avec Vaultwarden) pour [Chrome](https://chromewebstore.google.com/detail/gestionnaire-de-mots-de-p/nngceckbapebfimnlniiiahkandclblb) ou pour [Firefox](https://addons.mozilla.org/fr/firefox/addon/bitwarden-password-manager/) ainsi que les applications [iOS](https://apps.apple.com/fr/app/bitwarden/id1137397744) et [Android](https://play.google.com/store/apps/details?id=com.x8bit.bitwarden&hl=fr) afin de synchroniser vos mot de passe.
+
+::alert{type="success"}
+✨ __Astuce :__ vous pouvez protéger cette app avec Authentik en ouvrant `tools.subodmain.conf` et en retirant les `#` devant `include /config/nginx/authentik-server.conf;`{lang=nginx} et `include /config/nginx/authentik-location.conf;`{lang=nginx}. N'oubliez pas de [créer une application et un fournisseur dans Authentik](/serveex/securite/authentik#protéger-une-app-par-reverse-proxy).
+::

content/3.serveex/9.apps/_dir.yml

@@ -0,0 +1,2 @@
+navigation.title: Applications utiles
+icon: lucide:award

content/3.serveex/_dir.yml

@@ -0,0 +1,2 @@
+icon: noto:microscope
+navigation.redirect: /serveex/introduction

content/4.stockeex/1.introduction.md

@@ -0,0 +1,24 @@
+---
+icon: lucide:bookmark
+navigation: true
+title: Introduction
+description: Introduction à Stockeex — un projet personnel de gestion de stock et d'inventaire. Documentation en cours de rédaction.
+main:
+  fluid: false
+---
+# Stockeex
+
+  ::terminal{style="margin-top:80px;"}
+  ---
+  content:
+  - sudo systemctl status stockeex-article
+  - currently writing, come back later...
+  ---
+  ::
+
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+<div align="center">
+  <img src="/img/stockeex/stockeex-raid.svg" alt="Image" style="max-width: 60%;">
+</div>
+

content/4.stockeex/_dir.yml

@@ -0,0 +1,2 @@
+icon: noto:computer-disk
+navigation.redirect: /stockeex/introduction

content/5.betises/1.python/1.nvidia-stock-bot.md

@@ -1,10 +1,17 @@
 ---
+navigation: true
 title: Nvidia Stock Bot
-description: Un bot Python qui surveille la disponibilité des GPU en temps réel et envoie des alertes Discord, créé lors de la pénurie de la série RTX 5000.
+description: Un bot Python qui surveille la disponibilité des GPU en temps réel et envoie des alertes Discord — créé lors de la pénurie de la série RTX 5000.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Scripts python
 
+Mes cochonneries en python
 
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+## 🤖 Nvidia Stock Bot
+---
 
 Depuis déjà 4 ans, la pénurie de materiel electronique fait rage. Et les cartes graphiques ne sont pas épargnées. En 2020, j'ai du attendre 2 mois pour obtenir mon exemplaire de RTX 3080, et pour cela j'ai du m'inscrire sur [JV Hardware](https://discord.gg/gxffg3GA96) où une poignée de geek avait mis en place un bot qui envoyait un ping lorsqu'elles étaient disponibles.
 
@@ -14,20 +21,24 @@ Quoiqu'il en soit, désireux d'obtenir une RTX 5090 pour ma machine dédiée à
 
 Après moult déconvenues, je suis passé de ceci :
 
-![Nvidia Stock Bot Old](/img/nonsense/nvidia-stock-bot-old-en.svg)
+![Nvidia Stock Bot Old](/img/betises/nvidia-stock-bot-old.svg)
 
 à cela :
 
-![Nvidia Stock bot](/img/nonsense/nvidia-stock-bot-en.svg)
+![Nvidia Stock bot](/img/betises/nvidia-stock-bot.svg)
 
 Et plus récemment :
 
-![Nvidia Stock bot](/img/nonsense/nvidia-stock-bot-en-v4.svg)
+![Nvidia Stock bot](/img/betises/nvidia-stock-bot-en-v4.svg)
 
 J'ai également eu la chance d'être référencé dans la fameuse [newsletter selfhost](https://selfh.st/weekly/2025-07-11/) !
 
 Plus d'infos directement sur le repo :
 
-::card{title="🐋 __Nvidia Stock Bot__" to="https://git.djeex.fr/Djeex/nvidia-stock-bot" target="_blank"}
-Robot d'alerte de stock de GPU Nvidia
+ 
+  ::card
+  #title
+    🐋 __Nvidia Stock Bot__
+  #description
+  [Robot d'alerte de stock de GPU Nvidia](https://git.djeex.fr/Djeex/nvidia-stock-bot)
   ::

content/5.betises/1.python/2.adguard-cidre.md

@@ -1,10 +1,13 @@
 ---
+navigation: true
 title: Adguard CIDRE
 description: Un script Python pour synchroniser automatiquement les listes CIDR d'AdGuard Home et sécuriser votre serveur DNS auto-hébergé exposé sur internet.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# 🤖 Adguard CIDRE Sync
 ---
-
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
 
 Adguard Home est une solution merveilleuse pour filter ses requêtes DNS et ainsi se débarasser de la publicité ou des DNS des fournisseurs d'accès, ou encore réécrire des requetes.
 
@@ -17,7 +20,6 @@ CIDRE est un outil qui permet de synchroniser des listes de plages IP géolocali
 C'est ainsi qu'est né Adguard CIDRE Sync, un conteneur qui synchronise régulièrement la block list d'Adguard avec les plages IP recensées par CIDRE à la fréquence que vous voulez.
 
 L'idée etant de :
-
 - Backup le fichier de conf d'Adguard au premier lancement (le fichier jamais touché par le robot est ainsi conservé au cas où)
 - Télécharger la liste des pays selectionnés via une variable d'environnement
 - Permettre d'ajouter soi-meme des IP "à la main" dans un fichier
@@ -28,6 +30,10 @@ Tout ceci de manière complètement autonome, avec une fréquence choisie en var
 
 Plus d'infos directement sur le repo :
 
-::card{title="🐋 __Adguard CIDRE Sync__"}
+ 
+  ::card
+  #title
+    🐋 __Adguard CIDRE Sync__
+  #description
   [Robot de synchronisation de la blocklist d'Adguard](https://git.djeex.fr/Djeex/adguard-cidre)
   ::

content/5.betises/1.python/3.lumeex.md

@@ -0,0 +1,69 @@
+---
+navigation: true
+title: Lumeex
+description: Lumeex est un générateur de galerie photo statique en Python — minimaliste, léger et entièrement personnalisable sans CMS.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+<div align="center">
+  <img src="https://git.djeex.fr/Djeex/lumeex/raw/branch/main/illustration/logo.svg" alt="Lumeex Screenshot" width="300"/>
+</div>
+<p/>
+<div align="center">
+<p>Yet another minimalist, lightweight photo gallery static site generator.</p>
+</div>
+</p>
+<div align="center">
+  <img src="https://git.djeex.fr/Djeex/lumeex/raw/branch/main/illustration/lumeex.png" alt="Lumeex Screenshot" />
+</div>
+---
+
+Amateur de photographie, j'ai passé plusieurs semaines à chercher un framework avec une galerie photo qui rende mieux qu'Instagram. Je souhaitais quelque chose qui mette en avant les photos plutot que l'auteur, et qui rend chaque visite unique en rendant le chargement des photos aleatoire. Tout en pouvant filtrer et trier par tag ou association de tag.
+
+Finalement, je n'ai rien trouvé qui faisait exactement ce que je voulais, et lorsque cela s'en approchait c'etait toujours via de lourds CMS. J'ai alors décidé de faire un site statique, à la main, avec Notepad++ à l'ancienne. Me debrouillant assez bien en HTML/CSS et un peu en javascript, je suis vité tombé sur un résultat sympa, durant mes vacances entre deux sessions à la plage. Après tout, un bon ouvrier doit avoir de bons outils, et il n'y a pas de meilleurs outils que ceux que l'on crée soit-même.
+
+Puis je me suis dit qu'il serait peut etre pas mal d'automatiser certaines actions, comme les formats de favicons, le resize et la conversion des images, la génération de la gallerie au lieu de tout saisir à la main, la création des robots.txt et sitemap... Et je me suis remis à Python.
+
+Finalement, après avoir obtenu de bons résultats, je me suis dit autant aller jusqu'au bout: un framework complet permettant de générer une galerie sur un site statique, en remplissant juste les informations du site dans un fichier de config et avec un peu de customisations visuelle sans rentrer dans le code.
+
+C'est ainsi qu'est né **Lum[eex]{style="color: #1ad6ff"}**
+
+</p>
+<div align="center">
+  <img src="https://git.djeex.fr/Djeex/lumeex/raw/branch/main/illustration/lumeex-webui.png" alt="Lumeex Screenshot" />
+</div>
+
+---
+
+::card-grid{grid-template-columns="repeat(2, minmax(0, 1fr));"}
+#title
+Et voilà le bousin
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+ 
+  ::card{icon=noto:open-book}
+  #title
+  __Documentation__
+  #description
+  [Accéder à la doc](https://lumeex.djeex.fr)
+  ::
+ 
+  ::card{icon=simple-icons:gitea style="color: #9ee773;"}
+  #title
+  __Repository__
+  #description
+  [Accéder au repo](https://git.djeex.fr/Djeex/lumeex)
+  ::
+
+  ::card{icon=fluent-color:design-ideas-48}
+  #title
+  __Demo__
+  #description
+  [Explorer la demo](https://modern.djeex.fr)
+  ::
+::

content/5.betises/1.python/4.instameex.md

@@ -0,0 +1,58 @@
+---
+navigation: true
+title: Instameex
+description: Instameex est un outil Docker pour fusionner des exports SDR et HDR en un JPEG avec gain map prêt pour l'upload HDR sur Instagram.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+<div align="center">
+  <img src="https://git.djeex.fr/Djeex/instameex/raw/branch/main/src/assets/img/logo-long.svg" alt="Lumeex Screenshot" width="300"/>
+</div>
+<p/>
+<div align="center">
+<p>Mixez vos photos SDR et HDR pour obtenir un fichier parfait pour Instagram</p>
+</div>
+</p>
+<div align="center">
+  <img src="https://git.djeex.fr/Djeex/instameex/raw/branch/main/illustration/instameex-illustration.png" alt="Instameex Screenshot" width="640" />
+</div>
+---
+
+Il n'y a rien de plus frustrant que la gestion du HDR d'instagram. Ce dernier compresse et démolit les gainmap, et au moindre changement de ratio ou de taille supprimme purement et simplement le HDR. Quant à lightroom, leur systeme de "SDR preview" est tout bonnement inacceptable, ne permettant pas d'obtenir des résultats correct. Jusqu'ici, lorsque l'on veut poster sur instagram, il faut choisir entre un SDR potable et un HDR déficient, ou l'inverse.
+
+Pourquoi ne pas tout simplement éditer pleinement son fichier SDR d'une part, son fichier HDR d'une autre part, et recalculer une gainmap à partir de ces deux fichiers parfaits ?
+Quelques aventuriers se sont déjà lancés sur ce chemin, notamment avec un plugin [Adobe Lightroom Classic](https://github.com/karachungen/lightroom-plugin-export-hdr). Mais jugez moi comme vous voulez, je n'utilise que Lightroom CC, qui ne gère pas les plugins.
+
+Je me suis alors inspiré d'un [fork du premier projet](https://github.com/kostis-kounadis/instagram-hdr-assembler) qui a donné lieu au plugin LrC, pour créer un front, déployable facilement avec docker. On ne va pas se mentir, cela a été un bon moyen de tester mon abo Claude Code. Et je dois avouer que c'est très impressionnant de le voir créer ses propres environnements, faire des test de bout en bout, auto-corriger son code, et écrire des bilans détaillés. J'ai quand même tout relu, je vous rassure. Et j'ai énormément appris sur les principes du HDR, des gainmap, des courbes HLG/PQ, des espaces colorimétriques, et j'en passe.
+
+En gros, voilà ce que donne mon workflow à présent pour poster sur Insta :
+
+![Instameex](/img/betises/instameex-workflow.svg)
+
+Je vous présente donc **Instam[eex]{style="color: #1ad6ff"}**
+
+---
+::card-grid{grid-template-columns="repeat(2, minmax(0, 1fr));"}
+#title
+Et voilà le résultat
+
+#root
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+#default
+  ::card
+  #title
+  🐋 __Instameex__
+  #description
+  [Accéder au repo](https://git.djeex.fr/Djeex/instameex)
+  ::
+ 
+  ::card
+  #title
+  🌍 __Version en ligne__
+  #description
+  [Convertir en ligne](https://instameex.djeex.fr)
+  ::
+::

content/5.betises/2.bash/1.servarr-doublons.md

@@ -1,28 +1,30 @@
 ---
+navigation: true
 title: Doublons servarr
 description: Un script bash pour détecter et corriger les fichiers médias en double dans les bibliothèques Sonarr et Radarr en remplaçant les copies par des hardlinks.
+main:
+  fluid: false
 ---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
+# Detection de doublons et remplacement par des hardlinks
+---
 
 Six mois après avoir téléchargé des térabytes de media, je me suis rendu compte que Sonarr et Radarr les copaient dans ma biblio Plex au lieu de créer des hardlinks. C'est dû à un mécanisme contre intuitif qui est que si vous montez plusieurs dossiers dans Sonarr/Radarr, il les voit comme deux systemes de fichiers différents. Et ne peut donc pas créer de hardlinks. C'est pour cela qu'il ne faut monter qu'un seul dossier parent, qui contient tous les enfants (`downloads`, `movies`, `tvseries` dans le dossier parent `media` par exemple).
 
 J'ai donc restructuré mes dossiers, remis à la main chaque chemin dans Qbittorrent, Plex, et autres. Il restait à trouver un moyen de détecter les doublons existants et d'automatiquement les supprimer et de créer des hardlinks à la place, pour économiser de l'espace.
 
-::file-tree
----
-label: Mes dossiers
-tree:
-  .:
-    - media:
-      - seedbox/
-      - radarr:
-        - tv-radarr/
-      - movies/
-      - tvseries/
----
-::
+Mes dossiers :
+
+```sh
+.
+└── media
+    ├── seedbox
+    ├── radarr
+    │   └── tv-radarr
+    ├── movies
+    └── tvseries
+```
 
 Mes dossiers originaux sont dans `seedbox`, et il ne faut surtout pas les modifier pour qu'ils continuent d'etre "seed". Les copies, et donc doublons, sont dans `movies` et `tvseries`. Mais pour complexifier la chose, j'ai aussi des media uniques originaux déposés par ailleurs dans `movies` et `tvseries`, sinon cela serait trop facile. Et dans ces deux dossiers, il peut y avoir des sous dossiers, des sous-sous dossiers, etc. 
 
@@ -42,7 +44,7 @@ Je vous passe les incessantes questions réponses avec ChatGPT, je suis assez d
 
 Pour tester, j'ai d'abord demandé un script qui ne fait que lister et comparer :
 
-```bash [Terminal]
+```sh
 #!/bin/bash
 
 # Créer un tableau associatif pour stocker les doublons
@@ -66,6 +68,7 @@ while IFS= read -r -d '' file; do
             echo
         fi
     else
+        # Si c'est la première fois qu'on rencontre ce nom de fichier
         seen[$filename]="$inode"
         seen["$filename:full_path"]="$file"
     fi
@@ -83,12 +86,10 @@ Doublons pour "episode1.mkv" :
 Avec "awk", il se serait arrêté à  `/media/seedbox/sonarr/Serie`. Je ne suis absolument pas un pro, mais Qwen3 a été plus performant et m'a expliqué de A à Z pourquoi et comment faire.
 
 Une fois que j'ai vu que cela fonctionnait bien, j'ai demandé un script qui fait l'intégralité de la cinématique, de la comparaison aux hardlinks en passant par la suppression des doublons.
-
 Encore une fois ChatGPT a été décevant. Malgré mes demandes, il créait d'abord les hardlinks et ensuite il supprimait les doublons. Ce qui.. suprimme aussi le lien (meme si cela conserve l'originale). Idiot.
-
 Petit détour par Qwen3, et ma RTX 5090 en PLS, et paf un résultat bien plus propre. Bon il a gardé les emoji de ChatGPT qui peut pas s'empecher d'en mettre partout, mais voilà :
 
-```bash [Terminal]
+```sh
 #!/bin/bash
 
 echo "🔍 Étape 1 : Indexation des fichiers originaux dans /media/seedbox..."
@@ -135,7 +136,6 @@ echo "✅ Terminé."
 ```
 
 Bilan j'ai :
-
 - appris pas mal de subtilité bash
 - appris qu'il ne faut jamais copier coller un script généré ChatGPT sans le comprendre et sans le tester en dry-run
 - appris que Qwen sur une RTX 5090 est plus cohérent que ChatGPT 4o sur des fermes de serveurs (je vous passe les résultats de la version "normale").

content/5.betises/2.bash/2.luks-backup.md

@@ -1,17 +1,19 @@
 ---
+navigation: true
 title: Luks backup
 description: Un script bash pour extraire automatiquement les headers LUKS de tous les disques chiffrés, les identifier par numéro de série et les archiver de façon chiffrée.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Backup des headers luks pour disques/volumes chiffrés
 ---
-
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
 
 Je me suis rendu compte il y a peu qu'il ne suffisait pas d'avoir le mot de passe pour deverouiller un volume luks apres une panne ou une corruption. J'ai ainsi appris à dump les headers luks des disques/volumes et à utiliser les numéros de série + noms de partitions pour pouvoir bien identifier quel header correspond à quel disque/partition (j'en ai 10 !).
 
 Après avoir bien galéré à la main, j'avoue avoir demandé à Qwen3 (llm hebergé sur ma RTX 5090) de me faire un script qui automatise le listing et identification des disques, dump les headers et les stock dans une archive chiffrée prete à etre backupée sur mon serveur de sauvegarde.
 
 Ainsi, ce script :
-
 * Liste et identifie les disques avec leur numéro de série
 * Liste les partition
 * Dump les headers dans un dossier dans `/root` (dossier sécurisé)

content/5.betises/2.bash/3.socat-proxy.md

@@ -1,12 +1,16 @@
 ---
+navigation: true
 title: Socat Proxy
 description: Utiliser socat pour proxifier le socket Docker via Docker Socket Proxy, permettant à Beszel de collecter les stats des conteneurs sans exposer le socket complet.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+# Socat Proxy
 ---
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
 Ce projet répond à un cas d'usage problématique :
-
 - J'ai [Beszel](https://beszel.dev/), un conteneur de monitoring en mode host, nécessitant d'exposer le socket de Docker afin qu'il récupère les stats des conteneurs
 - Afin de ne pas laisser le socket complètement ouvert pour Beszel, j'ai [Docker Socket Proxy](https://github.com/Tecnativa/docker-socket-proxy), un conteneur qui se place entre le scoket de docker et le conteneur qui en a besoin, et qui filtre le requêtes en paramétrant les bonnes permissions pour ne pas tout exposer au conteneur qui l'utilise.
 
@@ -23,12 +27,12 @@ Ainsi, un filtre comme Docker Socket Proxy dialogue avec Socat Proxy dans leur p
 
 En gros :
 
-![](/img/nonsense/socat-proxy.svg)
+![](/img/betises/socat-proxy.svg)
+
 
 Par exemple, pour Beszel cela rendrait comme ceci :
 
-```yaml [compose.yaml]
----
+```yaml
 services:
   socat-proxy:
     image: git.djeex.fr/djeex/socat-proxy:latest
@@ -77,6 +81,10 @@ services:
 
 Plus d'infos directement sur le repo :
 
-::card{title="🐋 __Socat Proxy__"}
+ 
+  ::card
+  #title
+    🐋 __Socat Proxy__
+  #description
   [A lighteweight bind mount socket proxy](https://git.djeex.fr/Djeex/socat-proxy)
   ::

content/5.betises/2.bash/4.hotdisk.md

@@ -1,14 +1,16 @@
 ---
+navigation: true
 title: HotDisk
 description: Un script bash qui surveille la température des disques durs et éteint automatiquement le serveur lorsqu'ils dépassent un seuil de sécurité trop longtemps.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+# HotDisk
 ---
 
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
-
-Quand on a un NAS avec plusieurs disques dans une buanderie, les températures peuvent vite grimper.  
-Un disque dur est très sensible à la chaleur et peut subir de gros dommages s'il dépasse une température seuil trop longtemps.  
-Après un été très chaud qui a fournit son lot de sueur froide en regardant la température de mes disques, j'ai cherché un moyen de pouvoir automatiser l'extinction du serveur en cas de dépassement prolonger de la température maximale supportée par mes disques.
+Quand on a un NAS avec plusieurs disques dans une buanderie, les températures peuvent vite grimper. Or, un disque dur est très sensible aux températures et peut subir de gros dommages s'il dépasse une température seuil pendant un certain temps. Après un été très chaud qui a fournit son lot de sueur froide en regardant la température de mes disques, j'ai cherché un moyen de pouvoir automatiser l'extinction du serveur en cas de dépassement prolonger de la température maximale supportée par mes disques.
 
 N'ayant rien trouvé de convaincant, je l'ai donc fait moi-même.
 
@@ -18,8 +20,7 @@ N'ayant rien trouvé de convaincant, je l'ai donc fait moi-même.
 - Il déclenche l’arrêt du système si la température dépasse la limite pendant la durée configurée.
 - Il enregistre toutes les températures et l’état des compteurs, et effectue automatiquement la rotation des journaux.
 
-Puis tant qu'on y est, j'ai ajouté un script d'installation qui installe le script principal, le rend exécutable, crée un service systemd et un timer, et les active automatiquement.  
-Le script d'installation permet aussi de régler différents paramètres :
+Puis tant qu'on y est, j'ai ajouté un script d'installation qui installe le script, le rend éxecutable, crée un service systemd et un timer systemd et l'active. Le script d'installation permet aussi de régler les différentes variables:
 
 | Variable              | Description                                                                 | Valeur par défaut                             |
 |-----------------------|------------------------------------------------------------------------------|-----------------------------------------------|
@@ -31,8 +32,7 @@ Le script d'installation permet aussi de régler différents paramètres :
 | `LOG_ROTATE_PERIOD`   | Période de rotation des journaux (`daily` ou `weekly`)                       | `daily`                                       |
 | `DISCORD_WEBHOOK`     | URL du webhook Discord pour les notifications                               | _Obligatoire_                                 |
 
-Il exécute aussi un autre script qui paramètre **logrotate** avec les éléments configurés précédemment.  
-Et enfin, le script d'installation peut être exécuté directement via un simple `curl` suivi d'un dernier script de configuration, parfait pour les plus flemmards.
+Il execute aussi un autre script qui paramètre le logrotate avec les éléments configurés prédédemment. Et enfin, le script d'installation peut etre executé via un simple curl + execution d'un dernier script pour les plus flemmard.
 
 Il a fallu également gérer le sujet du root sans sudo, du sudo seul, de l'utilisateur sans sudo, les divers cas d'erreur (dépendances manquantes, erreur dans les permissions, créations de fichier, de lecture des données des disques, etc...)
 
@@ -40,6 +40,10 @@ Et l'acces concurrent au fichier de statuts.
 
 Plus d'infos directement sur le repo :
 
-::card{title="📜 __HotDisk__" to="https://git.djeex.fr/Djeex/hotdisk" target="_blank"}
-Gardez vos disques au frais !
+ 
+  ::card
+  #title
+    📜 __HotDisk__
+  #description
+  [Gardez vos disques au frais !](https://git.djeex.fr/Djeex/hotdisk)
   ::

content/5.betises/2.bash/5.backrest-docker-stop.md

@@ -1,32 +1,35 @@
 ---
+navigation: true
 title: Backrest Docker Stop
-description: Un script bash qui arrête les conteneurs Docker avant une sauvegarde Backrest et les redémarre après, pour des sauvegardes de bases de données sans dump complexe.
+description: Un script bash qui arrête les conteneurs Docker avant une sauvegarde Backrest et les redémarre après — pour des sauvegardes de bases de données sans dump complexe.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+
+# Backrest Docker Stop
 ---
 
+[Backrest](https://github.com/garethgeorge/backrest) est un formidable outil de backup. Dans le cas de [Serveex](https://docu.djeex.fr/fr/serveex/introduction), la majeure partie des données à sauvegarder sont des conteneurs, et souvent ces conteneurs possèdent des bases de données. Le problème ? On ne peut pas sauvegarder proprement une BDD qui est en route. Alors, il existe plein de solutions complexe à base de dump des bases de données, mais souvent le plus simple cela reste de stopper les conteneurs, de sauvegarder, et de redémarrer les conteneurs.
 
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
-
-[Backrest](https://github.com/garethgeorge/backrest) est un formidable outil de backup. Dans le cas de [Serveex](https://docu.djeex.fr/fr/serveex/introduction), la majeure partie des données à sauvegarder sont des conteneurs, et souvent ces conteneurs possèdent des bases de données.
-
-Le problème ? On ne peut pas sauvegarder proprement une BDD qui est en route. Alors, il existe plein de solutions complexe à base de dump des bases de données, mais souvent le plus simple cela reste de stopper les conteneurs, de sauvegarder, et de redémarrer les conteneurs.
-
-**Backrest** ne propose pas de solutions native, mais il propose d'executer des scripts customisés à déclencher sur des évenements, comme le démarrage et la fin de la sauvegarde par exemple. Notre besoin est donc de stopper les conteneurs dont on veut sauvegarder la BDD, à chaque démarrage du plan de sauvegarde, et de les redémarrer à la fin de l'execution du plan de sauvegarde. Pour cela nous allons avoir besoin d'un script bash et d'une connexion sécurisée entre Backrest et le socket de Docker, afin d'avoir la cinématique suivante :
+**Backrest** ne propose pas de solutions native, mais il propose d'executer des scripts customisés à déclencher sur des évenements, comme le démarrage et la fin de la sauvegarde par exemple. Notre besoin est donc de stopper les conteneurs dont on veut sauvegarder la BDD, à chaque démarrage du plan de sauvegarde, et de les redémarrer à la fin de l'execution du plan de sauvegarde.
 
+Pour cela nous allons avoir besoin d'un script bash et de connecter Backrest au socker de Docker, afin d'avoir la cinématique suivante :
 - Le plan de sauvegarde se met en route
 - L'evenement déclenche l'execution d'un script custom
 - Le script contacte docker et demande la liste des conteneurs qui comportent le label `backrest.backup.stop=true`
 - Il récupère cette liste et leur envoie une commande d'extinction
 - Le plan de sauvegarde s'arrête
 - L'evenement déclenche l'execution d'un script custom
-- Le script recontacte docker, récupère la même liste, et redémarre ces conteneurs
+- Le script contacte docker et demande la liste des conteneurs qui comportent le label `backrest.backup.stop=true`
+- Il récupère cette liste et leur envoie une commande de démarrage
+
 
 ## Faire communiquer Backrest et Docker en toute sécurité
 
-Pour faire communiquer **Backrest** et Docker en toute sécurité, nous utiliserons [Docker Socket Proxy](https://github.com/linuxserver/docker-socket-proxy).  
-Cela évite d'exposer l'intégralité du socket Docker et n'accorde que les droits nécessaires.  
-Voici un exemple de stack Docker :
+Pour faire communiquer **Backrest** et Docker en toute sécurité, nous utiliserons [Docker Socket Proxy](https://github.com/linuxserver/docker-socket-proxy), afin de n'accorder que les droits nécessaires plutot que d'exposer l'intégralité du socket à Docker. Voici donc la stack :
 
-```yaml [compose.yaml]
+```yaml
 ---
 services:
   backrest:
@@ -81,7 +84,6 @@ do
 done
 sleep 10
 ```
-
 ```sh [Start]
 #!/usr/bin/env bash
 
@@ -95,18 +97,16 @@ sleep 10
 ```
 ::
 
-## Le label
 
+## Le label 
 Une fois les scripts renseignés et paramétrés pour les bons hooks dans **Backrest**, vous n'avez plus qu'à ajouter le libellé `backrest.backup.stop=true` dans les fichiers `compose.yaml` des conteneurs à éteindre et rallumer durant les sauvegardes :
 
-```yaml [compose.yaml]
----
+```yaml
 services:
   votre_service:
     ...
     labels:
-      - backrest.backup.stop=true
+      - com.centurylinklabs.watchtower.enable=true
 ```
 
-Et voilà !  
-À la prochaine sauvegarde, les conteneurs correctement labelisés s'arrêteront pendant la sauvegarde et redémarreront tout seuls une fois terminée.
+Et voilà, à la prochaine sauvegarde, les conteneurs correctement labelisés s'arreteront pendant la sauvegarde et redémarreront tout seuls à la fin.

content/5.betises/_dir.yml

@@ -0,0 +1,2 @@
+icon: noto:test-tube
+navigation.title: Mes bêtises

content/6.Poubelle/1.obsolete/1.wireguard-14.md

@@ -0,0 +1,253 @@
+---
+navigation: true
+title: Wireguard 14
+description: Ancien guide WireGuard 14 conservé à titre archivé — voir le guide WireGuard à jour pour une installation actuelle.
+main:
+  fluid: false
+---
+:ellipsis{left=0px width=40rem top=10rem blur=140px}
+# Wireguard
+
+::alert{type="info"}
+🎯 __Objectifs :__
+  - Installer Wireguard
+  - Configurer les clients
+  - Accéder au réseau sécurisé
+::
+
+## Introduction
+---
+L'utilisation d'un VPN permet d'accéder à distance aux ressources locales du serveur sans les exposer sur internet. C'est notamment une manière propre de sécuriser l'accès à la console SSH, plutot que d'exposer le port sur internet. C'est pouvoir se connecter à son réseau où que l'on soit, de maniere sécurisée, et de faire dialoguer des machines qui sont sur des réseaux différents.
+
+Ici nous utiliserons [Wireguard](https://www.wireguard.com/), un serveur VPN sécurisé et très performant, à l'aide des conteneurs :
+
+- [wg-easy](https://github.com/wg-easy/wg-easy) pour le serveur, qui propose une interface web très simple pour controler les connexions et télécharger les fichiers de conf (notamment par QR code pour les téléphones)
+- [Wireguard](https://docs.linuxserver.io/images/docker-wireguard/?h=wireguard) pour les clients linux
+
+Il existe aussi des clients Windows, MacOS, iOS et Android.
+
+Le principe est le suivant :
+
+- Sur internet, n'importe qui peut contacter n'importe quel box internet et donc essayer de contacter n'importe quel serveur exposé.
+- Votre serveur est sur votre réseau local. Il est accessible depuis le réseau local mais pas depuis internet, mis à part les services exposés (comme nous l'avons fait avec Dockge). Pour accéder aux ressources non exposées, vous devez être connecté sur le meme réseau que votre serveur et donc etre chez vous. De plus, vous devez laisser ouvert les ports utilisés par vos services à travers le pare feu de votre serveur.
+- Nous souhaitons ici au contraire, depuis n'importe où, pouvoir accéder de maniere securisée aux services non exposés sur internet du serveur, comme la console SSH qui permet de se connecter à la machine par exemple.
+- Nous souhaitons aussi accéder aux services d'autres serveurs, et par exemple relier de maniere sécurisée deux instances de Dockge pour tout controler depuis la meme interface.
+
+Pour cela nous allons créer un **réseau privé virtuel**, ou VPN, c'est à dire un tunnel sécurisé auquel personne n'a accès à part les machines que vous relierez entre elles. Elles feront partie d'un nouveau réseau et pourront dialoguer entre elle comme dans un réseau local. 
+
+D'autre part, vous pourrez ajouter votre téléphone, un ordinateur portable ou n'importe quel appareil au réseau pour pouvoir utiliser vos ressources depuis vos appareils quotidiens, où que vous soyiez.
+
+![picture](/img/serveex/vpn.svg)
+
+Dans cette illustration, la machine 1 est sur deux réseaux :
+
+- son réseau local (tous les appareils liés à la box, avec une adresse IP du type `192.168.x.x ` donc ici la machine 1 et la machine 2)
+- le réseau du VPN (tous les appareils reliés au VPN, avec une seconde adresse IP du type `10.8.x.x` donc ici la machine 1 et 4)
+
+On peut aussi faire en sorte que les machines reliées au réseau virtuel partagent les acces à leur réseau local. Ici nous ne le ferons pas, pour des raisons de sécurité, et de complexité en terme de sous-réseau (si les deux machines distantes ont des machines locales qui utilisent la meme adresse IP locale, par exemple `192.168.1.1`, cela posera des conflits). 
+
+Ainsi, sur le réseau virtuel, seules les machines directement reliées pourront dialoguer entre elle depuis ce réseau. Elles ne pourront pas dialoguer avec une machine situées sur un autre réseau local et non reliée au VPN.
+
+## Côté serveur
+---
+::alert{type="info"}
+📋 __A vérifier au préalable :__
+- Vérifiez si le port `51820 UDP` estlibre sur votre serveur, et bien routé dans le NAT de la box `Source 51820 UDP -> Destination 51820 UDP -> Serveur`. En effet, votre serveur étant derrière votre box, le port de votre box doit etre joignable et rediriger vers le port de votre serveur connecté à votre VPN.
+- Vérifiez aussi que le port `51821 TCP` est libre sur le serveur pour accéder à la web ui.
+:: 
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Cette documentation utilise la version `14` de [wg-easy](https://wg-easy.github.io/wg-easy/latest/). La version `15`comporte des breaking changes qui ne sont pas compatibles avec les configurations proposées ici.
+:::
+::
+
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── wg-easy
+        ├── config
+        │   └── etc_wireguard
+        ├── compose.yaml
+        └── .env
+```
+
+Le conteneur sera en mode `HOST`, c'est à dire qu'il occupera les ports de votre host comme s'il n'etait pas dans un conteneur mais directement installé sur la machine, sans passer par un sous-réseau.
+
+Ouvrez Dockge, cliquez sur `compose` et nommez la stack `wg_easy`.
+
+Copiez la configuration suivante :
+
+```yaml
+---
+services:
+  wg-easy:
+    network_mode: host
+    env_file:
+      - .env
+    environment:
+      - LANG=en
+      - WG_HOST=${HOST}
+      - PASSWORD_HASH=${PW}
+      - WG_DEFAULT_ADDRESS=${ADDRESS}
+      - WG_HIDE_KEYS=never
+      - WG_ALLOWED_IPS=${IPS}
+      - WG_DEFAULT_DNS=
+      - UI_TRAFFIC_STATS=true
+      - UI_CHART_TYPE=1
+    image: ghcr.io/wg-easy/wg-easy:14
+    container_name: wg-easy
+    volumes:
+      - /docker/wg_easy/config/etc_wireguard:/etc/wireguard
+    restart: unless-stopped
+    cap_add:
+      - NET_ADMIN
+      - SYS_MODULE
+```
+::alert{type="success"}
+✨ __Astuce :__ 
+- Vous pouvez personnaliser le port de wireguard avec `WG_PORT` au lieu du port par defaut `51820`
+- Ajoutez le label de watchtower afin d'automatiser les mises à jour
+
+    ```yaml
+    services
+      wg-easy:
+        #...
+        labels:
+          - com.centurylinklabs.watchtower.enable=true
+::
+
+Dans  `.env` :
+
+```properties
+HOST=
+PW=
+ADDRESS=
+IPS=
+```
+
+| Variable                  | Valeur                                                                                                                                                                                                                                                                                                                                                                                                                                    | Exemples      |
+|---------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------------|
+| `HOST`{lang=properties}    | IP publique de votre box internet (elle doit etre fixe)                                                                                                                                                                                                                                                                                                                                                                                                                        | `80.72.136.27` |
+| `PW`{lang=properties}      | Hash du mot de passe, [à générer ici](https://bcrypt-generator.com/). **ATTENTION:** doubler les `$`                                                                                                                                                                                                                                                                                                                                                                      | `$$2a$$12$$FF6T4QqSP9Ho`|
+| `ADDRESS`{lang=properties} | Plage d'adresse que le DHCP du VPN peut attribuer, le `x` doit etre présent, on peut changer les autres chiffres ou les remplacer par `x` aussi                                                                                                                                                                                                                                                                                           | `10.8.0.x`      |
+| `IPS`{lang=properties}     | les IPs qui doivent etre routées par les clients vers le VPN. Dans notre cas, on veut que seul le traffic vers le serveur et clients du VPN soit routé, on veut pas de leurs réseau local et on veut conserver l'accès à internet direct sans passer par le VPN.Si vous voulez tout de meme ajouter toutes les machines connectées aux appareils en local, ajoutez la plage `192.168.0.0/16` en séparant les deux plages par une virgule. | `10.8.0.0/24`   |
+
+
+Puis déployez la stack.
+
+### Activation du forwarding depuis l'host
+
+Pour que l'host autorise les clients à communiquer entre eux, vous devez activer les paramèttres suivants :
+
+```sh
+sudo sysctl net.ipv4.ip_forward=1
+sudo sysctl net.ipv4.conf.all.src_valid_mark=1
+```
+
+### Recuperation des fichiers de conf
+
+Afin de configurer les clients, vous devez télécharger les fichiers de conf générés par l'host :
+
+- Connectez vous via le web en local sur `http://ipduserveur:51821`
+- Créez un client
+- Téléchargez le fichier de conf
+- Renommez le en `wg0.conf`
+
+::alert{type="danger"}
+:::list{type="danger"}
+- En cas d'échec, vérifiez les règles du pare-feu.
+:::
+::
+
+## Sur le serveur client
+---
+::alert{type="info"}
+:::list{type="info"}
+- Nous partons du principe que le serveur client est un serveur linux avec Docker installé
+:::
+::
+
+Structure des dossiers
+
+```sh
+root
+└── docker
+    └── wireguard
+        └── config
+        │   └── wg_confs
+        └── compose.yaml
+```
+
+Creez le dossier `/docker/wireguard/config/wg_confs`.
+
+::alert{type="success"}
+✨ __Astuce pour les allergiques au terminal :__
+vous pouvez utiliser [File Browser](/serveex/files/file-browser) pour naviguer dans vos fichier et éditer vos documents au lieu d'utiliser les commandes du terminal.
+::
+
+```sh
+sudo mkdir -p /docker/wireguard/config/wg_confs
+```
+
+Copiez le fichier` wg0.conf` téléchargé précédemment. 
+
+::alert{type="success"}
+✨ __Astuce :__ Le moyen le plus simple est de transférer le fichier par sftp dans le dossier `/home/nomdutilisateur` puis de le copier dans le bon dossier :
+
+    ```sh
+    sudo cp ~/wg0.conf /docker/wireguard/config/wg_confs
+
+::
+
+Creez le `compose.yaml` dans `/docker/wireguard `:
+```sh
+sudo vi /docker/wireguard/compose.yaml
+```
+Appuyez sur `i` pour rentrer en modification et copiez la configuration ci-dessous
+```yaml
+services:
+  wireguard:
+    image: lscr.io/linuxserver/wireguard:latest
+    container_name: wireguard
+    network_mode: host
+    cap_add:
+      - NET_ADMIN
+      - SYS_MODULE #optional
+    environment:
+      - TZ=Europe/Paris
+    volumes:
+      - /docker/wireguard/config:/config
+      - /lib/modules:/lib/modules #optional
+    restart: unless-stopped
+```
+
+Appuyez sur `Echap` puis tapez `:x` pour quitter et sauvegarder.
+
+Lancez le conteneur :
+```sh
+cd /docker/wireguard
+sudo docker compose up -d
+```
+::alert{type="info" icon="exclamation-circle"}
+:::list{type="info"}
+- A répéter pour chaque client
+:::
+::
+
+## Autres appareils
+---
+- **Téléphone :** installer wireguard et scanner le QR code via le webui (http://ipduserveur:51821)
+- **PC :** Installer wireguard client et mettre directement le fichier de conf téléchargé via le webui
+
+::alert{type="warning"}
+:::list{type="warning"}
+- __Attention :__ Si des machines clientes sont sur le meme réseau local que le serveur (derriere la box), éditez le fichier `wg0.conf` uploadé sur cette machine en changeant avec l'adresse locale du serveur : `Endpoint = ipduserveur:51820`{lang=properties}
+:::
+::
+
+Et voilà ce que cela peut donner !
+
+![picture](/img/serveex/wireguard.svg)

content/6.Poubelle/1.obsolete/_dir.yml

@@ -0,0 +1,2 @@
+icon: lucide:trash-2
+navigation.title: Obsolète

content/6.Poubelle/_dir.yml

@@ -0,0 +1,2 @@
+icon: noto:recycling-symbol
+navigation.title: Poubelle

content/en/1.about/.navigation.yml

@@ -1,2 +0,0 @@
-title: About
-icon: i-noto-star

content/en/1.about/1.welcome.md

@@ -1,51 +0,0 @@
----
-title: Welcome
-description: Introduction to Docudjeex, a personal homelab documentation site covering self-hosted services, Debian, and Docker infrastructure.
-navigation:
-  icon: i-lucide-home
-hideHeader: true
-hideCopyPage: true
-hideToc: true
----
-
-
-:ellipsis{right=0px width=75% blur=150px zIndex=60}
-# docu[·]{style="color: #1ad6ff"}what?
-
-__Docu[·]{style="color: #1ad6ff"}djeex__ is a site containing the documentation of my personal servers, originally created to easily keep track of my configurations and commands.  
-My infrastructure is built around the Debian 13 + Docker combo, making exporting and deployment simpler.  
-Special thanks to __Nipah__, __Xenio__, __KevOut__ and others for their patience and support. The simple idea of writing this documentation would not exist without them.  
-
-## About the documentation
-
-The documentation provided here is experimental and shared in a spirit of open knowledge and experience.  It is not intended to build production-grade or industrialized infrastructure.  It may contain mistakes and/or approximations.
-
-Naturally, this documentation should only be used within a strictly legal framework.
-
-### Available or Upcoming Documentation
-
-:::div{class="relative"}
-:ellipsis{left=0px width=40rem top=10rem blur=140px}
-:::
-
-::card-group
-::card{icon="i-noto-open-book" title="General" to="/general/networking/nat"}
-Networking, storage, and hardware basics
-::
-
-::card{icon="i-noto-microscope" title="Serveex" to="/serveex/introduction"}
-Step-by-step Homelab Deployment Guide
-::
-
-::card{icon="i-noto-computer-disk" title="Stockeex"}
-*(coming soon)* Build your own home NAS to store your data and media
-::
-
-::card{icon="i-noto-test-tube" title="My nonsense" to="/nonsense/python/nvidia-stock-bot"}
-Personal scripts and side projects
-::
-
-::card{icon="i-noto-recycling-symbol" title="Recycled" to="/recycled/deprecated/wireguard-14"}
-Deprecated pages, kept for archive
-::
-::

content/en/2.general/.navigation.yml

@@ -1,2 +0,0 @@
-title: General
-icon: i-noto-open-book

content/en/2.general/1.summary.md

@@ -1,88 +0,0 @@
----
-title: General
-description: General homelab knowledge, networking, storage, and hardware fundamentals that apply beyond any single self-hosted app.
-navigation:
-  icon: i-lucide-bookmark
----
-
-
-:ellipsis{left=0px width=40rem top=10rem blur=140px zIndex=60}
-## Homelab Fundamentals
-
-This section covers the general knowledge that [Serveex](/serveex/introduction) itself relies on but doesn't re-explain every time: how networking actually works at home, how to choose and set up storage, and what hardware to run it all on. Read it once, then link back to it from any app-specific guide.
-
-### Networking
-
-:::div{class="relative"}
-:ellipsis{left=0px width=40rem top=10rem blur=140px}
-:::
-
-::card-group
-::card{icon="i-lucide-router" title="NAT & DHCP" to="/general/networking/nat"}
-Port forwarding and fixed DHCP leases on your router
-::
-
-::card{icon="i-lucide-globe" title="DNS Zone" to="/general/networking/dns"}
-Reading and editing a domain's DNS zone
-::
-
-::card{icon="i-lucide-folder-sync" title="Samba" to="/general/networking/samba"}
-Share folders over the local network
-::
-::
-
-### Storage
-
-:::div{class="relative"}
-:ellipsis{left=0px width=40rem top=10rem blur=140px}
-:::
-
-::card-group
-::card{icon="i-lucide-database" title="RAID" to="/general/storage/raid"}
-Redundant disk arrays, hardware vs software
-::
-
-::card{icon="i-lucide-layers" title="ZFS" to="/general/storage/zfs"}
-Snapshots, checksums, and built-in redundancy
-::
-::
-
-### Hardware
-
-:::div{class="relative"}
-:ellipsis{left=0px width=40rem top=10rem blur=140px}
-:::
-
-::card-group
-::card{icon="i-lucide-cpu" title="The Basics" to="/general/hardware/basics"}
-CPUs, RAM, storage, and form factors
-::
-
-::card{icon="i-lucide-network" title="Network" to="/general/hardware/network"}
-Switches, NICs, and cabling
-::
-
-::card{icon="i-lucide-hard-drive" title="The ProloNAS" to="/general/hardware/prolonas"}
-A budget N100 home server build
-::
-::
-
-### Linux tips for dummies
-
-:::div{class="relative"}
-:ellipsis{left=0px width=40rem top=10rem blur=140px}
-:::
-
-::card-group
-::card{icon="i-lucide-terminal" title="Command Line Basics" to="/general/linux/cli-basics"}
-How a command is built, and the ones you'll actually use
-::
-
-::card{icon="i-lucide-folder-tree" title="Folders and Partitions" to="/general/linux/filesystem"}
-What lives where on Debian, and the habits that keep it tidy
-::
-
-::card{icon="i-lucide-wrench" title="Handy CLI Tools" to="/general/linux/handy-tools"}
-Terminal tools worth installing, and how to set them up
-::
-::

content/en/2.general/2.networking/.navigation.yml

@@ -1,2 +0,0 @@
-title: Networking
-icon: i-lucide-network