suivi du tutoriel

This commit is contained in:
2026-01-30 23:46:24 +04:00
parent 09df0d2d4d
commit cecfbf4866
17 changed files with 502 additions and 13 deletions

36
src/pages/about.astro Normal file
View File

@@ -0,0 +1,36 @@
---
const pageTitle = "À propos";
---
<html lang="fr">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>{pageTitle}</title>
</head>
<body>
<h1>{pageTitle}</h1>
<a href="/">Accueil</a>
<a href="/about/">À propos</a>
<a href="/blog/">Blog</a>
<h1>À propos de moi</h1>
<h2>... et de mon nouveau site Astro !</h2>
<p>
Je suis en train de suivre le tutoriel d'introduction d'Astro. C'est
la deuxième page de mon site web, et c'est la première que j'ai
construite moi-même !
</p>
<p>
Ce site se mettra à jour au fur et à mesure que je compléterai
davantage le tutoriel, alors revenez régulièrement voir comment se
déroule mon parcours !
</p>
</body>
</html>

30
src/pages/blog.astro Normal file
View File

@@ -0,0 +1,30 @@
---
const pageTitle = "Blog";
---
<html lang="fr">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>{pageTitle}</title>
</head>
<body>
<h1>{pageTitle}</h1>
<a href="/">Accueil</a>
<a href="/about/">À propos</a>
<a href="/blog/">Blog</a>
<h1>Mon blog d'apprentissage d'Astro</h1>
<p>Voici où je vais publier mon parcours d'apprentissage d'Astro.</p>
<ul>
<li><a href="/posts/post-1/">Article 1</a></li>
<li><a href="/posts/post-2/">Article 2</a></li>
<li><a href="/posts/post-3/">Article 3</a></li>
<li><a href="/posts/post-4/">Article 4</a></li>
</ul>
</body>
</html>

View File

@@ -1,17 +1,21 @@
--- ---
const pageTitle = "Accueil";
---
--- <html lang="fr">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>{pageTitle}</title>
</head>
<body>
<h1>{pageTitle}</h1>
<html lang="en"> <a href="/">Accueil</a>
<head> <a href="/about/">À propos</a>
<meta charset="utf-8" /> <a href="/blog/">Blog</a>
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> </body>
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Astro</title>
</head>
<body>
<h1>Astro</h1>
</body>
</html> </html>

1
src/pages/posts/.obsidian/app.json vendored Normal file
View File

@@ -0,0 +1 @@
{}

View File

@@ -0,0 +1 @@
{}

View File

@@ -0,0 +1,33 @@
{
"file-explorer": true,
"global-search": true,
"switcher": true,
"graph": true,
"backlink": true,
"canvas": true,
"outgoing-link": true,
"tag-pane": true,
"footnotes": false,
"properties": true,
"page-preview": true,
"daily-notes": true,
"templates": true,
"note-composer": true,
"command-palette": true,
"slash-command": false,
"editor-status": true,
"bookmarks": true,
"markdown-importer": false,
"zk-prefixer": false,
"random-note": false,
"outline": true,
"word-count": true,
"slides": false,
"audio-recorder": false,
"workspaces": false,
"file-recovery": true,
"publish": false,
"sync": true,
"bases": true,
"webviewer": false
}

201
src/pages/posts/.obsidian/workspace.json vendored Normal file
View File

@@ -0,0 +1,201 @@
{
"main": {
"id": "6f65476818392d3e",
"type": "split",
"children": [
{
"id": "4792f37aa030a2bd",
"type": "tabs",
"children": [
{
"id": "c9a5ae1d384a28a9",
"type": "leaf",
"state": {
"type": "markdown",
"state": {
"file": "post-4.md",
"mode": "source",
"source": false
},
"icon": "lucide-file",
"title": "post-4"
}
}
]
}
],
"direction": "vertical"
},
"left": {
"id": "47d0f9f12d87b6ec",
"type": "split",
"children": [
{
"id": "4acecf38ed8d32fd",
"type": "tabs",
"children": [
{
"id": "691b67d6a4302866",
"type": "leaf",
"state": {
"type": "file-explorer",
"state": {
"sortOrder": "alphabetical",
"autoReveal": false
},
"icon": "lucide-folder-closed",
"title": "Explorateur de fichiers"
}
},
{
"id": "cca9ff2f9d4c6ac4",
"type": "leaf",
"state": {
"type": "search",
"state": {
"query": "",
"matchingCase": false,
"explainSearch": false,
"collapseAll": false,
"extraContext": false,
"sortOrder": "alphabetical"
},
"icon": "lucide-search",
"title": "Rechercher"
}
},
{
"id": "029454e004db258f",
"type": "leaf",
"state": {
"type": "bookmarks",
"state": {},
"icon": "lucide-bookmark",
"title": "Signets"
}
}
]
}
],
"direction": "horizontal",
"width": 300
},
"right": {
"id": "cbf28afbed520fd3",
"type": "split",
"children": [
{
"id": "98277055c25f849a",
"type": "tabs",
"children": [
{
"id": "c8e7bd349ecd562e",
"type": "leaf",
"state": {
"type": "backlink",
"state": {
"file": "post-4.md",
"collapseAll": false,
"extraContext": false,
"sortOrder": "alphabetical",
"showSearch": false,
"searchQuery": "",
"backlinkCollapsed": false,
"unlinkedCollapsed": true
},
"icon": "links-coming-in",
"title": "Rétrolien pour post-4"
}
},
{
"id": "cb74d3f9886f5556",
"type": "leaf",
"state": {
"type": "outgoing-link",
"state": {
"file": "post-4.md",
"linksCollapsed": false,
"unlinkedCollapsed": true
},
"icon": "links-going-out",
"title": "Liens sortants de post-4"
}
},
{
"id": "5465269b8a55292f",
"type": "leaf",
"state": {
"type": "tag",
"state": {
"sortOrder": "frequency",
"useHierarchy": true,
"showSearch": false,
"searchQuery": ""
},
"icon": "lucide-tags",
"title": "Mots-clés"
}
},
{
"id": "660c0945bc684661",
"type": "leaf",
"state": {
"type": "all-properties",
"state": {
"sortOrder": "frequency",
"showSearch": false,
"searchQuery": ""
},
"icon": "lucide-archive",
"title": "Toutes les propriétés"
}
},
{
"id": "135896c0667b9ff6",
"type": "leaf",
"state": {
"type": "outline",
"state": {
"file": "post-4.md",
"followCursor": false,
"showSearch": false,
"searchQuery": ""
},
"icon": "lucide-list",
"title": "Plan de post-4"
}
}
]
}
],
"direction": "horizontal",
"width": 300,
"collapsed": true
},
"left-ribbon": {
"hiddenItems": {
"switcher:Ouvrir le sélecteur rapide": false,
"graph:Ouvrir la vue graphique": false,
"canvas:Créer une nouvelle toile": false,
"daily-notes:Ouvrir la note quotidienne": false,
"templates:Insérer le modèle": false,
"command-palette:Ouvrir la palette de commandes": false,
"bases:Create new base": false
}
},
"active": "c9a5ae1d384a28a9",
"lastOpenFiles": [
"post-10.md",
"post-4.md",
"post-9.md",
"post-8.md",
"post-7.md",
"post-6.md",
"post-5.md",
"Configurer environnement de développement.md",
"post-3.md",
"post-2.md",
"post-1.md",
"log-1.md"
]
}

27
src/pages/posts/post-1.md Normal file
View File

@@ -0,0 +1,27 @@
---
title: 'Mon premier article de blog'
pubDate: 2026-01-30
description: "Compte rendu de ma première installation"
author: 'Apprenti Astro'
image:
url: 'https://docs.astro.build/assets/rose.webp'
alt: "Le logo Astro sur un fond sombre avec une lueur rose."
tags: ["astro", "blogging", "apprentissage en public"]
---
# Mon premier article de blog
Publié le : 2026-01-30
Bienvenue sur mon _nouveau blog_ dédié à l'apprentissage d'Astro ! Ici, je vais partager mon parcours d'apprentissage en créant un nouveau site web.
## Ce que j'ai accompli
1. **Installation d'Astro** : Tout d'abord, j'ai créé un nouveau projet Astro et configuré mes comptes en ligne.
2. **Création de pages** : Ensuite, j'ai appris à créer des pages en créant de nouveaux fichiers `.astro` et en les plaçant dans le dossier `src/pages/`.
3. **Création d'articles de blog** : C'est mon premier article de blog ! J'ai maintenant des pages Astro et des articles en Markdown !
## Ce qui vient ensuite
Je vais terminer le tutoriel d'Astro, puis continuer à ajouter plus d'articles. Restez à l'écoute pour en savoir plus.

View File

11
src/pages/posts/post-2.md Normal file
View File

@@ -0,0 +1,11 @@
---
title: Mon deuxième article de blog
author: Apprenti Astro
description: "Après avoir appris Astro, je ne pouvais plus m'arrêter !"
image:
url: "https://docs.astro.build/assets/arc.webp"
alt: "Le logo Astro sur un fond sombre avec un arc de cercle dégradé violet."
pubDate: 2026-01-30
tags: ["astro", "blogging", "apprentissage en public", "réussites"]
---
Après une première semaine réussie d'apprentissage d'Astro, j'ai décidé d'en faire un peu plus. J'ai écrit et importé un petit composant de mémoire !

11
src/pages/posts/post-3.md Normal file
View File

@@ -0,0 +1,11 @@
---
title: Mon troisième article de blog
author: Apprenti Astro
description: "J'ai eu quelques défis, mais demander de l'aide à la communauté m'a vraiment aidé !"
image:
url: "https://docs.astro.build/assets/rays.webp"
alt: "Le logo Astro sur un fond sombre avec un arc de cercle dégradé violet."
pubDate: 2026-01-30
tags: ["astro", "apprentissage en public", "obstacles", "communauté"]
---
Ce n'était pas toujours tout rose, mais j'adore créer avec Astro. Et, la [communauté Discord](https://astro.build/chat) est vraiment sympathique et serviable !

134
src/pages/posts/post-4.md Normal file
View File

@@ -0,0 +1,134 @@
---
title: Première note réel
pubDate: 2026-01-30
description: Tutoriel Step By Step Obsidian
author: Latchimy Nicolas
image:
tags:
- astro
- blogging
- apprentissage-en-public
---
# Première note réel
Publié le : 2026-01-30
> [!NOTE] Information
> Ce qui suit est la reprise complète du tutoriel chapitre par chapitre.
[^1]
# astro DOCS
## Bienvenue à bord
### Créer votre premier blog avec Astro
Il est question de voir les fonctionnalités clés d'astro avec un petit (menu ou index[^2]) :
- [[post-5|Configurer environnement de développement]]
- [[post-6|Créer des pages articles de blog]]
- [[post-7|Construire avec les composants]]
- [[post-8|Interroger et travailler avec des fichiers locaux]]
- [[post-9|Ajouter de linteractivité au site]]
- [[post-10|Déployer le site sur le web]]
[^3]
### A propos
Demande quelques connaissance en HTML, Markdown, CSS et Javascript pour pouvoir faire toutes les étapes du tutoriel. A l'intérieur de cette section on trouve le lien pour le [discord](https://astro.build/chat) et le dépôt [github](https://github.com/withastro/docs/issues).
## Créer et déployer votre premier site Astro
### Embarquement : Unité 1 - Configuration
Explication sur la section
### Environnement de développement
- Terminal : Ubuntu 24.04
- Editeur de code : Zed
- Node.js
- pnpm
### Créer premier projet Astro
```shell
# créer un nouveau projet avec pnpm
pnpm create astro@latest .
```
### Ecrire première ligne
```astro
---
---
<html lang="fr">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} >
<title>Astro</title>
</head>
<body>
<h1>Astro</h1>
</body>
</html>
```
-`<h1>Astro</h1>`
+`<h1>Mon site Astro</h1>`
### Dépôt en ligne
- Créer son dépôt distant dans gitea
- Faire le lien avec le dépot local
### Déploiement du site sur le net
Je déploie sur raspberry pi mais il y a pas mal d'étape à décrire.[^4]
## Ajouter, mettre en forme et lier des pages sur votre site
### Embarquement : Unité 2 - Pages
Explication sur la section
### Créer première page Astro
- création about.astro même contenu que l'index
- modification du contenu de about
- ajout de liens de navigation sur toutes les pages
- création blog.astro
- publication des modification sur le web
### Ecrire premier article de blog en Markdown
- création de la section posts qui accueil les .md
- création des .md
- rédaction de contenu markdown
- Ajout des liens vers les articles
### Ajout du contenu dynamique
- Définir et utiliser une variable dans about
```astro
---
const pageTitle = "A propos de moi";
---
<title>{pageTitle}</title>
<h1>{pageTitle}</h1>
```
- Reproduire dans index et blog
---
[^1]: *Les "`mises en avant`" ne sont pas stylisé dans le rendu des "`.md`"*
[^2]: Penser à faire un lexique, dictionnaire, codex
[^3]: Les liens internes Obsidian n'apparaissent pas comme des liens, risque d'être problématique pour ma documentation.
[^4]: Faire le résumé du déploiement sur RaspberryPi

View File

View File

View File

View File

View File