← Tous les articles

Premier article

Bienvenue sur le blog. Ceci est le contenu du premier article, rédigé en Markdown et rendu avec le même thème que la liste, pour montrer la continuité de l’identité visuelle.

Une section

Le texte courant utilise Rethink Sans à 24px avec une hauteur de ligne de 1.4em, conformément aux tokens fournis. La largeur de lecture est limitée à 65ch pour un confort optimal.

  • Un premier point
  • Un deuxième point
  • Un troisième point

Une citation, mise en valeur par une bordure violette discrète.

Et un peu de code inline pour la route. On peut aussi insérer un lien qui prend la couleur bleue du thème.

System.out.println("Hello world !");

Un diagramme Mermaid

Voici un exemple de diagramme rendu côté client grâce à l’intégration astro-mermaid :

flowchart LR
    A[Rédaction] --> B{Relecture}
    B -- OK --> C[Publication]
    B -- À revoir --> A
    C --> D[(Blog)]
sequenceDiagram
    participant web as Web Browser
    participant blog as Blog Service
    participant account as Account Service
    participant mail as Mail Service
    participant db as Storage

    Note over web,db: The user must be logged in to submit blog posts
    web->>+account: Logs in using credentials
    account->>db: Query stored accounts
    db->>account: Respond with query result

    alt Credentials not found
        account->>web: Invalid credentials
    else Credentials found
        account->>-web: Successfully logged in

        Note over web,db: When the user is authenticated, they can now submit new posts
        web->>+blog: Submit new post
        blog->>db: Store post data

        par Notifications
            blog--)mail: Send mail to blog subscribers
            blog--)db: Store in-site notifications
        and Response
            blog-->>-web: Successfully posted
        end
    end

Et un diagramme de séquence pour illustrer un échange simple :

sequenceDiagram
    participant L as Lecteur
    participant B as Blog
    participant A as Auteur
    L->>B: Ouvre l'article
    B-->>L: Rend le contenu Markdown
    L->>A: Envoie un retour
    A-->>L: Répond par e-mail