Skip to main content
Settings
Search
Appearance
Theme Mode
About
Jekyll v3.10.0
Environment Production
Last Build
2026-07-02 02:06 UTC
Current Environment Production
Build Time Jul 02, 02:06
Jekyll v3.10.0
Build env (JEKYLL_ENV) production
Quick Links
Page Location
Page Info
Layout quest
Collection quests
Path _quests/codex/zer0-to-her0-cmstyle.md
URL /quests/codex/zer0-to-her0-cmstyle/
Date 2025-08-24
Theme Skin
SVG Backgrounds
Layer Opacity
0.6
0.04
0.08

Epic Quest: Zer0-to-Her0 CMStyle

Discover how one nerd transformed from zero to hero by building an AI-powered open source CMS using VS Code and Jekyll. Join the epic journey!

🌱 Lvl 0010Apprentice 👑 Epic Quest ⚔️ Epic 15-25 hours

Epic Quest: Zer0-to-Her0 CMStyle

Build your first AI-powered open-source CMS — VS Code, Git, Jekyll, GitHub Pages, and the automations that do the heavy lifting — in three acts.

Primary Tech
🛠️ ai-integration
Skill Focus
Fullstack
Series
The Autonomous Realm
Author
IT-Journey Team
XP Range
⚡ 500-750

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 00001010
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

📚 Resource Codex

🤝 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]]

🎁 Rewards

200 XP

Badges

  • 👑 CMStyle Her0 — completed the full zer0-to-her0 campaign
  • 🏰 Castle Raiser — deployed a live Jekyll site on GitHub Pages
  • 🪄 The Enchanter — put AI automation to work on your own site

Skills unlocked

  • 🛠️ VS Code + Git + Jekyll as one integrated toolchain
  • 🌐 Deploying and theming a static site on GitHub Pages
  • 🤖 AI-assisted content, documentation, and link-health automation

Features unlocked

  • The sequel campaign: The Self-Operating Website

🕸️ Quest Network

Loading quest graph…

Click a node to open the quest · ⌘/Ctrl-click for a new tab · drag to reposition · scroll to zoom.