ministicraft/finistdev-configuration-as-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

deploy: white theme, OVHcloud blue strip, tool logos

Browse Source 
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
ministicraft
2026-04-14 00:41:32 +02:00
parent 6ff6287c99
commit 6122848ba8
1 changed files with 65 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
index.html
View File

@@ -8,20 +8,22 @@
<!-- Reveal.js CDN -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/reset.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/reveal.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/theme/moon.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/dist/theme/white.css">
<!-- Highlight.js for code blocks -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/plugin/highlight/monokai.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/plugin/highlight/github.css">
<style>
:root {
--puppet-color: #FFAE1A;
--ansible-color: #EE0000;
--puppet-color: #A06010;
--ansible-color: #CC0000;
--terraform-color: #7B42BC;
--strip-color: #00A9FF;
}
.reveal .slides section {
text-align: left;
border-top: 6px solid var(--strip-color);
}
.reveal h1, .reveal h2 {
@@ -36,8 +38,9 @@
.title-slide { text-align: center !important; }
.title-slide h1 { text-align: center; font-size: 2em; margin-bottom: 0.2em; }
.title-slide .subtitle { font-size: 1em; color: #aaa; }
.title-slide .meta { font-size: 0.7em; color: #888; margin-top: 1em; }
.title-slide .subtitle { font-size: 1em; color: #444; }
.title-slide .meta { font-size: 0.7em; color: #555; margin-top: 1em; }
.title-slide .meta a { color: var(--strip-color); }
.puppet-col { color: var(--puppet-color); }
.ansible-col { color: var(--ansible-color); }
@@ -46,9 +49,27 @@
.filename {
font-family: monospace;
font-size: 0.65em;
color: #888;
color: #555;
margin-bottom: 0.2em;
}
.slide-logo {
position: absolute;
bottom: 0.6em;
right: 0.8em;
width: 40px;
height: 40px;
opacity: 0.8;
}
.ovh-logo {
height: 36px;
width: auto;
margin-top: 1.2em;
display: block;
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
@@ -60,13 +81,15 @@
<h1>⚙️ Configuration as Code</h1>
<p class="subtitle">Puppet · Ansible · Terraform<br>— What's the difference and when to use what? —</p>
<p class="meta">FinistDevs · 2026</p>
<img src="https://cdn.simpleicons.org/ovh/00A9FF" alt="OVHcloud" class="ovh-logo">
</section>
<!-- ─── SLIDE 2 : Speaker intro ────────────────────────────────── -->
<section>
<h2>Arnaud Prémel-Cabic</h2>
<p>Tech Lead @ OVHCloud</p>
<p style="color:#888; font-size:0.75em;">arnaud.premel-cabic@ovhcloud.com</p>
<p style="color:#555; font-size:0.75em;">arnaud.premel-cabic@ovhcloud.com</p>
<img src="https://cdn.simpleicons.org/ovh/00A9FF" alt="OVHcloud" style="height:32px; width:auto; margin-top:1em;">
</section>
<!-- ─── SLIDE 3 ──────────────────────────────────────────────────── -->
@@ -118,7 +141,7 @@
<section>
<h2>Configuration as Code</h2>
<p>Managing infrastructure through machine-readable files, stored in version control.</p>
<p style="margin-top:0.8em; color:#aaa;">Reproducible &nbsp;·&nbsp; Versionable &nbsp;·&nbsp; Auditable</p>
<p style="margin-top:0.8em; color:#666;">Reproducible &nbsp;·&nbsp; Versionable &nbsp;·&nbsp; Auditable</p>
</section>
<!-- ─── SLIDE 11 ──────────────────────────────────────────────────── -->
@@ -128,20 +151,20 @@
</section>
<!-- ─── SLIDE 12 : Terraform intro ──────────────────────────────── -->
<section>
<section class="s-tf">
<h2>🏗️ <span class="tf-col">Terraform</span></h2>
<p>Start here. Before you configure a server, you need to have one.</p>
</section>
<!-- ─── SLIDE 13 : Terraform concepts ───────────────────────────── -->
<section>
<section class="s-tf">
<h2>HCL: HashiCorp Configuration Language.</h2>
<p>Declarative, human-readable — and pure JSON works too.<br>
<code>terraform plan</code> previews &nbsp;·&nbsp; <code>terraform apply</code> creates &nbsp;·&nbsp; <code>terraform destroy</code> removes.</p>
</section>
<!-- ─── SLIDE 14 : Terraform state ──────────────────────────────── -->
<section>
<section class="s-tf">
<h2>Terraform remembers what it built.</h2>
<p>The <code>.tfstate</code> file maps code to real-world resources. Store it remotely.<br>
Depending on what you manage, it can contain plaintext sensitive values — credentials, tokens, secrets.<br>
@@ -149,7 +172,7 @@
</section>
<!-- ─── SLIDE 15 : Terraform providers ──────────────────────────── -->
<section>
<section class="s-tf">
<h2>One tool. Every API.</h2>
<p>1000+ providers: AWS, GCP, Azure, Cloudflare, GitHub, Kubernetes…<br>
Not just cloud — manage GitHub teams, Datadog monitors, PagerDuty schedules, DNS records.<br>
@@ -157,7 +180,7 @@
</section>
<!-- ─── SLIDE 16 : Terraform code ───────────────────────────────── -->
<section>
<section class="s-tf">
<p class="filename"># main.tf</p>
<pre><code class="language-hcl" data-trim>
terraform {
@@ -181,7 +204,7 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 17 : OpenTofu ──────────────────────────────────────── -->
<section>
<section class="s-tf">
<h2>In 2023, HashiCorp changed Terraform's license.</h2>
<p>BSL instead of MPL — no longer truly open-source.<br>
The community responded: <strong>OpenTofu</strong>, by the OpenTF Foundation, is the open-source fork.<br>
@@ -189,7 +212,7 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 18 : Terraform platforms ──────────────────────────── -->
<section>
<section class="s-tf">
<h2>Terraform at scale needs a platform.</h2>
<p>
<strong>Terraform Enterprise / HCP Terraform</strong> — HashiCorp's commercial offering: remote state, RBAC, audit logs<br>
@@ -200,13 +223,13 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 19 : Ansible intro ─────────────────────────────────── -->
<section>
<section class="s-ansible">
<h2>⚡ <span class="ansible-col">Ansible</span></h2>
<p>Your servers are provisioned. Now make them do something.</p>
</section>
<!-- ─── SLIDE 20 : Ansible concepts ──────────────────────────────── -->
<section>
<section class="s-ansible">
<h2>Push, not pull. SSH, not agents.</h2>
<p>YAML playbooks run tasks in order, across any number of hosts.<br>
No daemon. No certificate authority. Just Python + SSH.<br>
@@ -217,7 +240,7 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 21 : Ansible code ──────────────────────────────────── -->
<section>
<section class="s-ansible">
<p class="filename"># playbook/webserver.yml</p>
<pre><code class="language-yaml" data-trim>
- name: Configure web server
@@ -245,14 +268,14 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 22 : Ansible operations ───────────────────────────── -->
<section>
<section class="s-ansible">
<h2>Not just configuration. Operations.</h2>
<p>Patch 200 servers tonight. Roll out a kernel upgrade with a canary strategy. Run a compliance audit across your whole fleet.<br>
<em>Ansible is the tool you reach for when you need to do something — once, or every week.</em></p>
</section>
<!-- ─── SLIDE 22 : Ansible Galaxy ────────────────────────────────── -->
<section>
<section class="s-ansible">
<h2>The community does the heavy lifting.</h2>
<p><strong>Ansible Galaxy</strong> — 10,000+ ready-made roles and collections.<br>
Don't write a playbook to install Docker from scratch. Someone already did.<br>
@@ -260,7 +283,7 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 23 : Ansible platforms ────────────────────────────── -->
<section>
<section class="s-ansible">
<h2>Ansible at scale: open-source vs enterprise.</h2>
<p>
<strong>AWX</strong> — open-source web UI, API, and scheduler for Ansible<br>
@@ -271,20 +294,20 @@ output "public_ip" {
</section>
<!-- ─── SLIDE 25 : Puppet intro ──────────────────────────────────── -->
<section>
<section class="s-puppet">
<h2>🐾 <span class="puppet-col">Puppet</span></h2>
<p>Your servers are configured. Now keep them that way.</p>
</section>
<!-- ─── SLIDE 26 : Puppet concepts ──────────────────────────────── -->
<section>
<section class="s-puppet">
<h2>Pull, not push. Agents, not SSH.</h2>
<p>Every 30 minutes, each puppet-agent polls the Puppet Server, compiles a catalog, and enforces it.<br>
<em>Drift is corrected automatically — without anyone lifting a finger.</em></p>
</section>
<!-- ─── SLIDE 27 : Puppet code ───────────────────────────────────── -->
<section>
<section class="s-puppet">
<p class="filename"># manifests/webserver.pp</p>
<pre><code class="language-puppet" data-trim>
class webserver {
@@ -307,7 +330,7 @@ class webserver {
</section>
<!-- ─── SLIDE 28 : Puppet drift detection ───────────────────────── -->
<section>
<section class="s-puppet">
<h2>Someone SSH'd in and changed something.</h2>
<p>Puppet noticed. Puppet fixed it.<br>
<em>Continuous compliance — not just at deploy time. Every. 30. Minutes.</em><br>
@@ -318,7 +341,7 @@ class webserver {
</section>
<!-- ─── SLIDE 29 : Puppet platforms ─────────────────────────────── -->
<section>
<section class="s-puppet">
<h2>Puppet is for large fleets that can't afford drift.</h2>
<p>Continuous compliance, auditability, and guaranteed state — at scale.<br>
Best suited for enterprises with hundreds or thousands of long-lived servers.<br>
@@ -327,7 +350,7 @@ class webserver {
</section>
<!-- ─── SLIDE 30 : Puppet community ─────────────────────────────── -->
<section>
<section class="s-puppet">
<h2>The ecosystem outlives the company.</h2>
<p><strong>Vox Pupuli</strong> — 100+ open-source Puppet modules, community-maintained.<br>
<strong>OpenVox</strong> — an emerging open-source fork of the Puppet core.<br>
@@ -371,6 +394,20 @@ class webserver {
<script src="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/plugin/notes/notes.js"></script>
<script src="https://cdn.jsdelivr.net/npm/reveal.js@5.1.0/plugin/highlight/highlight.js"></script>
<script>
const toolLogos = {
's-tf': 'https://cdn.simpleicons.org/terraform',
's-ansible': 'https://cdn.simpleicons.org/ansible',
's-puppet': 'https://cdn.simpleicons.org/puppet/C17F00'
};
Object.entries(toolLogos).forEach(([cls, src]) => {
document.querySelectorAll('section.' + cls).forEach(s => {
const img = document.createElement('img');
img.src = src;
img.className = 'slide-logo';
s.appendChild(img);
});
});
Reveal.initialize({
hash: true,
slideNumber: 'c/t',