288 lines
16 KiB
HTML
288 lines
16 KiB
HTML
<!doctype html><html lang="en-us">
|
||
<head>
|
||
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
<meta name="generator" content="Qubt theme for Hugo" />
|
||
|
||
|
||
|
||
<title>haxala1r</title>
|
||
<meta name="title" content="haxala1r" />
|
||
|
||
|
||
|
||
<meta name="author" content="Emin Arslan" />
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<link type="text/css" rel="stylesheet" href="/css/main.bundle.min.955b22a3fcff20511a11d9c7fdac7dd57e8293ee16e4d4ca0d6ab737f4895c3017582739cfd1f17a7c3feae23b42a8f4b01d7052fa2bc03a1430fa0669bf2d60.css" integrity="sha512-lVsio/z/IFEaEdnH/ax91X6Ck+4W5NTKDWq3N/SJXDAXWCc5z9Hxenw/6uI7Qqj0sB1wUvorwDoUMPoGab8tYA==" />
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<script defer src="/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js" integrity="sha512-RlfJYskLtCJB49ucADMqxEov9qkBZUuCSLTi9LWGVx/Sqmctyt9yjW8hNbDqYIjyHRz1MCtMroVX4Fk/cAgdcg=="></script>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<meta property="og:url" content="http://emin.software/posts/podman-setup/">
|
||
<meta property="og:site_name" content="haxala1r">
|
||
<meta property="og:title" content="My Setup - p1">
|
||
<meta property="og:description" content="Podman In this ‘series’ I will be walking you through my process of how I host everything on this server.
|
||
When first creating this website, I just had my blog. I generated this blog using hugo: a static site generator. Hugo allowed me to focus on writing whatever I wanted in Markdown format, it would take care of converting my writing into HTML and CSS.
|
||
I had a small issue with how I wrote my code and deployed it though: whenever I made a small change to the page, I had to manually rebuild it, then upload the updated version to my server and put it in the web directory.">
|
||
<meta property="og:locale" content="en_us">
|
||
<meta property="og:type" content="article">
|
||
<meta property="article:section" content="posts">
|
||
<meta property="article:published_time" content="2024-10-25T23:11:17+03:00">
|
||
<meta property="article:modified_time" content="2024-10-25T23:11:17+03:00">
|
||
|
||
|
||
<meta name="twitter:card" content="summary">
|
||
<meta name="twitter:title" content="My Setup - p1">
|
||
<meta name="twitter:description" content="Podman In this ‘series’ I will be walking you through my process of how I host everything on this server.
|
||
When first creating this website, I just had my blog. I generated this blog using hugo: a static site generator. Hugo allowed me to focus on writing whatever I wanted in Markdown format, it would take care of converting my writing into HTML and CSS.
|
||
I had a small issue with how I wrote my code and deployed it though: whenever I made a small change to the page, I had to manually rebuild it, then upload the updated version to my server and put it in the web directory.">
|
||
|
||
|
||
<script>
|
||
|
||
if (localStorage.getItem("color-theme") === "dark" || (!("color-theme" in localStorage) && window.matchMedia("(prefers-color-scheme: dark)").matches)) {
|
||
document.documentElement.classList.add("dark");
|
||
} else {
|
||
document.documentElement.classList.remove("dark");
|
||
}
|
||
</script>
|
||
|
||
</head>
|
||
<body class="flex h-screen flex-col justify-between bg-neutral-100 dark:bg-neutral-800">
|
||
<div>
|
||
<header class="sticky top-0 z-10 bg-neutral-100 dark:bg-neutral-800">
|
||
|
||
|
||
|
||
|
||
<section class="mx-auto flex max-w-screen-xl items-center justify-between p-4">
|
||
<a href="http://emin.software/" class="flex items-center space-x-3">
|
||
|
||
<span class="self-center whitespace-nowrap text-2xl font-semibold text-slate-700 dark:text-slate-400">
|
||
haxala1r
|
||
</span>
|
||
</a>
|
||
<div class="flex flex-row space-x-8">
|
||
<nav class="hidden space-x-8 text-xl md:block" aria-label="main">
|
||
|
||
<a href="/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
|
||
Home
|
||
</a>
|
||
|
||
<a href="/about/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
|
||
About
|
||
</a>
|
||
|
||
</nav>
|
||
<button id="theme-toggle" type="button" class="rounded-lg text-sm text-slate-700 hover:text-indigo-500 dark:text-slate-400" aria-label="theme-switcher">
|
||
<svg id="theme-toggle-dark-icon" class="hidden h-6 w-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path>
|
||
</svg>
|
||
<svg id="theme-toggle-light-icon" class="hidden h-6 w-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||
<path
|
||
d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
|
||
fill-rule="evenodd"
|
||
clip-rule="evenodd"></path>
|
||
</svg>
|
||
</button>
|
||
<button id="hamburger-button" class="relative h-8 w-8 cursor-pointer text-3xl md:hidden" aria-label="hamburger-button">
|
||
<div
|
||
class="absolute top-4 -mt-0.5 h-[3px] w-8 rounded bg-slate-700 transition-all duration-500 before:absolute before:h-[3px] before:w-8 before:-translate-x-4 before:-translate-y-2.5 before:rounded before:bg-slate-700 before:transition-all before:duration-500 before:content-[''] after:absolute after:h-[3px] after:w-8 after:-translate-x-4 after:translate-y-2.5 after:rounded after:bg-slate-700 after:transition-all after:duration-500 after:content-[''] dark:bg-slate-400 before:dark:bg-slate-400 after:dark:bg-slate-400"></div>
|
||
</button>
|
||
</div>
|
||
</section>
|
||
<section id="mobile-menu" class="absolute hidden w-full origin-top animate-open-menu flex-col justify-center bg-neutral-100 text-4xl dark:bg-neutral-800">
|
||
<nav class="flex min-h-screen flex-col items-center py-8" aria-label="mobile">
|
||
|
||
<a href="/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
|
||
Home
|
||
</a>
|
||
|
||
<a href="/about/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
|
||
About
|
||
</a>
|
||
|
||
</nav>
|
||
</section>
|
||
|
||
</header>
|
||
<main>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="justify-left mx-auto mt-8 flex max-w-screen-md px-4">
|
||
<article>
|
||
<h1 class="text-4xl font-extrabold text-slate-700 dark:text-slate-200">
|
||
My Setup - p1
|
||
</h1>
|
||
<h2 class="mt-4 text-2xl text-slate-500 dark:text-slate-400">
|
||
|
||
</h2>
|
||
<div class="mb-4 mt-2 text-sm text-slate-500 dark:text-slate-400">
|
||
Oct 25, 2024 - 5 minute read
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
<span class="prose prose-slate break-words text-lg text-slate-700 dark:prose-invert prose-pre:max-w-[90vw] md:prose-pre:max-w-screen-md dark:text-slate-200">
|
||
<h1 id="podman">Podman</h1>
|
||
<p>In this ‘series’ I will be walking you through my process of how I
|
||
host everything on this server.</p>
|
||
<p>When first creating this website, I just had my blog. I generated this blog
|
||
using <a href="https://hugo.io">hugo</a>: a static site generator. Hugo allowed me to
|
||
focus on writing whatever I wanted in Markdown format, it would take care of
|
||
converting my writing into HTML and CSS.</p>
|
||
<p>I had a small issue with how I wrote my code and deployed it though: whenever I
|
||
made a small change to the page, I had to manually rebuild it, then upload the
|
||
updated version to my server and put it in the web directory.</p>
|
||
<p>This is a cumbersome process. The whole point of using hugo is to <em>focus on the
|
||
writing</em>, so having to rebuild and reupload for every typo is… not great. I
|
||
wanted to be able to do a simple <code>git push</code>, and not worry about the rest.</p>
|
||
<p>The previous “manual” approach also depends on me having already installed all
|
||
necessary software. If you have a dedicated server that you’re running yourself,
|
||
that’s probably okay, you just have to setup once, but I’m running this on a VPS
|
||
that I’m not sure I’ll keep forever. The ability to reproduce this exact setup
|
||
within minutes actually matters.</p>
|
||
<p>After reading a bit on this topic, I decided I would use podman for this. Docker would
|
||
work just as nicely (any containerization software would work, really), but I decided
|
||
on podman because it can run without a daemon and without root privilages. Also,
|
||
it has pretty neat support for kubernetes pods (which are honestly a lot more useful
|
||
than I would’ve given them credit for before I started this whole project).</p>
|
||
<p>That’s really why I’m writing this. So that you, the reader (or possibly my future self) can
|
||
understand the methodology of podman, how to create pods, run containers and configure all
|
||
of this automatically, and so that I may demonstrate and share what I’ve learnt during
|
||
this process.</p>
|
||
<h2 id="motivation">Motivation</h2>
|
||
<p>Basically, I’m already running a web server. Why shouldn’t I also host several other services
|
||
for friends and family while I’m at it? Why shouldn’t I make the entire setup reproducable?</p>
|
||
<p>Here are some of the services I wanted to self-host:
|
||
- Web server: obviously, who doesn’t want a website?
|
||
- Some git server: having my own place to show off all the things I’ve done is certainly really cool.
|
||
- Wireguard: Free VPN along with the website? sign me up.
|
||
- CI/CD: automatic testing and releases of my software is cool, and also incredibly useful because that’s
|
||
how I plan to handle the website as well.</p>
|
||
<p>Of course, there are always more things I could be self-hosting. So it makes sense to automate
|
||
the setup, and that’s where podman comes in.</p>
|
||
<h2 id="basics-of-podman">Basics of podman</h2>
|
||
<p>Before we can get to the exciting stuff, we need to go over what podman is, and how to
|
||
use it. Essentially, podman is a container engine: it lets you build and run applications in
|
||
a containerized environment. Containers are useful because they provide security,
|
||
easy setup and most importantly, reproducability.</p>
|
||
<p>I’m not going to spend any more time explaining what containers are and why they’re
|
||
good, that’s been done to death already. Right now, what matters is the actual setup,
|
||
so let’s get on with it.</p>
|
||
<p>If you’ve used docker before, you’ll feel right at home. Many commands are unchanged
|
||
from docker, making podman a suitable drop-in replacement. Some things like network
|
||
setups tend to be a little different, but that won’t matter too much right now.</p>
|
||
<p>In case you’re unfamiliar with docker, here are some basic commands:</p>
|
||
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-sh" data-lang="sh"><span style="display:flex;"><span><span style="color:#75715e"># Search for container images (on docker.io unless you configure otherwise)</span>
|
||
</span></span><span style="display:flex;"><span>$ podman search <image name>
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># Download (pull) an image from remote repo</span>
|
||
</span></span><span style="display:flex;"><span>$ podman pull <image name>
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># list the images you have pulled.</span>
|
||
</span></span><span style="display:flex;"><span>$ podman images
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># run a container.</span>
|
||
</span></span><span style="display:flex;"><span>$ podman run <image name>
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># run a container, but with a LOT of flags. I just listed the most useful ones.</span>
|
||
</span></span><span style="display:flex;"><span>$ podman run
|
||
</span></span><span style="display:flex;"><span> -i <span style="color:#75715e"># interactive, so you can e.g. run a shell in the container</span>
|
||
</span></span><span style="display:flex;"><span> -t <span style="color:#75715e"># allocates a tty. useful with -i so that shell completion etc. can work</span>
|
||
</span></span><span style="display:flex;"><span> -d <span style="color:#75715e"># opposite of -i, detach and run in the background</span>
|
||
</span></span><span style="display:flex;"><span> --port <HOST PORT>:<CONTAINER PORT> <span style="color:#75715e"># port forwarding, for when you need a server.</span>
|
||
</span></span><span style="display:flex;"><span> -v <HOST DIR>:<CONT DIR>:<FLAGS> <span style="color:#75715e"># give the container access to some directory</span>
|
||
</span></span><span style="display:flex;"><span> <image name>
|
||
</span></span><span style="display:flex;"><span> <command> <span style="color:#75715e"># ... want a shell?</span>
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># list running containers. add -a to list ALL containers, running or stopped.</span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># podman ps <-a></span>
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># stop a running container.</span>
|
||
</span></span><span style="display:flex;"><span>$ podman stop <id>
|
||
</span></span><span style="display:flex;"><span>
|
||
</span></span><span style="display:flex;"><span><span style="color:#75715e"># stopped containers don't automatically get removed. This command removes it.</span>
|
||
</span></span><span style="display:flex;"><span>$ podman rm <id>
|
||
</span></span></code></pre></div><h2 id="pods-are-nice">Pods are nice.</h2>
|
||
<p>Pods are basically just a collection of containers - multiple programs working
|
||
with each other.</p>
|
||
<p>Usually, on a server, each application <em>isn’t</em> totally separate from each other</p>
|
||
<ul>
|
||
<li>for my own usecase, I want my git server (e.g. gogs) to automatically build
|
||
and update my website whenever I push to its git repository. That means my git
|
||
server and web server can’t be <em>totally</em> separate, there’s some amount of relation.
|
||
Pods can help with this.</li>
|
||
</ul>
|
||
<p>Pods allow you to create a “pod” containing several containers, sharing resources
|
||
with each other, etc. For example, I could run a pod with nginx and gogs running
|
||
in seperate containers - then, the nginx server could act as a reverse proxy based
|
||
on host name, showing the web page on emin.software, and the git server on
|
||
git.emin.software. Nginx redirects to gogs which only binds to <em>the pod’s
|
||
localhost address</em>, so only nginx can reach it. Likewise, a database server can
|
||
be added to the pod only for the git server to use, so that it can’t be reached
|
||
from the outside the pod - and it is logically grouped along with the rest of the pod.</p>
|
||
<p>On top of this, pods can be built purely from a kubernetes-compatible configuration
|
||
file, so setting them up is relatively easy.</p>
|
||
|
||
</span>
|
||
</article>
|
||
</div>
|
||
|
||
</main>
|
||
</div>
|
||
<footer>
|
||
<div class="flex flex-col justify-center p-10">
|
||
|
||
<p class="text-center text-slate-700 dark:text-slate-400">
|
||
©
|
||
2024
|
||
Emin Arslan
|
||
</p>
|
||
|
||
|
||
|
||
|
||
|
||
<p class="text-center text-sm text-slate-700 dark:text-slate-400">
|
||
Published with <a class="hover:underline hover:decoration-indigo-500 hover:text-indigo-500" href="https://gohugo.io" target="_blank" rel="noopener noreferrer">Hugo</a> & <a class="hover:underline hover:decoration-indigo-500 hover:text-indigo-500" href="https://github.com/chrede88/qubt" target="_blank" rel="noopener noreferrer">Qubt</a>
|
||
</p>
|
||
</div>
|
||
|
||
</footer>
|
||
</body>
|
||
</html>
|