1 yr. ago • 100%

What's the best approach to deploy a static website to K8s cluster from a CI pipeline?

I have a small VPS that hosts some services I use daily and I'd like to migrate that to a K8s cluster. One of the services being hosted is my personal website, built with Hugo and served by Caddy.

Right now, I have the code for my website on Codeberg and I have a CI pipeline that builds the website and uploads it to my VPS via rsync.

I want to move the website to the k8s cluster, but I have no idea how to do it "securely". What I have right now is a separate user on my VPS called deploy and it rsyncs the files to the data directory Caddy is using to serve my files.

I thought I could do the same on the k8s cluster server, but it's usually not a good idea to mount host paths with k8s unless absolutely necessary, because container escaping is an actual problem.

So far the only alternative I could think of is to change the CI pipeline to publish my website on another branch and signal it to my K8s cluster so the files should be updated, but I'd like to know what better options exist and how easy they are to setup.

21 comments

Static website? Upload to S3 via CI and serve it from there.

It'll cost cents per month.

K8s is obscene overkill.

I assume all the cloud vendors have an S3 equivalent.

13
- Why not just use cloudflare pages ? Free
  
  2
  
  Didn't know about them!
  
  I personally use GitHub pages for mine, now.
  
  4
  
  I don't like Cloudflare and I try to steer away from them.
  
  Using Codeberg/GitHub/GitLab pages was an option as well, but I wanted to have it self-hosted so I have more flexibility and I get to use and customize Caddy to my liking.
  
  1
CI pipeline build your site and docker image, deliver to a registry.

CD deploy and always pull your docker image from container registry.

6
I don’t have the answer but am curious about any advantages of using kubernetes for self-hosting a static website.

5
- I'm not using k8s just to host my website, I have other services on it as well.
  
  I know it's overkill for small stuff, but I'm running k3s and not k8s (so it's a lightweight engine). The reason I'm doing this is for learning purposes, I want to learn more about k8s and thought I could do an experiment with it on a VPS.
  
  I plan on renting another VPS and adding another node to the cluster, as it's pretty cheap (Hetzner ARM server costs around 3.8 EUR without VAT with 2 vCPUs and 4GB RAM). For example, it's much more cheaper than the VPS I have on Vultr that has 1GB RAM and 1 vCPU.
  
  4
  
  If you want to build a new container on top of nginx, that will serve a static site like a champ
  
  2
You need to start with docker.

Get your ci building a docker image of your site

Then host the docker image on a repo somewhere.

Once you have it running in a container you can easily find a “how to” for k8s.

The basics of k8s are:

A collection (or single in this case) of images form a pod (virtual machine) that pod exposes ports to a service.

The service is a single app comprised of a collection of pods (usually only one actually)

The service then needs to expose ports to an ingress (think of an ingress like a load balancer) and the ingress will take the external ports to the cluster and use some magic to forward traffic to you pod

4
- I was looking for it as well. I want to host the website using Caddy because I have a lot of config options available and I can fine tune it for my use cases.
  
  I read a tutorial about using a Hugo Docker image, but then the hosting would be done by Hugo and not Caddy itself.
  
  3
  
  look up a tutorial on “dockerfile” as you’re essentially making one that installs your app.
  
  Dockerfiles are basically “install” scripts that define how to set up a new machine with your application.
  
  You’ll want to start with a base docker image that already has 90% of what you need.
  
  look up docker hub nginx images and just create a docker file to populate your app to the nginx that’s already been installed there. Use the nginx image as your “source image” in docker.
  
  It acts like a virtual machine template to launch your own docker image
  
  3
- The docker image needs to actually host the site, so more than just files, you’ll need nginx in the image.
  
  K8s is WAY over complicated for this, it’s designed for auto scaling and self healing, but I’m assuming you’re using this as a “cool” or “learning” exercise.
  
  Helm packages for k8s are super helpful and will give you a template for all the networking pieces
  
  3
  
  That's a nice suggestion. I guess I can make the CI build a Docker image containing my website's files and then have a plugin for it to restart the pod that serves the website so it fetches the latest image.
  
  1
My advice would be to have the server running on the cluster serving the static folder mounted through a network drive in the container. Then you just need to sync the content to the drive as the last step in your CI.

Alternatively, you will need to bake the static content in the container but then you will have to host it somewhere for the closer to get.

2
- How is this different than mounting the folder with the static website using hostPath?
  
  2
  
  I imagine you are using k8s because you want to learn the platform.
  
  In a real cluster with multiple machines, you don’t know which machine will run your container (that’s the point of clusters).
  
  Do you need to host your files on a storage server and link these files to the containers through nfs.
  
  See this post for an example on his to do it.
  
  4
Thanks for the suggestions!

I ended up configuring my CI pipeline to build a Caddy docker image that ships with my website files. The pipeline is also publishing the container image to the Codeberg registry and I apply the new image repo and tag to the Caddy Helm chart I found on ArtifactHub.

The only thing that's left is to setup the CI to automatically restart the pod when a new image is pushed, so it will always have the latest version.

It was easier than expected and I had a few issues like my stylesheets not being applied and image files not rendering, but it was solved by changing the pathType field on the ingress configuration to Prefix.

2

Acronyms, initialisms, abbreviations, contractions, and other phrases which expand to something larger, that I've seen in this thread:

Fewer Letters	More Letters
Git	Popular version control system, primarily for code
HTTP	Hypertext Transfer Protocol, the Web
VPS	Virtual Private Server (opposed to shared hosting)
k8s	Kubernetes container management package
nginx	Popular HTTP server

4 acronyms in this thread; the most compressed thread commented on today has 6 acronyms.

[Thread #149 for this sub, first seen 19th Sep 2023, 12:35] [FAQ] [Full list] [Contact] [Source code]

Cloudflare Pages. Don't waste money

0

You've viewed 21 comments.