Infra of pwning.tech

As the admin of pwning.tech I usually get asked about how I create the diagrams for the website and how I do devops. In order to help these aspiring researchers set up their own blog website, this page intends to answer these questions.

Figure 1: An general overview of the underlying infrastructure of pwning.tech.

Diagrams (draw.io)

For the diagrams I utilize the draw.io tool. It provides a quite straightforward UI and UX, whilst allowing the user to customize their diagram to beyond the moon. The house style of pwning.tech - recognizable by the white stripes in the corners of a diagram - and its' logo are currently embedded into the diagrams by hand. This is done to export diagrams to the SVG format for SEO and UX purposes. Even the pwning.tech logo is made in draw.io and exported as an SVG, as you can inspect yourself.

The CMS (GhostCMS)

When considering different content management systems (CMS), GhostCMS popped up as one of the best ones. It provides out-of-the-box SEO optimizations and has a really nice feature rich editor. Other nice features include easy code injection at the HTML head and at the end of its' body, allowing for data-only JS and CSS customization. One of the drawbacks however is that GhostCMS is dynamic, and hence it cannot be compiled to static HTML pages out of box. Luckily, the community basically made an recursive wget script for exactly this purpose, which I utilize for deploying the site.

Local files (Nginx)

I'm using Nginx as an overlay on top of the GhostCMS website to host certain files like security.txt, since I'm working with Docker containers on the local instance. I'm a strong believer in separation of concerns, and do not approve of customizing Docker containers. Hence, I'd rather host an Nginx container whose file hosting behavior is intended and very smooth. By using this strategy I can upgrade my containers without breaking changes and having to mess with Docker or the GhostCMS code.

Deploying (Github pages)

Recently, pwning.tech switched to being deployed on Github pages as a static website. In order to pull this off, I host a local version of pwning.tech where I edit the site and write blogposts, and when I'm confident the updates are ready to go to the Github pages repository, I run the following script:

gssg --domain https://127.0.0.1 --dest ./pwning-tech-static/
cd ./pwning-tech-static/
find \( -type d -name .git -prune \) -o -type f -print0 | xargs -0 sed -i 's/127.0.0.1/pwning.tech/g'
git add . 
git commit -a
git pull
git push

Codeblock: BASH script which creates a static copy of a local website, and then pushes it to Github.

This approach has several advantages:

  • Free and highly reliable hosting
  • Better security (no backend to hack)
    • Only public content is pushed (no admin interfaces)
    • The local instance is unreachable from the outside
  • Faster response times (free CDN)
  • Basically a full response cache