Separating my website's content from its code

My website has been open source since the beginning. Being open was the most important goal for me back when I built it (and still is now), for many reasons:

• Open source websites and projects were/are crucial for me when learning how to build things;
• I wanted my website to do the same for other devs (it has!);
• It's good as a personal project for a portfolio; You can see its code to see how I work and maybe understand a bit of how my coding brain works.

Pretty much since its inception some people have taken interest on the website, forked it, made changes to it, or maybe just dug through the code to see how I did things. That's great!

Unfortunately, there are some people that clone the website and then just remove my name, while keeping all the content on it. That's not very nice.

I'm not particularly knowledgeable (or interested, to be honest) in how all that works legally. Technically that content was part of the code, right? So it's probably not illegal or anything, just not nice.

Which is why I decided to remove the content (blog posts, work experience, resume) out of the main website repo and into a different (and private) one.

Git submodules

To do that, I figured the simplest way would be to make use of Git submodules, so that the main repo would point to this separate repo, and then use some custom CI code that would automatically fetch updates in that content repo and update my website whenever something new was published.

I started by creating a new private repo that I aptly called FantinelCMS, with just an empty README.

Then, on the main website repo, I ran this git command to add a new submodule in the "static/cms" folder:

git submodule add git@github.com/org-name/repo-name static/cms -b main

This set up a new git repo inside that folder and pulled down that empty README. So far, so good. Then, I copied over the content that was in the website repo into that newly created folder and committed it. I ran the project locally, and it was finding all the posts and stuff. Neat!

Deploying somewhere

Now, this part might vary depending on where you host your website. I host it on Vercel, and I unfortunately found out that it does not support private git submodules by default. Bummer, but fortunately I found a 3rd-party project that provides a quick command to fix for that. You just need to call that script on the "Install Command" field in the settings for your project in Vercel, and it does the magic for you.

Automating updates

Today, whenever I commit something to my website repo, it automatically gets deployed to Vercel in less than 2 minutes. However, with the content on a separate repo, that's no longer the case. Since the updates themselves are on a different repo, the website one does not know that it should update the content.

I solved this by setting up a new GitHub Action on my content repo that runs whenever the content gets updated. It will then update the website repo and commit changes to it, firing the previously-existing CI process. It worked pretty well!

How well does it work?

Well, if you're seeing this post, it means it worked well! I actually wrote this post on Obsidian, a separate app that only handles Markdown (.md) files, and is totally detached from the website code. (I intend to write about this setup in the near future).

Hopefully this makes it easier for people to fork the website (though, if you do, I highly recommend using this separate template instead) without having the work to take out my stuff from it. There's still some content here and there that's not being fed from the cms folder (like the home page), but I also plan on tackling that soon.