haxala1r/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Big update
Some checks failed
Build & Deploy / build-or-sth (push) Failing after 2m39s
Details

Browse Source
This commit is contained in:
Emin Arslan 2024-11-16 15:11:00 +03:00
parent b249ce9d91
commit 95086af257
18 changed files with 41 additions and 1195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
.gitea/workflows/main-build.yaml Normal file
View File

@ -0,0 +1,14 @@
name: Build & Deploy
on:
push:
branches:
- main
jobs:
build-or-sth:
runs-on: ubuntu-latest
steps:
- run: echo "hi!"
- name: Get hugo
run: apt install hugo

6
.gitignore vendored
View File

@ -1,5 +1,7 @@
/resources/_gen/
/assets/jsconfig.json
resources/_gen/
assets/jsconfig.json
public/*
hugo_stats.json
.hugo_build.lock

24
content/posts/setup_p1.md
View File

@ -138,7 +138,7 @@ services:
- 3000:80
```
Or you could even have *two* servers, like, a gogs and a web server!
Or you could even have *two* servers, like, a Gogs and a web server!
```yaml
services:
@ -162,6 +162,28 @@ It just works!
Of course, you can add volumes to tie it all, and 'secrets' to manage sensitive
files (like keys and certificates). I won't go into those here though.
## Automation
Yeah, okay. I like automating, I know I talked big game up in the introduction.
It's obvious. I just love it when things do themselves instead of me having to
do them. I remember wanting to make a robot to do my homework when I was a kid.
I still want to do that. Of course, the fact that it would be easier to just do
my homework is irrelevant. It was always irrelevant. It's not about doing less
work, it's about the ***principle***.
Anyway, so the point is that I want to automate the process of deploying from a
git repository directly to my blog. Thankfully, gitea provides a nice feature
for Continuous Integration (CI), gitea actions. It's similar to GitHub actions.
Essentially, you install gitea normally, then register an act_runner to it with
a registration token you get from the instance. I use docker compose and the
gitea/act_runner image to automate this step as well.
Once a runner is registered, you can write a workflow file, which tells the
runner what it should do once you push some changes. In my case, for example,
this would be building the website using hugo, then putting the files into the
web directory.
# Conclusion
Docker and Docker Compose are a lot more useful than my younger self would have

176
public/404.html
View File

@ -1,176 +0,0 @@
<!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&#43;4W5NTKDWq3N/SJXDAXWCc5z9Hxenw/6uI7Qqj0sB1wUvorwDoUMPoGab8tYA==" />
<script defer src="/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js" integrity="sha512-RlfJYskLtCJB49ucADMqxEov9qkBZUuCSLTi9LWGVx/Sqmctyt9yjW8hNbDqYIjyHRz1MCtMroVX4Fk/cAgdcg=="></script>
<meta property="og:url" content="https://emin.software/404.html">
<meta property="og:site_name" content="haxala1r">
<meta property="og:title" content="404 Page not found">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="404 Page not found">
<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="https://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>
<a href="/posts/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</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>
<a href="/posts/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</a>
</nav>
</section>
</header>
<main>
<div class="mb-2 mt-24 flex flex-col items-center justify-center md:mt-48">
<h1 class="text-3xl font-extrabold text-slate-700 md:text-8xl dark:text-slate-200">Page not found!</h1>
<div class="m-4 flex flex-row justify-center space-x-4">
<a href="/" class="rounded-full bg-slate-700 px-3 py-1 text-slate-200 hover:text-indigo-500 dark:bg-slate-200 dark:text-slate-700">
Home
</a>
<a href="/about/" class="rounded-full bg-slate-700 px-3 py-1 text-slate-200 hover:text-indigo-500 dark:bg-slate-200 dark:text-slate-700">
About
</a>
<a href="/posts/" class="rounded-full bg-slate-700 px-3 py-1 text-slate-200 hover:text-indigo-500 dark:bg-slate-200 dark:text-slate-700">
Posts
</a>
</div>
</div>
</main>
</div>
<footer>
<div class="flex flex-col justify-center p-10">
<p class="text-center text-slate-700 dark:text-slate-400">
&copy;
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>

BIN
public/Emin-Arslan_hu13852530772249569318.webp
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 45 KiB

214
public/about/index.html
View File

@ -1,214 +0,0 @@
<!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&#43;4W5NTKDWq3N/SJXDAXWCc5z9Hxenw/6uI7Qqj0sB1wUvorwDoUMPoGab8tYA==" />
<script defer src="/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js" integrity="sha512-RlfJYskLtCJB49ucADMqxEov9qkBZUuCSLTi9LWGVx/Sqmctyt9yjW8hNbDqYIjyHRz1MCtMroVX4Fk/cAgdcg=="></script>
<meta property="og:url" content="https://emin.software/about/">
<meta property="og:site_name" content="haxala1r">
<meta property="og:title" content="About">
<meta property="og:description" content="Hi, I’m Emin!
I am a second year Computer Engineering student at Izmir University of Economics. I like all things programming and computers.
I mostly do systems programming - I feel most at home when I use C&#43;&#43; or C, though I’ve used Rust, Java and many other languages to varying degrees. I also had a phase when I was really into Common Lisp. Seriously, using a language with true macros is an entirely different experience.">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="article">
<meta property="article:published_time" content="2024-10-24T23:17:52+03:00">
<meta property="article:modified_time" content="2024-10-24T23:17:52+03:00">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="About">
<meta name="twitter:description" content="Hi, I’m Emin!
I am a second year Computer Engineering student at Izmir University of Economics. I like all things programming and computers.
I mostly do systems programming - I feel most at home when I use C&#43;&#43; or C, though I’ve used Rust, Java and many other languages to varying degrees. I also had a phase when I was really into Common Lisp. Seriously, using a language with true macros is an entirely different experience.">
<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="https://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>
<a href="/posts/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</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>
<a href="/posts/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</a>
</nav>
</section>
</header>
<main>
<div class="mx-auto mb-2 mt-12 flex max-w-screen-xl flex-col items-center justify-center">
<div class="relative w-48">
<img class="mb-2 h-48 w-48 rounded-full" width="192" height="192" alt="Emin Arslan" src="/Emin-Arslan_hu13852530772249569318.webp" />
</div>
<h1 class="text-center text-4xl font-extrabold text-slate-700 dark:text-slate-200">
Emin Arslan
</h1>
<div class="mt-4 flex flex-wrap items-center justify-center">
</div>
</div>
<div class="justify-left mx-auto mt-8 flex max-w-screen-lg px-4">
<article>
<h1 class="mb-4 text-4xl font-extrabold text-slate-700 dark:text-slate-200">Biography</h1>
<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">
<p>Hi, I&rsquo;m Emin!</p>
<p>I am a second year Computer Engineering student at Izmir University of
Economics. I like all things programming and computers.</p>
<p>I mostly do systems programming - I feel most at home when I use C++ or
C, though I&rsquo;ve used Rust, Java and many other languages to varying
degrees. I also had a phase when I was <em>really</em> into Common Lisp.
Seriously, using a language with true macros is an entirely different
experience.</p>
<p>This website exists to be my blog/toy. It&rsquo;s hosted on a VPS, so that I
can practice my hosting/web skills. I use <a href="https://gohugo.io/">Hugo</a>
with the <a href="https://themes.gohugo.io/themes/qubt/">Qubt</a> theme to
generate pages from my content. I think it looks pretty good, check
them out.</p>
<p>Hopefully I&rsquo;ll post a bit more on here soon.</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">
&copy;
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>

3
public/ai.txt
View File

@ -1,3 +0,0 @@
User-Agent: *
Disallow: *
Disallow: /

11
public/categories/index.xml
View File

@ -1,11 +0,0 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Categories on haxala1r</title>
<link>https://emin.software/categories/</link>
<description>Recent content in Categories on haxala1r</description>
<generator>Hugo</generator>
<language>en-us</language>
<atom:link href="https://emin.software/categories/index.xml" rel="self" type="application/rss+xml" />
</channel>
</rss>

1
public/css/main.bundle.min.955b22a3fcff20511a11d9c7fdac7dd57e8293ee16e4d4ca0d6ab737f4895c3017582739cfd1f17a7c3feae23b42a8f4b01d7052fa2bc03a1430fa0669bf2d60.css
View File

File diff suppressed because one or more lines are too long

1
public/healthcheck.json
View File

@ -1 +0,0 @@
{ "status": "ok" }

187
public/index.html
View File

@ -1,187 +0,0 @@
<!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&#43;4W5NTKDWq3N/SJXDAXWCc5z9Hxenw/6uI7Qqj0sB1wUvorwDoUMPoGab8tYA==" />
<script defer src="/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js" integrity="sha512-RlfJYskLtCJB49ucADMqxEov9qkBZUuCSLTi9LWGVx/Sqmctyt9yjW8hNbDqYIjyHRz1MCtMroVX4Fk/cAgdcg=="></script>
<meta property="og:url" content="https://emin.software/">
<meta property="og:site_name" content="haxala1r">
<meta property="og:title" content="haxala1r">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="haxala1r">
<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="https://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>
<a href="/posts/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</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>
<a href="/posts/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</a>
</nav>
</section>
</header>
<main>
<div class="flex items-center justify-center">
<div class="mt-auto flex h-[75vh] flex-col items-center justify-center">
<div class="relative w-48">
<img class="mb-2 h-48 w-48 rounded-full" width="192" height="192" alt="Emin Arslan" src="/Emin-Arslan_hu13852530772249569318.webp" />
</div>
<h1 class="text-center text-4xl font-extrabold text-slate-700 dark:text-slate-200">
Emin Arslan
</h1>
<h2 class="mt-4 text-center text-xl text-slate-600 dark:text-slate-400">
Welcome to my personal blog :)
</h2>
<div class="mt-4 flex flex-wrap items-center justify-center">
</div>
</div>
</div>
</main>
</div>
<footer>
<div class="flex flex-col justify-center p-10">
<p class="text-center text-slate-700 dark:text-slate-400">
&copy;
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>

26
public/index.xml
View File

@ -1,26 +0,0 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>haxala1r</title>
<link>https://emin.software/</link>
<description>Recent content on haxala1r</description>
<generator>Hugo</generator>
<language>en-us</language>
<lastBuildDate>Fri, 25 Oct 2024 23:11:17 +0300</lastBuildDate>
<atom:link href="https://emin.software/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>My Setup </title>
<link>https://emin.software/posts/setup_p1/</link>
<pubDate>Fri, 25 Oct 2024 23:11:17 +0300</pubDate>
<guid>https://emin.software/posts/setup_p1/</guid>
<description>I go over the things I&amp;rsquo;ve learned about docker, and how I&amp;rsquo;ve used it to host my website.</description>
</item>
<item>
<title>About</title>
<link>https://emin.software/about/</link>
<pubDate>Thu, 24 Oct 2024 23:17:52 +0300</pubDate>
<guid>https://emin.software/about/</guid>
<description>Hi, I&amp;rsquo;m Emin!&#xA;I am a second year Computer Engineering student at Izmir University of Economics. I like all things programming and computers.&#xA;I mostly do systems programming - I feel most at home when I use C++ or C, though I&amp;rsquo;ve used Rust, Java and many other languages to varying degrees. I also had a phase when I was really into Common Lisp. Seriously, using a language with true macros is an entirely different experience.</description>
</item>
</channel>
</rss>

1
public/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js
View File

@ -1 +0,0 @@
const initSite=()=>{const t=document.getElementById("hamburger-button"),e=document.getElementById("mobile-menu"),n=()=>{e.classList.toggle("hidden"),e.classList.toggle("flex"),t.classList.toggle("toggle-btn")};t.addEventListener("click",n),e.addEventListener("click",n)};document.addEventListener("DOMContentLoaded",initSite);var themeToggleBtn,themeToggleDarkIcon=document.getElementById("theme-toggle-dark-icon"),themeToggleLightIcon=document.getElementById("theme-toggle-light-icon");localStorage.getItem("color-theme")==="dark"||!("color-theme"in localStorage)&&window.matchMedia("(prefers-color-scheme: dark)").matches?themeToggleLightIcon.classList.remove("hidden"):themeToggleDarkIcon.classList.remove("hidden"),themeToggleBtn=document.getElementById("theme-toggle"),themeToggleBtn.addEventListener("click",function(){themeToggleDarkIcon.classList.toggle("hidden"),themeToggleLightIcon.classList.toggle("hidden"),localStorage.getItem("color-theme")?localStorage.getItem("color-theme")==="light"?(document.documentElement.classList.add("dark"),localStorage.setItem("color-theme","dark")):(document.documentElement.classList.remove("dark"),localStorage.setItem("color-theme","light")):document.documentElement.classList.contains("dark")?(document.documentElement.classList.remove("dark"),localStorage.setItem("color-theme","light")):(document.documentElement.classList.add("dark"),localStorage.setItem("color-theme","dark"))})

201
public/posts/index.html
View File

@ -1,201 +0,0 @@
<!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&#43;4W5NTKDWq3N/SJXDAXWCc5z9Hxenw/6uI7Qqj0sB1wUvorwDoUMPoGab8tYA==" />
<script defer src="/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js" integrity="sha512-RlfJYskLtCJB49ucADMqxEov9qkBZUuCSLTi9LWGVx/Sqmctyt9yjW8hNbDqYIjyHRz1MCtMroVX4Fk/cAgdcg=="></script>
<meta property="og:url" content="https://emin.software/posts/">
<meta property="og:site_name" content="haxala1r">
<meta property="og:title" content="Blog">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Blog">
<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="https://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>
<a href="/posts/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</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>
<a href="/posts/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</a>
</nav>
</section>
</header>
<main>
<div class="justify-left mx-auto mt-8 flex max-w-screen-xl px-4">
<article>
<h1 class="text-4xl font-extrabold text-slate-700 dark:text-slate-200">
Blog
</h1>
<div class="mt-2 text-lg text-slate-500 dark:text-slate-400">
</div>
</article>
</div>
<div class="mx-auto max-w-screen-xl">
<div class="mt-8 grid grid-flow-row grid-cols-1 justify-items-center gap-8 px-4 lg:grid-cols-2">
<a href="/posts/setup_p1/">
<div class="flex h-full max-h-80 w-full max-w-2xl flex-row rounded-xl bg-neutral-300 bg-clip-border text-slate-400 shadow-md dark:bg-neutral-700">
<div class="flex flex-col justify-between p-6">
<div>
<h4 class="mb-2 line-clamp-2 text-base font-semibold text-slate-700 antialiased md:text-2xl dark:text-slate-200">
My Setup
</h4>
<p class="mb-4 line-clamp-6 text-base text-slate-500 dark:text-slate-400">
I go over the things I&rsquo;ve learned about docker, and how I&rsquo;ve used it to host my website.
</p>
</div>
<div class="flex flex-row justify-between">
<div class="flex items-center -space-x-3">
</div>
<div class="p-3 text-xs text-slate-500 dark:text-slate-400">
Oct 25, 2024
</div>
</div>
</div>
</div>
</a>
</div>
</div>
</main>
</div>
<footer>
<div class="flex flex-col justify-center p-10">
<p class="text-center text-slate-700 dark:text-slate-400">
&copy;
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>

19
public/posts/index.xml
View File

@ -1,19 +0,0 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Blog on haxala1r</title>
<link>https://emin.software/posts/</link>
<description>Recent content in Blog on haxala1r</description>
<generator>Hugo</generator>
<language>en-us</language>
<lastBuildDate>Fri, 25 Oct 2024 23:11:17 +0300</lastBuildDate>
<atom:link href="https://emin.software/posts/index.xml" rel="self" type="application/rss+xml" />
<item>
<title>My Setup </title>
<link>https://emin.software/posts/setup_p1/</link>
<pubDate>Fri, 25 Oct 2024 23:11:17 +0300</pubDate>
<guid>https://emin.software/posts/setup_p1/</guid>
<description>I go over the things I&amp;rsquo;ve learned about docker, and how I&amp;rsquo;ve used it to host my website.</description>
</item>
</channel>
</rss>

320
public/posts/setup_p1/index.html
View File

@ -1,320 +0,0 @@
<!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&#43;4W5NTKDWq3N/SJXDAXWCc5z9Hxenw/6uI7Qqj0sB1wUvorwDoUMPoGab8tYA==" />
<script defer src="/js/main.bundle.min.4657c962c90bb42241e3db9c00332ac44a2ff6a901654b8248b4e2f4b586571fd2aa672dcadf728d6f2135b0ea6088f21d1cf5302b4cae8557e0593f70081d72.js" integrity="sha512-RlfJYskLtCJB49ucADMqxEov9qkBZUuCSLTi9LWGVx/Sqmctyt9yjW8hNbDqYIjyHRz1MCtMroVX4Fk/cAgdcg=="></script>
<meta property="og:url" content="https://emin.software/posts/setup_p1/">
<meta property="og:site_name" content="haxala1r">
<meta property="og:title" content="My Setup ">
<meta property="og:description" content="I go over the things I’ve learned about docker, and how I’ve used it to host my website.">
<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 ">
<meta name="twitter:description" content="I go over the things I’ve learned about docker, and how I’ve used it to host my website.">
<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="https://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>
<a href="/posts/" class="px-3 py-2 text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</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>
<a href="/posts/" class="px-3 py-2 text-center text-slate-700 hover:text-indigo-500 md:p-0 dark:text-slate-400">
Posts
</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
</h1>
<h2 class="mt-4 text-2xl text-slate-500 dark:text-slate-400">
Containers! Docker!
</h2>
<div class="mb-4 mt-2 text-sm text-slate-500 dark:text-slate-400">
Oct 25, 2024 - 6 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="my-setup">My Setup</h1>
<p>In this &lsquo;series&rsquo; I will be walking you through my process of how I
host everything on this server.</p>
<p>I&rsquo;m currently running, on top of <a href="https://emin.software">my blog</a>, a <a href="https://git.emin.software">gogs
instance</a>.</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 zip and reupload for every typo is&hellip; not great. I
wanted to be able to do a simple <code>git push</code>, and not worry about the rest.</p>
<p>The &ldquo;manual&rdquo; approach also depends on me having already installed all
necessary software. If you have a dedicated server that you&rsquo;re running yourself,
that&rsquo;s probably okay, you just have to setup once, but I&rsquo;m running this on a VPS
that I&rsquo;m not sure I&rsquo;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 docker for this. Podman
would work just as nicely (any containerization software would work, really),
but I decided on docker because it&rsquo;s been the standard for a while now</p>
<h2 id="motivation">Motivation</h2>
<p>Basically, I&rsquo;m already running a web server. Why shouldn&rsquo;t I also host several
other services for friends and family while I&rsquo;m at it? Why shouldn&rsquo;t I make the
entire setup reproducible?</p>
<p>Here are some of the services I wanted to self-host:</p>
<ul>
<li>Web server: obviously, who doesn&rsquo;t want a website?</li>
<li>Some git server: having my own place to show off all the things I&rsquo;ve done is
certainly really cool. For this, something like <a href="https://about.gitea.com/">Gitea</a>
would normally be great. I went with <a href="https://gogs.io/">Gogs</a> instead, because
it is far more lightweight.</li>
<li>Wireguard: Free VPN along with the website? sign me up.</li>
<li>CI/CD: automatic testing and releases of my software is cool, and also
incredibly useful.</li>
</ul>
<p>Of course, there are always more things I could be self-hosting. So it makes
sense to automate the setup, and that&rsquo;s where docker comes in.</p>
<h2 id="basics-of-docker">Basics of docker</h2>
<p>Before we can get to the exciting stuff, we need to go over what docker is, and how to
use it. Essentially, docker 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, reproducibility.</p>
<p>I&rsquo;m not going to spend any more time explaining what containers are and why they&rsquo;re
good, that&rsquo;s been done to death already. Right now, what matters is the actual setup,
so let&rsquo;s get on with it.</p>
<p>If you&rsquo;ve used docker before, you&rsquo;ll feel right at home. Many commands are unchanged
from docker, making docker a suitable drop-in replacement. Some things like network
setups tend to be a little different, but that won&rsquo;t matter too much right now.</p>
<p>In case you&rsquo;re unfamiliar with docker, here are some basic commands (run these
either as root, or as a user in the <code>docker</code> group):</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>$ docker search &lt;image name&gt;
</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>$ docker pull &lt;image name&gt;
</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>$ docker 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>$ docker run &lt;image name&gt;
</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>$ docker 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 &lt;HOST PORT&gt;:&lt;CONTAINER PORT&gt; <span style="color:#75715e"># port forwarding, for when you need a server.</span>
</span></span><span style="display:flex;"><span> -v &lt;HOST DIR&gt;:&lt;CONT DIR&gt;:&lt;FLAGS&gt; <span style="color:#75715e"># give the container access to some directory</span>
</span></span><span style="display:flex;"><span> &lt;image name&gt;
</span></span><span style="display:flex;"><span> &lt;command&gt; <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>$ docker ps &lt;-a&gt;
</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>$ docker stop &lt;id&gt;
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># stopped containers don&#39;t automatically get removed. This command removes it.</span>
</span></span><span style="display:flex;"><span>$ docker rm &lt;id&gt;
</span></span></code></pre></div><h2 id="compose-is-nice">Compose is nice.</h2>
<p>Docker compose is a nice way to essentially &ldquo;group together&rdquo; some containers,
and ship them in an easy way.</p>
<p>Usually, on a server, each application <em>isn&rsquo;t</em> totally separate from each other</p>
<ul>
<li>for my own use case, 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&rsquo;t be <em>totally</em> separate, there&rsquo;s some amount of
relation.</li>
</ul>
<p>At the same time&hellip; I don&rsquo;t really want to set up both containers, then their
volumes, and their ports etc. by hand. Sure I could stick it in a shell script,
but that&rsquo;s hardly elegant.</p>
<p>Docker compose helps with this: you can create a
<code>compose.yaml</code> file, and define containers, ports, volumes, secrets all inside
this file. Then, when you run <code>docker compose up</code> this configuration is read,
and all of it is processed as you would want it to.</p>
<p>e.g you might have this for starting a web server on port 3000:</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-yaml" data-lang="yaml"><span style="display:flex;"><span><span style="color:#f92672">services</span>:
</span></span><span style="display:flex;"><span> <span style="color:#f92672">web</span>:
</span></span><span style="display:flex;"><span> <span style="color:#f92672">image</span>: <span style="color:#e6db74">&#34;nginx&#34;</span>
</span></span><span style="display:flex;"><span> <span style="color:#f92672">ports</span>:
</span></span><span style="display:flex;"><span> - <span style="color:#ae81ff">3000</span>:<span style="color:#ae81ff">80</span>
</span></span></code></pre></div><p>Or you could even have <em>two</em> servers, like, a gogs and a web server!</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-yaml" data-lang="yaml"><span style="display:flex;"><span><span style="color:#f92672">services</span>:
</span></span><span style="display:flex;"><span> <span style="color:#f92672">web</span>:
</span></span><span style="display:flex;"><span> <span style="color:#f92672">image</span>: <span style="color:#e6db74">&#34;nginx&#34;</span>
</span></span><span style="display:flex;"><span> <span style="color:#f92672">ports</span>:
</span></span><span style="display:flex;"><span> - <span style="color:#ae81ff">80</span>:<span style="color:#ae81ff">80</span>
</span></span><span style="display:flex;"><span> <span style="color:#f92672">gogs-haha</span>:
</span></span><span style="display:flex;"><span> <span style="color:#f92672">image</span>: <span style="color:#e6db74">&#34;gogs/gogs&#34;</span>
</span></span><span style="display:flex;"><span> <span style="color:#f92672">ports</span>:
</span></span><span style="display:flex;"><span> - <span style="color:#ae81ff">3000</span>:<span style="color:#ae81ff">3000</span>
</span></span><span style="display:flex;"><span> - <span style="color:#ae81ff">3022</span>:<span style="color:#ae81ff">22</span>
</span></span></code></pre></div><p>See how we got multiple services to run, very very easily? Isn&rsquo;t that just
really nice? You can just keep adding stuff. And compose even sets up dns for
these containers! That means, for example, you can have your web server act as
a reverse proxy by having it access http://gogs-haha:3000 in the above config!
It just works!</p>
<p>Of course, you can add volumes to tie it all, and &lsquo;secrets&rsquo; to manage sensitive
files (like keys and certificates). I won&rsquo;t go into those here though.</p>
<h1 id="conclusion">Conclusion</h1>
<p>Docker and Docker Compose are a lot more useful than my younger self would have
given them credit for. It was really fun learning about them, and hopefully I&rsquo;ll
use this knowledge in the future.</p>
<p>Thank you for reading.</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">
&copy;
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>

21
public/sitemap.xml
View File

@ -1,21 +0,0 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>https://emin.software/posts/</loc>
<lastmod>2024-10-25T23:11:17+03:00</lastmod>
</url><url>
<loc>https://emin.software/</loc>
<lastmod>2024-10-25T23:11:17+03:00</lastmod>
</url><url>
<loc>https://emin.software/posts/setup_p1/</loc>
<lastmod>2024-10-25T23:11:17+03:00</lastmod>
</url><url>
<loc>https://emin.software/about/</loc>
<lastmod>2024-10-24T23:17:52+03:00</lastmod>
</url><url>
<loc>https://emin.software/categories/</loc>
</url><url>
<loc>https://emin.software/tags/</loc>
</url>
</urlset>

11
public/tags/index.xml
View File

@ -1,11 +0,0 @@
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Tags on haxala1r</title>
<link>https://emin.software/tags/</link>
<description>Recent content in Tags on haxala1r</description>
<generator>Hugo</generator>
<language>en-us</language>
<atom:link href="https://emin.software/tags/index.xml" rel="self" type="application/rss+xml" />
</channel>
</rss>