When I started building my personal cybersecurity portfolio, I had no coding background. None. What I did have was motivation, curiosity, and access to free tools — GitHub, Jekyll, and a powerful assistant named ChatGPT. That’s how stevenloucks.tech was born.

But it wasn’t easy. It still isn’t. This post is a breakdown of the tools I’ve been learning — Markdown, CSS, Liquid, and more — and the real journey of making it all work (and sometimes break) with a lot of help from AI.


Markdown (.md): My Starting Point

Markdown is a plain-text writing format that turns into HTML when the site is built. It’s how I write blog posts like this, document labs, and structure content for my GitHub Pages site.

It’s beginner-friendly, but that doesn’t mean I didn’t mess it up repeatedly. I’d forget headers, miss brackets on links, or leave off front matter — and wonder why the page wouldn’t render.


CSS (.css): Making It Not Look Like 1999

CSS handles all the styling — fonts, colors, banners, buttons, cards, shadows. If Markdown is the skeleton, CSS is the wardrobe and makeup.

I wanted a clean, modern look with bold visuals, so I:

Getting that styling to cooperate across browsers (or even devices) was way harder than I expected.


One of the most painful parts was chasing down broken things — especially image icons. Half the time it was something like:

I would spend hours trying to fix a badge icon that just wouldn’t show up, only to find I’d written SecurityPlus.JPG instead of securityplus.png.


What Else I Had to Learn (Still Learning…)

HTML

I didn’t plan to write HTML, but I had to. Jekyll mixes Markdown with embedded HTML. Now I can write a basic layout, link to sections, and even customize div structures.

YAML (.yml)

This one surprised me. YAML is used for structured data in Jekyll. I store my certifications and lab metadata in _data/certifications.yml, which lets me reuse content across the site.

Liquid

Liquid is Jekyll’s templating language — I still don’t fully understand it, but I’ve figured out how to loop through YAML files and conditionally render content like my lab cards and Credly badges.

Git and Branching

Branching and merging repositories is still a work in progress. I’ve created protected branches like stable-v1 and working-copy, and I’m learning to test changes without breaking my live site. It’s not always graceful, but I’m getting there.


AI Was My Secret Weapon

I built this site in partnership with AI (ChatGPT). Without it, I would’ve been lost. I asked questions like:

Sometimes I didn’t even know the right question — just pasted my broken code and asked for help. And every time, the response helped me move forward.

But let’s be honest: AI didn’t build the site for me. I still had to learn it. I still had to:

Using AI wasn’t a shortcut. It was a learning partner — and a lifeline during late nights of trial-and-error.


Still Not Done — But Proud of What’s Here

The truth is, my site still isn’t exactly how I want it. I’m still:

But I’m proud of how far it’s come. It started as a blank GitHub repo, and now it’s a working portfolio at stevenloucks.tech, with working links, real projects, custom styling, and growing content.


If You’re Just Starting Out

Here’s what I’ve learned:

Thanks for reading. If you’re also trying to build a portfolio, feel free to reach out or follow along — I’m still figuring it out too.