docs: added 2 pages in French (#1114)
This commit is contained in:
Gautier Ben Aïm
GitHub
parent
1f13e40316
commit
64bbd89f42
4 changed files with 244 additions and 12 deletions
|
|
@ -74,7 +74,9 @@ export const SIDEBAR = {
|
|||
],
|
||||
fr: [
|
||||
{ text: 'Bienvenue', header: true },
|
||||
{ text: 'Bien Démarrer', link: 'fr/getting-started' },
|
||||
{ text: 'Bien démarrer', link: 'fr/getting-started' },
|
||||
{ text: 'Démarrage rapide', link: 'fr/quick-start' },
|
||||
{ text: 'Installation', link: 'fr/installation' },
|
||||
],
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ lang: fr
|
|||
|
||||
Astro est un générateur de site statique moderne. Comprenez ce qu'est Astro en visitant [notre page d'accueil](https://astro.build/) ou [notre annonce de sortie](https://astro.build/blog/introducing-astro). Cette page est une vue d'ensemble de la documentation d'Astro et de toutes les ressources associées.
|
||||
|
||||
Vous cherchez un rapide condensé de ce qu'offre Astro? [Visitez notre page d'accueil.](https://astro.build)
|
||||
Vous cherchez un rapide condensé de ce qu'offre Astro ? [Visitez notre page d'accueil.](https://astro.build)
|
||||
|
||||
## Essayer Astro
|
||||
|
||||
|
|
@ -24,32 +24,32 @@ _Note: quelques-unes des fonctionnalités (ex : Rafraîchissement Rapide) sont p
|
|||
|
||||
## Apprendre Astro
|
||||
|
||||
Une multitude de personnes viennent sur Astro avec bagages d'expériences distincts apportant donc avec eux des styles d'apprentissage différents. Que vous préfériez une approche plutôt théorique ou pratique, nous espérons que vous trouverez l'aide qu'il vous faut dans cette section.
|
||||
Tous les développeurs qui essaient Astro n'ont ni la même expérience, ni les mêmes méthodes d'apprentissage. Que vous préfériez une approche plutôt théorique ou pratique, nous espérons que vous trouverez l'aide qu'il vous faut dans cette section.
|
||||
|
||||
- Si vous préférez une **approche pratique**, commencez avec notre [librairie d'exemples](https://github.com/snowpackjs/astro/tree/main/examples).
|
||||
- Si vous préférez **apprendre les concepts étape par étape**, commencez avec nos [fondamentaux et guides](/core-concepts/project-structure).
|
||||
|
||||
Comme toute nouvelle technologie, Astro possède une courbe d'apprentissage modérée. Malgré cela, avec de la pratique et de la patience, nous savons, que _vous_ allez prendre la main, en très peu de temps.
|
||||
Comme toute nouvelle technologie, Astro possède une certaine courbe d'apprentissage. Malgré cela, avec de la pratique et de la patience, nous savons, que _vous_ allez prendre la main, en très peu de temps.
|
||||
|
||||
### Apprendre la Syntaxe `.astro`
|
||||
### Apprendre la syntaxe `.astro`
|
||||
|
||||
Quand vous débutez l'apprentissage d'Astro, vous allez rencontrer beaucoup de fichier avec l'extension `.astro`. C'est la **Syntaxe des Composants Astro**: des fichiers particuliers avec un format similaire au HTML qu'Astro utilise comme template. Ils ont été conçus pour être familiers à toute personne ayant une expérience avec le HTML ou le JSX.
|
||||
Quand vous débutez l'apprentissage d'Astro, vous allez rencontrer beaucoup de fichier avec l'extension `.astro`. C'est la **Syntaxe des Composants Astro** : des fichiers particuliers avec un format similaire au HTML qu'Astro utilise comme template. Ils ont été conçus pour être familiers à toute personne ayant une expérience avec le HTML ou le JSX.
|
||||
|
||||
Notre guide utile sur les [composants Astro](/core-concepts/astro-components) vous introduit à la syntaxe Astro et reste la meilleure façon d'apprendre.
|
||||
Notre guide sur les [composants Astro](/core-concepts/astro-components) vous présente la syntaxe Astro et reste la meilleure façon d'apprendre.
|
||||
|
||||
### Documentation de l'API
|
||||
|
||||
Cette documentation vous sera utile si vous souhaitez comprendre en détails certaines API d'Astro. Par exemple, [Documentation de la Configuration](/reference/configuration-reference) liste toutes les options de configuration à votre disposition. [Documentation des Composants de base](/reference/builtin-components) liste tous les composants disponibles de base, comme `<Markdown />` et `<Prism />`.
|
||||
Cette documentation vous sera utile si vous souhaitez comprendre en détails certaines API d'Astro. Par exemple, la [Documentation de la Configuration](/reference/configuration-reference) liste toutes les options de configuration à votre disposition. La [Documentation des Composants de base](/reference/builtin-components) liste tous les composants disponibles de base, comme `<Markdown />` et `<Prism />`.
|
||||
|
||||
### Documentation Versionnée
|
||||
### Documentation versionnée
|
||||
|
||||
Cette documentation reflète toujours la dernière version stable d'Astro. Dès que nous auront atteint l'étape de la v1.0, nous ajouterons la possibilité de parcourir la documentation versionnée.
|
||||
|
||||
## Rester Informé
|
||||
## Rester informé
|
||||
|
||||
Le compte Twitter [@astrodotbuild](https://twitter.com/astrodotbuild) est la source officielle de mise à jour par l'équipe Astro.
|
||||
Le compte Twitter [@astrodotbuild](https://twitter.com/astrodotbuild) est la source officielle d'information de l'équipe Astro.
|
||||
|
||||
Nous publions également les annonces de nouvelles versions sur notre [Communauté Discord](https://astro.build/chat) dans le channel #announcements.
|
||||
Nous publions également les annonces de nouvelles versions sur notre [Communauté Discord](https://astro.build/chat) dans le salon #announcements.
|
||||
|
||||
Toutes les releases d'Astro ne requièrent pas leur propre article de blog, mais vous pouvez trouver un changelog détaillé de toutes les releases dans le [fichier `CHANGELOG.md` du dépôt Astro](https://github.com/snowpackjs/astro/blob/main/packages/astro/CHANGELOG.md).
|
||||
|
||||
|
|
|
|||
159
docs/src/pages/fr/installation.md
Normal file
159
docs/src/pages/fr/installation.md
Normal file
|
|
@ -0,0 +1,159 @@
|
|||
---
|
||||
layout: ~/layouts/MainLayout.astro
|
||||
title: Installation
|
||||
lang: fr
|
||||
---
|
||||
|
||||
Il y a plusieurs façons d'installer Astro dans un nouveau projet.
|
||||
|
||||
## Prérequis
|
||||
|
||||
- **Node.js** - `v12.20.0`, `v14.13.1`, `v16.0.0`, or plus.
|
||||
- **Éditeur de texte** - Privilégiez [VS Code](https://code.visualstudio.com/) et [l'extension Astro officielle](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode).
|
||||
- **Terminal** - Astro s'utilise principalement en ligne de commande.
|
||||
|
||||
Ce guide utilise [`npm`](https://www.npmjs.com/) dans les exemples ci-après, mais vous pouvez utiliser [`yarn`](https://yarnpkg.com/) ou [`pnpm`](https://pnpm.io/) si vous y êtes habitué·e.
|
||||
|
||||
## Initialisation complète
|
||||
|
||||
`npm init astro` est le moyen le plus facile de créer un nouveau projet avec Astro. Entrez cette commande dans un terminal pour lancer `create-astro`, l'assistant d'installation.
|
||||
|
||||
```bash
|
||||
# Avec NPM
|
||||
npm init astro
|
||||
|
||||
# Yarn
|
||||
yarn create astro
|
||||
```
|
||||
|
||||
L'assistant d'installation [`create-astro`](https://github.com/snowpackjs/astro/tree/main/packages/create-astro) vous propose de choisir entre différents [squelettes d'application](/examples), mais offre aussi la possibilité d'importer un projet Astro directement depuis GitHub.
|
||||
|
||||
```bash
|
||||
# Note : remplacez "my-astro-project" avec le nom de votre projet.
|
||||
|
||||
# npm 6.x
|
||||
npm init astro my-astro-project --template starter
|
||||
# npm 7+ (tiret -- supplémentaire)
|
||||
npm init astro my-astro-project -- --template starter
|
||||
# yarn
|
||||
yarn create astro my-astro-project --template starter
|
||||
# À partir d'un template disponible sur GitHub
|
||||
npm init astro my-astro-project -- --template [GITHUB_USER]/[REPO_NAME]
|
||||
# ... ou si ce template ce trouve à l'intérieur d'un dépôt GitHub
|
||||
npm init astro my-astro-project -- --template [GITHUB_USER]/[REPO_NAME]/path/to/template
|
||||
```
|
||||
|
||||
Après que `create-astro` a mis en place l'architecture de votre projet, n'oubliez pas d'installer les dépendances avec npm, yarn ou pnpm. Par exemple avec npm:
|
||||
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
Vous pouvez maintenant [lancer](#démarrer-astro) votre projet. Une fois votre projet prêt à être déployé, vous pourrez [le compiler](#compiler-avec-astro). Astro va empaqueter votre application et produire les fichiers statiques nécessaires pour que vous puissiez [déployer](/guides/deploy) votre application.
|
||||
|
||||
## Installation manuelle
|
||||
|
||||
Vous pouvez installer Astro en vous passant de l'assistant `create-astro` avec les quelques étapes suivantes.
|
||||
|
||||
### Créer un projet
|
||||
|
||||
```bash
|
||||
# Créez et placez vous dans un nouveau dossier
|
||||
mkdir my-astro-project
|
||||
cd my-astro-project
|
||||
```
|
||||
|
||||
### Créer un `package.json`
|
||||
|
||||
```bash
|
||||
# Cette commande va créer un fichier package.json basique
|
||||
npm init --yes
|
||||
```
|
||||
|
||||
Astro est conçu pour fonctionner avec tout l'ecosystème npm. Cela est rendu possible par un fichier de projet nommé `package.json` à la racine de votre projet. Si vous n'êtes pas familier·e avec le fichier `package.json`, nous vous recommandons fortement de lire [la documentation officielle sur le site de npm](https://docs.npmjs.com/creating-a-package-json-file).
|
||||
|
||||
### Installer Astro
|
||||
|
||||
En suivant les instructions précédentes, vous devriez avoir un dossier avec un seul fichier `package.json` dedans. Vous pouvez maintenant ajouter Astro à votre projet.
|
||||
|
||||
```bash
|
||||
npm install astro
|
||||
```
|
||||
|
||||
Vous pouvez aussi remplacer la section "scripts" du fichier `package.json` avec les lignes suivantes :
|
||||
|
||||
```diff
|
||||
"scripts": {
|
||||
- "test": "echo \"Error: no test specified\" && exit 1"
|
||||
+ "start": "astro dev",
|
||||
+ "build": "astro build"
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
La commande [`start`](#start-astro) démarre le serveur de développement Astro à l'adresse `http://localhost:3000`. Une fois votre projet terminé, la commande [`build`](#build-astro) produit votre site dans le dossier `dist/`. [En savoir plus sur le déploiement d'un site développé avec Astro.](/guides/deploy)
|
||||
|
||||
### Créer une première page
|
||||
|
||||
Ouvrez votre éditeur favori, et créez un nouveau fichier :
|
||||
|
||||
1. Créez un nouveau fichier à l'emplacement `src/pages/index.astro`.
|
||||
2. Copiez-collez l'extrait suivant (`---` compris) dedans.
|
||||
|
||||
```astro
|
||||
---
|
||||
// Le code JS/TS écrit entre les (---) n'est exécuté que par le serveur
|
||||
console.log('Coucou dans le terminal')
|
||||
---
|
||||
|
||||
<html>
|
||||
<body>
|
||||
<h1>Hello, World!</h1>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style lang="scss">
|
||||
body {
|
||||
h1 {
|
||||
color: orange;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
// Le code JS écrit ici n'est exécuté que dans le navigateur
|
||||
console.log('Coucou dans la console du navigateur')
|
||||
</script>
|
||||
```
|
||||
|
||||
Vous venez de lire un exemple de syntaxe des composants Astro, inspirée par le HTML et le JSX.
|
||||
|
||||
Vous pouvez continuer à ajouter des fichiers dans le dossier `src/pages`, et Astro se servira du nom du fichier pour ajouter des pages à votre site. Par exemple, si vous ajoutez une page `src/pages/a-propos.astro` (par exemple en reprenant le code ci-dessus), Astro va générer une nouvelle page à l'adresse `http://localhost:3000/a-propos`.
|
||||
|
||||
## [Démarrer Astro](#démarrer-astro)
|
||||
|
||||
```bash
|
||||
npm start
|
||||
```
|
||||
|
||||
Astro va démarrer votre site à l'adresse `http://localhost:3000`. En ouvrant cette URL dans votre navigateur, vous devriez voir s'afficher "Hello, World", ou bien la page créée précédemment.
|
||||
|
||||
## [Compiler avec Astro](#compiler-avec-astro)
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
Astro va produire une version allégée du site et la sauvegarder directement sur le disque. Votre application se trouvera dans le dossier `dist/`.
|
||||
|
||||
## Prochaines étapes
|
||||
|
||||
Vous êtes désormais prêt·e à développer !
|
||||
|
||||
Nous vous recommandons de prendre le temps de vous familiariser avec Astro et son fonctionnement. Nous vous recommandons les guides suivants :
|
||||
|
||||
📚 En savoir plus sur [la structure des projets Astro](/core-concepts/project-structure).
|
||||
|
||||
📚 En savoir plus sur [la syntaxe des composants Astro](/core-concepts/astro-components).
|
||||
|
||||
📚 En savoir plus sur [la génération des adresses à partir de l'arborescence.](/core-concepts/astro-pages).
|
||||
71
docs/src/pages/fr/quick-start.md
Normal file
71
docs/src/pages/fr/quick-start.md
Normal file
|
|
@ -0,0 +1,71 @@
|
|||
---
|
||||
layout: ~/layouts/MainLayout.astro
|
||||
title: Démarrage rapide
|
||||
lang: fr
|
||||
---
|
||||
|
||||
```shell
|
||||
# Prérequis : vérifiez que Node.js est en version 12.20.0+, 14.13.1+, ou 16+
|
||||
node --version
|
||||
|
||||
# Créez un nouveau dossier, et placez-vous dedans
|
||||
mkdir my-astro-project && cd $_
|
||||
|
||||
# Attention au décollage...
|
||||
npm init astro
|
||||
|
||||
# Installez les dépendances
|
||||
npm install
|
||||
|
||||
# Commencez à coder !
|
||||
npm start
|
||||
|
||||
# Quand votre site est fin prêt, compilez-en une version statique dans le dossier `dist/`
|
||||
npm run build
|
||||
```
|
||||
|
||||
Si vous désirez en savoir plus sur les différentes façons d'installer Astro dans votre projet, [lisez notre guide d'installation](installation).
|
||||
|
||||
## Commencez votre projet
|
||||
|
||||
Depuis un terminal ouvert dans votre projet, entrez la commande suivante :
|
||||
|
||||
```bash
|
||||
npm start
|
||||
```
|
||||
|
||||
Astro va lancer un serveur local sur [http://localhost:3000](http://localhost:3000). Ouvrez cette adresse dans votre navigateur, et vous devriez voir le "Hello, World" d'Astro.
|
||||
|
||||
Vous n'avez jamais besoin de redémarrer Astro : à chaque modification dans le dossier `src/`, le serveur recompile votre site.
|
||||
|
||||
## Compilez votre projet
|
||||
|
||||
Pour compiler votre projet, entrez la commande suivante dans un terminal :
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
Astro va produire une version allégée de votre site et la sauvegarder directement sur le disque. Votre application se trouvera dans le dossier `dist/`.
|
||||
|
||||
## Mettez en production
|
||||
|
||||
Les sites compilés avec Astros sont statiques, et peuvent par conséquent être déployés par votre hébergeur préféré :
|
||||
|
||||
- [Vercel](https://vercel.com/)
|
||||
- [Netlify](https://www.netlify.com/)
|
||||
- [S3 bucket](https://aws.amazon.com/s3/)
|
||||
- [Google Firebase](https://firebase.google.com/)
|
||||
- [Lire le guide de déploiement sur la documentation Astro](/guides/deploy)
|
||||
|
||||
## Prochaines étapes
|
||||
|
||||
Vous êtes désormais prêt·e à développer !
|
||||
|
||||
Nous vous recommandons de prendre le temps de vous familiariser avec Astro et son fonctionnement. Nous vous recommandons les guides suivants :
|
||||
|
||||
📚 En savoir plus sur [la structure des projets Astro](/core-concepts/project-structure).
|
||||
|
||||
📚 En savoir plus sur [la syntaxe des composants Astro](/core-concepts/astro-components).
|
||||
|
||||
📚 En savoir plus sur [la génération des adresses à partir de l'arborescence.](/core-concepts/astro-pages).
|
||||
Loading…
Reference in a new issue