1. Install the holy trinity: Git, VS Code, and the GitHub CLI
In the vast digital wilderness, where code reigns supreme and innovation is the ultimate currency, one determined nerd embarked on an epic IT journey โ no fancy degrees, no corporate backing, just sheer curiosity and open source grit. What began as late-night tinkering with GitHub, VS Code, and Jekyll became a fully fledged open-source content management system with AI handling the tedious work: automated setups, intelligent error resolution, even content enhancement.
This campaign retraces that road so you can walk it yourself. Three acts chain the real quests of the realm into one journey: spark the toolchain, raise your castle, then enchant it with AI. It ends where the sequel begins โ with a living site of your own, ready to learn to run itself in The Self-Operating Website.
๐ The Legend Behind This Quest¶
The protagonist's adventure kicked off in the familiar glow of a late-night screen, staring at GitHub's endless sea of repositories. A first repo of personal notes taught commits and pull requests. VS Code โ free, extensible, with Git and a terminal built in โ became the central hub, and Copilot slashed hours off debugging. Then Jekyll ignited the real magic: plain Markdown and YAML transformed into polished websites, hosted free on GitHub Pages.
From those stones rose two real castles you can study today: bamr87/zer0-mistakes โ a Docker-optimized, Bootstrap-powered Jekyll theme with self-healing install scripts โ and bamr87/it-journey โ the quest platform you are reading right now, with AI-assisted content, automated statistics, and a link-health guardian. Early mishaps โ broken builds, CSS conflicts โ were conquered the open-source way: learn by breaking, fix by contributing. The result proves the thesis of this whole campaign: with the right tools, zeros become heroes.
๐ฏ Quest Objectives¶
By the end of this campaign you will have built and shipped:
Primary Objectives (Required for Campaign Completion)¶
- A forged toolchain โ VS Code, Git, and GitHub working as one editor-to-cloud pipeline
- A living castle โ a Jekyll site with layouts, Liquid templates, and a responsive Bootstrap theme, deployed to GitHub Pages
- A public home โ your own personal site or portal, reachable by anyone on the web
- The first enchantments โ AI-assisted automation doing the heavy lifting: documentation hubs, statistics dashboards, and automated link checking
Mastery Indicators¶
You will know you have mastered this campaign when you can:
- Take a site change from idea โ edit in VS Code โ commit โ push โ live page without looking anything up
- Explain how Markdown, YAML frontmatter, Liquid, and layouts combine into a rendered page
- Fork a theme like zer0-mistakes, customize it, and contribute a fix back upstream
- Name what AI should automate on your site โ and what still deserves a human review
๐บ๏ธ Quest Metadata¶
| Field | Value |
|---|---|
| Type | epic_quest โ a multi-session campaign in three acts |
| Tier | ๐ฑ Apprentice entry point โ chapters span levels 0000 โ 1010 |
| Total XP | +200 for the hub, ~700 XP across the twelve chapter quests |
| Primary classes | ๐ป Software Developer ยท ๐จ Frontend Developer ยท ๐ Content Creator |
| Stack | VS Code ยท Git & GitHub ยท Jekyll ยท GitHub Pages ยท Bootstrap ยท GitHub Copilot |
| Reference builds | bamr87/zer0-mistakes ยท bamr87/it-journey |
| Sequel | Epic Quest: The Self-Operating Website |
๐ The Campaign โ Three Acts¶
Each act chains existing quests of the realm into one storyline. Play the chapters in order within an act; the acts build on each other.
โก Act I โ The Spark: Forge the Toolchain¶
| # | Chapter | Level | Difficulty | Time |
|---|---|---|---|---|
| I | VS Code Mastery: Forge Your Ultimate Dev Weapon | 0000 |
๐ข Easy | 45โ60 min |
| II | Git Workflow Mastery: Branches, Merging & Collaboration | 0001 |
๐ก Medium | 75โ90 min |
| III | YAML Configuration: Site Settings Mastery | 0001 |
๐ข Easy | 45โ60 min |
๐ฐ Act II โ Raising the Castle: Jekyll & GitHub Pages¶
| # | Chapter | Level | Difficulty | Time |
|---|---|---|---|---|
| IV | Jekyll Fundamentals: Build Static Sites with Ruby | 0001 |
๐ข Easy | 75โ90 min |
| V | Liquid Templating: Dynamic Content for Jekyll Sites | 0001 |
๐ก Medium | 75โ90 min |
| VI | Bootstrap Framework: Build Responsive Sites Fast | 0001 |
๐ข Easy | 60โ75 min |
| VII | The GitHub Pages Portal: Forging Your Digital Realm | 0001 |
๐ข Easy | 2โ4 hours |
๐ Act II milestone. Cement the act with the side quest Build a Personal Website with GitHub Pages โ your own castle, live on the web, is the proof that Act II is truly complete.
๐ช Act III โ The Enchantment: AI Does the Heavy Lifting¶
| # | Chapter | Level | Difficulty | Time |
|---|---|---|---|---|
| VIII | Revolutionizing Work with AI Automation | 0010 |
๐ข Easy | 30โ60 min |
| IX | The Knowledge Vault: Automated Documentation Hub | 0001 |
๐ก Medium | 2โ3 hours |
| X | Forging the Stats Portal: Data Analytics Quest | 0001 |
๐ข Easy | 60โ90 min |
| XI | Link to the Future: Automated Hyperlink Guardian | 1010 |
๐ก Medium | 2โ3 hours |
๐ช The Enchanter's rule. Every automation in Act III follows the same discipline the sequel campaign is built on: the robot does the tedious work โ drafting, counting, checking โ and a human reviews what ships. Learn that habit here and the Self-Operating Website will feel like a natural next step, not a leap.
๐ Choose Your Adventure Platform¶
Your battleground is a GitHub repository plus a local clone in VS Code. Everything in this campaign runs on free tools and free hosting.
๐ ๏ธ Arm the forge (any OS)¶
# 1. Install the holy trinity: Git, VS Code, and the GitHub CLI
# macOS: brew install git gh && brew install --cask visual-studio-code
# Windows (winget): winget install Git.Git GitHub.cli Microsoft.VisualStudioCode
# Linux (Debian): sudo apt install git gh && sudo snap install code --classic
# 2. Authenticate and claim your corner of GitHub
gh auth login
gh repo create my-first-castle --public --clone
cd my-first-castle && code .
# 3. Verify the toolchain speaks to itself
git status && gh repo view --web
Chapters add their own apparatus as you go โ Ruby and Jekyll in Act II (via Docker or a version manager, so your host OS stays clean), and a GitHub Copilot trial plus GitHub Actions in Act III. Each chapter quest carries its own platform-specific instructions for macOS, Windows, and Linux.
๐งโโ๏ธ Primer: How the Trinity Becomes a CMS¶
โ๏ธ Skills You'll Forge¶
- Reading a Jekyll site the way the build does: Markdown + frontmatter in, rendered HTML out
- Using VS Code as the whole cockpit โ editor, terminal, Git client, and Markdown preview in one window
- Recognizing where AI plugs into the pipeline: suggestion at the keystroke, automation in CI
A CMS is just three questions answered well: where does content live? (Markdown files in a Git repo), how does it become a site? (Jekyll builds it on every push), and who does the tedious parts? (automation, increasingly AI). The seed of the whole campaign fits in one file โ a page is data plus prose:
---
title: My First Scroll
description: The page that proves the pipeline works end to end.
date: 2026-07-01T00:00:00.000Z
layout: default
---
Welcome, traveler. This Markdown becomes HTML the moment I `git push`.
Commit that file, push it, and GitHub Pages rebuilds your castle โ no server, no database, no deploy button. Act I teaches you the tools around that loop, Act II makes the loop produce a real themed site, and Act III hands the repetitive parts (docs indexes, statistics, link checking) to automation you control.
๐ Knowledge Check¶
- Which part of the file above is YAML frontmatter, and which is content?
- What triggers a GitHub Pages rebuild, and where does the built site live?
- Name one task on a content site that is worth automating with AI โ and one that is not.
๐ฎ Mastery Challenge¶
Objective: Prove the campaign is yours โ not as a story you read, but as a site you shipped.
- You completed all three acts and their eleven chapter quests in order
- Your personal site is live on GitHub Pages with a customized theme
- At least one automation (docs hub, stats portal, or link guardian) runs on your repository
- You opened at least one pull request to an open-source repo that is not your own
๐ Rewards & Progression¶
๐๏ธ Campaign Badges
- ๐ CMStyle Her0 โ you walked the whole road from zer0 to a working, AI-assisted CMS
- ๐ฐ Castle Raiser โ your Jekyll site is live on GitHub Pages
- ๐ช The Enchanter โ automation does your heavy lifting, and you review what ships
๐ ๏ธ Skills Unlocked
- VS Code + Git + Jekyll as one toolchain ยท Static-site theming and deployment ยท AI-assisted content and site automation
๐ Progression Points: +200 XP for the hub, ~700 XP across the chapter quests
๐บ๏ธ Quest Network¶
graph TD
Hub[๐ Zer0-to-Her0 CMStyle] --> A1[โก Act I ยท The Spark]
A1 --> I[I ยท VS Code Mastery]
I --> II[II ยท Git Workflow Mastery]
II --> III[III ยท YAML Configuration]
III --> A2[๐ฐ Act II ยท Raising the Castle]
A2 --> IV[IV ยท Jekyll Fundamentals]
IV --> V[V ยท Liquid Templating]
V --> VI[VI ยท Bootstrap Framework]
VI --> VII[VII ยท GitHub Pages Portal]
VII --> MS[๐
Milestone ยท Personal Website]
MS --> A3[๐ช Act III ยท The Enchantment]
A3 --> VIII[VIII ยท AI Automation]
VIII --> IX[IX ยท Knowledge Vault]
IX --> X[X ยท Stats Portal]
X --> XI[XI ยท Hyperlink Guardian]
XI --> SEQ{๐ฐ Sequel: The Self-Operating Website}
click I "/quests/0000/vscode-mastery/"
click II "/quests/0001/git-workflow-mastery/"
click III "/quests/0001/yaml-configuration/"
click IV "/quests/0001/jekyll-fundamentals/"
click V "/quests/0001/liquid-templating/"
click VI "/quests/0001/bootstrap-framework/"
click VII "/quests/0001/github-pages-portal/"
click MS "/quests/0001/personal-site/"
click VIII "/quests/0010/revolutionizing-work-with-ai-automation/"
click IX "/quests/0001/docs-in-a-row/"
click X "/quests/0001/stating-the-stats/"
click XI "/quests/1010/automated-hyperlink-guardian/"
click SEQ "/quests/codex/self-operating-website/"
๐ฎ Next Adventures¶
- ๐ฏ Begin the campaign: Chapter I โ VS Code Mastery
- ๐ฐ The sequel: Epic Quest: The Self-Operating Website โ teach the castle you just built to run itself
- ๐ค The advanced path: Epic Quest: The Agentic Codex โ govern autonomous agents on GitHub-native rails
๐ Resource Codex¶
- VS Code documentation โ the cockpit for the whole campaign
- Pro Git (free book) โ version control from first principles
- Jekyll documentation โ the static castle engine
- GitHub Pages documentation โ free hosting for your realm
bamr87/zer0-mistakesโ the Docker-optimized theme this story built- GitHub Copilot documentation โ the AI that does the heavy writing
๐ค Campaign Completion Checklist¶
- โ Completed all three acts and their chapter quests in order
- โ Deployed a themed Jekyll site to GitHub Pages
- โ Earned the Castle Raiser and Enchanter badges
- โ Ready for the sequel โ your site is one campaign away from running itself
๐ธ๏ธ Knowledge Graph¶
Structured wiki-links connect this quest to the IT-Journey knowledge graph. Open the Obsidian Graph View to explore connections.
Overworld: [[๐ฐ Overworld - Master Quest Map]] Sequel: [[Epic Quest: The Self-Operating Website]] Chapters: [[VS Code Mastery: Forge Your Ultimate Dev Weapon]] ยท [[Git Workflow Mastery: Branches, Merging & Team Collaboration]] ยท [[Jekyll Fundamentals: Build Static Sites with Ruby]] ยท [[The GitHub Pages Portal: Forging Your Digital Realm]] ยท [[Link to the Future: Automated Hyperlink Guardian Quest]] Obsidian docs: [[Obsidian Knowledge Graph and Wiki Links]]