Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update docs outdated & Beginning French docs translation #235

Merged
merged 23 commits into from
Dec 9, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
# Toha Guides

[![Netlify Status](https://api.netlify.com/api/v1/badges/3dac568a-bcdd-4b98-8a47-15ccf6dd8bd4/deploy-status)](https://app.netlify.com/sites/toha/deploys) ![Repository Size](https://img.shields.io/github/repo-size/hugo-toha/guides) ![Contributor](https://img.shields.io/github/contributors/hugo-toha/guides) ![Last Commit](https://img.shields.io/github/last-commit/hugo-toha/guides) ![Open Issues](https://img.shields.io/github/issues/hugo-toha/guides?color=important) ![Open Pull Requests](https://img.shields.io/github/issues-pr/hugo-toha/guides?color=yellowgreen) ![License](https://img.shields.io/github/license/hugo-toha/guides) ![Security Header](https://img.shields.io/security-headers?url=https%3A%2F%2Ftoha-guides.netlify.app)
[![Netlify Status](https://api.netlify.com/api/v1/badges/3dac568a-bcdd-4b98-8a47-15ccf6dd8bd4/deploy-status)](https://app.netlify.com/sites/toha/deploys) ![Repository Size](https://img.shields.io/github/repo-size/hugo-toha/guides) ![Contributor](https://img.shields.io/github/contributors/hugo-toha/guides) ![Last Commit](https://img.shields.io/github/last-commit/hugo-toha/guides) ![Open Issues](https://img.shields.io/github/issues/hugo-toha/guides?color=important) ![Open Pull Requests](https://img.shields.io/github/issues-pr/hugo-toha/guides?color=yellowgreen) ![License](https://img.shields.io/github/license/hugo-toha/guides) ![Security Header](https://img.shields.io/security-headers?url=https%3A%2F%2Ftoha-guides.netlify.app)

Documentation site for Hugo theme [Toha](https://github.com/hugo-toha/toha).
72 changes: 72 additions & 0 deletions content/posts/features/index.fr.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
---
title: "Caractéristiques"
date: 2023-11-05T12:02:54+02:00
description: Caractéristique du thème Hugo Toha
menu:
sidebar:
name: Caractéristiques
identifier: features
weight: 1
---

Ce thème a été conçu à partir d'un point de préférence personnel. En tant que développeur, je veux organiser mon portfolio de façon à ce qu'il reflète au mieux mes compétences. Donc, ce thème peut ou non répondre à vos besoins, mais je serai heureux d'avoir vos commentaires.

Ce billet vous donnera un aperçu des fonctionnalités intégrées à ce thème.

### Design minimaliste

Ce thème a été conçu pour être minimaliste et beau. Le schéma de couleur a été choisi pour être simple et puissant également. La page billet a été conçue pour être aussi distraillante que possible. Merci à [Anup Deb](https://dribbble.com/anupdeb) pour ses conseils en design.

{{< img src="images/minimalist.png" width="900" align="center">}}

{{< vs 3 >}}

### Responsable

Ce thème est totalement responsable. Il est beau et cohérent sur les ordinateurs de bureau, ordinateurs portables, Tablettes, et appareils Mobile.

{{< img src="images/responsive.png" align="center" >}}

{{< vs 3 >}}

### Des cartes au design soigné

Les cartes de compétence et de projet ont été soigneusement conçue pour donner les plus utiles informations. Elle donne également au spectacteur une idée de l'étendu des connaissances sur une compétence particulière. Les cartes de projets donnent une idée de la popularité de vos projets s'il s'agit de projets open source sur Github.

{{< img src="images/cards.png" align="center" >}}

{{< vs 3 >}}

### Une chronologie de l'expérience qui représente vraiment vos expériences

La chronologie de l'expérience a été conçue pour refléter votre parcours professionnel. Elle montre les responsabilités que vous avez assumées aux différentes étapes de votre carrière.

{{< img src="images/experience-timeline.png" width="900" align="center" >}}

{{< vs 3 >}}

### Une galerie pour montrer vos réalisations

La section galerie vous permet de montrer vos réalisations auprès du public.

{{< img src="images/gallery.png" width="900" align="center" >}}

{{< vs 3 >}}

### Une barre latérale qui a du sens

Vous êtes-vous déjà retrouvé à passer beaucoup de temps à retrouver un billet particulier sur un blog ? Je l'ai fait aussi. Ce thème comprend un menu en barre latérale qui classe vos billets dans différentes catégories et sous-catégories.

{{< img src="images/sidebar.png" width="900" align="center" >}}

{{< vs 3 >}}

### Personnalisable & Extensible

Il est facile de personnaliser ce thème sans changer ses codes. Il a été conçu pour être extensible et personnalisable. Vous pouvez facilement ajouter une nouvelle section ou remplacer le CSS de n'importe quelle section sans modifier le thème.

Ca ne répond toujours pas à vos besoins ? Déposez une demande de fonctionnalité [ici](https://github.com/hossainemruz/toha).

### Support multilingue

Ce thème intègre le support de multiples langues. Vous pouvez traduire votre contenu dans de multiples langues facilement pour une meilleure accessibilité.
128 changes: 128 additions & 0 deletions content/posts/getting-started/github-pages/index.fr.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
---
title: "Déployer dans Github Pages"
date: 2023-11-11T22:00:20+02:00
menu:
sidebar:
name: Déployer dans Github Pages
identifier: getting-started-github
parent: getting-started
weight: 20
---

Dans ce billet, nous allons déployer le site que nous avons créé dans le précédent billet dans [Github Pages](https://pages.github.com/). D'abord, assurez-vous que le nom de votre dépôt soit `<your username>.github.io`. Ensuite, commitez n'importe quelles modifications locales et pousser dans Github.

#### Créer une branche `gh-pages`

D'abord, créez une nouvelle branche nommée `gh-pages`. Github définira automatiquement les configurations pour Github Pages quand il verra une branche avec ce nom.

```bash
# Création de la branche the gh-pages
$ git checkout -b gh-pages
# push de la branche source sur Github
$ git push gh-pages gh-pages
```
#### Activer Github Action

Nous allons automatiser le processus de déploiement en utilisant [Github Actions](https://github.com/features/actions). D'abord, assurez-vous que Github Action soit activé dans votre dépôt. Allez dans `Settings > Actions` de votre dépôt assurez-vous que `Action permissions` est configuré sur `Allow all actions`. Ici, une capture d'écran du paramètre décrit.

{{< img src="images/enable_action.png" align="center" >}}

#### Ajouter le flux de travail

Nous allons utiliser [peaceiris/actions-hugo](https://github.com/peaceiris/actions-hugo) action pour configurer hugo et [peaceiris/actions-gh-pages](https://github.com/peaceiris/actions-gh-pages) pour déployer le site. Créez un répertoire `.github` à la racine de votre dépôt. Ensuite, créez un répertoire `workflows` à l'intérieur du répertoire `.github`. Enfin, créez un fichier `deploy-site.yaml` à l'intérieur du répertoire `workflows` et ajoutez-y le contenu suivant:

```yaml
name: Deploy to Github Pages

# run when a commit is pushed to "source" branch
on:
push:
branches:
- main

jobs:
deploy:
runs-on: ubuntu-latest
steps:
# checkout to the commit that has been pushed
- uses: actions/checkout@v3

- name: Setup Hugo
uses: peaceiris/[email protected]
with:
hugo-version: 'latest'
extended: true

- name: Update Hugo Modules
run: hugo mod tidy

- name: Setup Node
uses: actions/setup-node@v3
with:
node-version: 18

- name: Install node modules
run: |
hugo mod npm pack
npm install
- name: Build
run: hugo --minify

# push the generated content into the `gh-pages` branch.
- name: Deploy
uses: peaceiris/[email protected]
with:
github_token: ${{ secrets.GITHUB_TOKEN }}
publish_branch: gh-pages
publish_dir: ./public
```
Cette action s'exécutera à chaque push dans la branche `main`. Ca construira le site et commit le contenu généré dans la branche `gh-pages`.

#### Déployer

Si vous avez correctement suivi le guide, votre site devrait être prêt à être déployé dans Github Pages. Désormais, si vous poussez n'importe quel commit dans votre branche `main`, une Github Action démarrera et déploiera votre site automatiquement.

Poussez un commit dans la branche `main` et allez dans l'onglet `Actions` de votre dépôt pour vérifier que l'action a démarré.

{{< img src="images/action_running.png" align="center" >}}

{{< vs 2 >}}

Maintenant, attendez la fin des actions. Si elles se terminent avec succès, vous devriez voir une encoche verte indiquant que l'exécution réussie.

{{< img src="images/action_completed.png" align="center" >}}

{{< vs 2 >}}

Une fois la Github Action terminée avec succès, vous pouvez parcourir votre site à `https://<your username>.github.io`.

{{< img src="images/site_deployed.png" align="center" >}}

#### Ajout d'un nom de domaine personnalisé

Si vous possédez un nom de domaine et que vous souhaitez l'utiliser pour ce site, rendez-vous sur le site de votre fournisseur de nom de domaine. Ajoutez les enregistrements de ressources suivants:

```
@ 3600 IN A 185.199.108.153
@ 3600 IN A 185.199.109.153
@ 3600 IN A 185.199.110.153
@ 3600 IN A 185.199.111.153
WWW 3600 IN A 185.199.108.153
WWW 3600 IN A 185.199.109.153
WWW 3600 IN A 185.199.110.153
WWW 3600 IN A 185.199.111.153
```

Pour vérifier votre domaine pour vous assurer que personne de Github ne puisse le réclamer à l'exception de vous, vous pouvez suivre les étapes contenues dans [ce guide](https://docs.github.com/en/pages/configuring-a-custom-domain-for-your-github-pages-site/verifying-your-custom-domain-for-github-pages).

Enfin, créez un fichier `CNAME` à l'intérieur du répertoire `/static` de votre dépôt. Ajoutez votre nom de domaine là:

```
example.com
```
Une fois la Github Action terminée avec succès, vous pouvez parcourir votre site à `https://<your domain name>`.

Notez qu'en naviguant sur `https://<your username>.github.io`, il redirigera automatiquement sur `https://<your domain name>`.
115 changes: 115 additions & 0 deletions content/posts/getting-started/netlify/index.fr.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
---
title: "Déployer dans Netlify"
date: 2020-06-08T21:00:15+06:00
menu:
sidebar:
name: Déployer dans Netlify
identifier: getting-started-netlify
parent: getting-started
weight: 30
---

[Netlify](https://www.netlify.com/) offers an excellent and easy process for deploying hugo static site. You can deploy your site in matter of few clicks. Unlike Github Pages, you can name your repository whatever you want. You can also customize the site URL.

In this post, we will show the step-by-step process of deploying a hugo site with netlify.

### Add Netlify Configuration

At first, create a `netlify.toml` file at the root of your repository and add the following configuration there:

```toml
[build]
command = "hugo --gc --minify"
publish = "public"

[context.production.environment]
HUGO_ENABLEGITINFO = "true"
HUGO_ENV = "production"
HUGO_VERSION = "0.120.1"
NODE_VERSION = "v18.12.1"
NPM_VERSION = "8.19.2"

[context.split1]
command = "hugo mod tidy && hugo mod npm pack && npm install && hugo --gc --minify --enableGitInfo"

[context.split1.environment]
HUGO_ENV = "production"
HUGO_VERSION = "0.120.1"
NODE_VERSION = "v18.12.1"
NPM_VERSION = "8.19.2"

[context.deploy-preview]
command = "hugo mod tidy && hugo mod npm pack && npm install && hugo --gc --minify --buildFuture -b $DEPLOY_PRIME_URL"

[context.deploy-preview.environment]
HUGO_VERSION = "0.120.1"
NODE_VERSION = "v18.12.1"
NPM_VERSION = "8.19.2"

[context.branch-deploy]
command = "hugo mod tidy && hugo mod npm pack && npm install && hugo --gc --minify -b $DEPLOY_PRIME_URL"

[context.branch-deploy.environment]
HUGO_VERSION = "0.120.1"
NODE_VERSION = "v18.12.1"
NPM_VERSION = "8.19.2"

[context.next.environment]
HUGO_ENABLEGITINFO = "true"
```

Commit and push the `netlify.toml` file into Github. Now, you are ready to deploy your site with netlify.

### Deploy Site

Now, login into [netlify](https://www.netlify.com/). Then, go to `Sites` tab of your netlify dashboard and click `New site form Git` button.

{{< img src="images/2.png" align="center" >}}

{{< vs 2 >}}

A new popup will open. Select `Github` and authenticate, with your Github account.

{{< img src="images/3.png" align="center" >}}

{{< vs 2 >}}

After authenticating, it will ask to select your desired repository. Select the repository you are using for your site.

{{< img src="images/4.png" align="center" >}}

{{< vs 2 >}}

Now, netlify will take you to the deployment page. Select the branch you want to deploy. Netlify should automatically populate the required fields from the `netlify.toml` file you created earlier in this post. When you are satisfied with the configurations, press the `Deploy` button.

{{< img src="images/5.png" align="center" >}}

{{< vs 2 >}}

Now, netlify will start publishing your site immediately. Wait for the publishing process to complete. Once, the site has been published, you can browse your site at the URL automatically generated by netlify. The auto-generated URL has been pointed out by a red rectangle in the screenshot below.

{{< img src="images/6.png" align="center" >}}

### Customize URL

You can easily customize the URL of your site with just few clicks as shown below.

1. Click the `Domain Setting` button under `Site Overview` tab.

{{< img src="images/7.png" align="center" >}}

2. Now, you can either add your own domain by clicking on `Add custom domain` button or you can just use `<your custom prefix>.netlify.app` domain. Here, we are going with the later. Click the `options` dropdown and select `Edit site name`.

{{< img src="images/8.png" align="center" >}}

{{< vs 2 >}}

3. Then, give your site whatever name you want.

{{< img src="images/9.png" align="center" >}}

{{< vs 2 >}}

4. Once you have saved the new name, you will see the URL of your site has been updated instantly. Now, you can browse your site at the new URL.

{{< img src="images/10.png" align="center" >}}
Loading
Loading