Skip to content

Commit

Permalink
Update website workflow article
Browse files Browse the repository at this point in the history
  • Loading branch information
Antiz96 committed Nov 15, 2024
1 parent ce40099 commit 71c7b03
Show file tree
Hide file tree
Showing 18 changed files with 28 additions and 25 deletions.
6 changes: 3 additions & 3 deletions content/_index.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ Here are the main projects I actively contribute to:

### Arch Linux

![alt text](images/arch_linux-logo.png "Arch Linux logo")
![alt text](images/index/arch_linux-logo.png "Arch Linux logo")

[Arch Linux](https://archlinux.org) is a lightweight and flexible Linux distribution that focuses on simplicity, modernity, pragmatism, user centrality and versatility.

Expand All @@ -32,15 +32,15 @@ Here are the main projects I actively contribute to:

### Alpine Linux

![alt text](images/alpine_linux-logo.png "Alpine Linux logo")
![alt text](images/index/alpine_linux-logo.png "Alpine Linux logo")

[Alpine Linux](https://www.alpinelinux.org) is a security-oriented, lightweight Linux distribution based on musl libc and busybox.

- Packaging: I maintain [some packages](https://pkgs.alpinelinux.org/packages?name=&branch=edge&repo=&arch=&maintainer=Robin+Candau) in Alpine's official testing repository and I'm opening (GitLab) issues & merge requests to fix some packaging issues. I am also maintaining [some of Alpine's packaging tooling](https://archlinux.org/packages/?sort=&q=alpine&maintainer=Antiz&flagged=) in Arch Linux repositories.

### Arch-Update

![alt text](images/arch_update-logo.png "Arch-Update logo")
![alt text](images/index/arch_update-logo.png "Arch-Update logo")

[Arch-Update](https://github.com/Antiz96/arch-update) is an update notifier & applier for Arch Linux that assists you with important pre / post update tasks.

Expand Down
47 changes: 25 additions & 22 deletions content/blog/website-workflow.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,50 +4,53 @@ date: 2023-07-24T13:20:26+02:00
draft: false
---

EDIT: This article is slitghly outdated as the workflow I use to maintain this website has evolved and improved over time. I'll eventually write a V2 of that article at some point.

## The website

This website is built with the [HUGO](https://gohugo.io/) static website generator using the [anatole](https://github.com/lxndrblz/anatole) theme.
The website's source code is hosted in [this GitHub repository](https://github.com/Antiz96/antiz.fr/).

## Automated workflow
## Automated CI / CD workflow

I make my changes *(e.g. creating an new article, update the theme, add new parameters to the website, etc...)* locally on my computer inside the git repository in the `dev` branch.
Every changes I made (e.g. creating a new article, update the theme, add new parameters to the website, ...) are done in my local git repository on the [`dev` branch](https://github.com/Antiz96/antiz.fr/tree/dev).
Once the changes are pushed to the above GitHub repository, I create a pull request from the `dev` branch to the main one, which triggers CI / CD pipelines (which run on my own self-hosted runners):

To manage this website, I use an automated CI / CD workflow:
![alt_text](../../images/website-workflow/CI_CD_Jobs.png "Website Workflow - CI_CD Jobs")

### CI

I make my changes *(creating an new article, update the theme, add new parameters to the website, etc...)* locally on my computer inside the git repository in the dev branch.
Once the changes are done, I push them to the GitHub repository and I create a pull request from the dev branch to the main one, which triggers a CI pipeline:
The [CI pipeline](https://github.com/Antiz96/antiz.fr/blob/main/.github/workflows/CI.yml) has one "Test" stage which, as the name implies, runs a bunch of tests (e.g. spellcheckers & linters):

![alt_text](../../images/Website_GitHub_MR_CI.png "Website - Merge Request CI Pipeline")
![alt_text](../../images/website-workflow/CI_Job.png "Website Workflow - CI Job")

This CI pipeline is divided into two jobs:
![alt_text](../../images/website-workflow/CI_Job_Test_Stage_Steps.png "Website Workflow - CI Job Test Stage Steps")

![alt_text](../../images/Website_GitHub_CI_Jobs.png "Website - Merge Request CI Jobs")
### CD

- The build job:
The [CD pipeline](https://github.com/Antiz96/antiz.fr/blob/main/.github/workflows/CD.yml) has two stages:

The [build job](https://github.com/Antiz96/antiz.fr/blob/main/.github/workflows/CD.yml) automatically builds the website against the new changes I made and, if the build succeeds, it automatically pushes the built website to the dev branch (and thus, add it to the current merge request).
![alt_text](../../images/website-workflow/CD_Job.png "Website Workflow - CD Job")

- The test job:
- The "Build" stage:

The [test job](https://github.com/Antiz96/antiz.fr/blob/main/.github/workflows/CI.yml) automatically runs a bunch of tests / linters against the website's files in the repository, to make sure the changes I made are correctly written / syntaxed.
The "Build" stage builds the website via `hugo` and then commits the built changes to my repository (still on the `dev` branch).

### CD
![alt_text](../../images/website-workflow/CD_Job_Build_Stage_Steps.png "Website Workflow - CD Job Build Stage Steps")

- The "Deploy" stage:

Once both of the above CI jobs succeeded (meaning the website has been successfully built, pushed to the dev branch of the repository, and the tests went through without any error), I launch a job on my [Jenkins](https://www.jenkins.io/) server targeting the dev environment *(edit: the trigger of that job is now automated via GitHub actions as well):
Once the "Build" stage has finished successfully, the "Deploy" stage is triggered.

![alt_text](../../images/Jenkins_Update_Website_Job_Dev.png "Jenkins - Update Website Job Dev")
![alt_text](../../images/website-workflow/CD_Job_Deploy_Stage_Steps.png "Website Workflow - CD Job Deploy Stage Steps")

This Jenkins job runs a simple [Ansible](https://www.ansible.com/) playbook (see that playbook [here](https://github.com/Antiz96/Linux-Server/blob/main/Ansible-Playbooks/roles/update_antiz.fr/tasks/main.yml)) that aims to update the website's sources on the targeted environment against the related GitHub branch (dev branch --> development environment, main branch --> production environment):
It allows to automatically deploy the website by remotely triggering the related job on my [Jenkins](https://www.jenkins.io/) server for my website deployment. This Jenkins job can either target my `dev` or `prod` environment (the former being hosted on a virtual server in my homelab, the latter being hosted on a VPS), thanks to a dedicated parameter.

![alt_text](../../images/Jenkins_Update_Website_Job_Param.png "Jenkins - Update Website Job Parameters")
![alt_text](../../images/website-workflow/Jenkins_Job_Parameters.png "Website Workflow - Jenkins Job Parameters")

I can then review what my changes on my development environment.
Under the hood, this Jenkins job runs a simple [Ansible](https://www.ansible.com/) playbook (see that playbook [here](https://github.com/Antiz96/Linux-Server/blob/main/Ansible-Playbooks/roles/update_antiz.fr/tasks/main.yml)) that aims to update the website's sources on the targeted environment against the related GitHub branch (`dev` branch --> development environment, `main` branch --> production environment).

Once the changes have been reviewed and declared "ready" to go to production, the only thing I need to do is to merge the changes to the main branch on the GitHub repository and relaunch my Jenkins job, targeting the "prod" environment this time, so the changes are pushed against the main branch to the VPS which hosts this website:
When opening a pull request from the `dev` branch to the `main` branch, the "Deploy" stage of my GitHub CD pipeline automatically triggers the related Jenkins job (which itself triggers the related Ansible playbook) targeting my `dev` environment, so my changes gets automatically deployed and I can review them on my development environment.

![alt_text](../../images/Jenkins_Update_Website_Job_Prd.png "Jenkins - Update Website Job Prod")
Once I reviewed the changes on my development environment and they are ready to go to production, I can just merge the pull request to the `main` branch which will [trigger a new run of the CD pipeline](https://github.com/Antiz96/antiz.fr/blob/main/.github/workflows/CD.yml#L4-L6) with the "Deploy" stage targeting the `prod` environment this time!

This workflow aims to evolve and be improved over time but it's a good example of a simple; yet effective, flexible and reliable automated CI / CD workflow you can use to manage your projects! :smile:
This workflow may evolve and be improved over time but it's a good example of a simple; yet effective, flexible and reliable automated CI / CD workflow you can use to manage your projects! :smile:
Binary file removed content/images/Jenkins_Update_Website_Job_Dev.png
Binary file not shown.
Binary file removed content/images/Jenkins_Update_Website_Job_Param.png
Binary file not shown.
Binary file removed content/images/Jenkins_Update_Website_Job_Prd.png
Binary file not shown.
Binary file removed content/images/Website_GitHub_CI_Jobs.png
Binary file not shown.
Binary file removed content/images/Website_GitHub_MR_CI.png
Binary file not shown.
File renamed without changes
File renamed without changes
File renamed without changes
Binary file removed content/images/ubuntu_unity-logo.png
Binary file not shown.
Binary file added content/images/website_workflow/CD_Job.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added content/images/website_workflow/CI_CD_Jobs.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added content/images/website_workflow/CI_Job.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 71c7b03

Please sign in to comment.