updated texts on main and about page; moved links and contact info to about page

This commit is contained in:
2026-02-02 19:16:58 +01:00
parent 20cf98c375
commit c76f6017a9
8 changed files with 126 additions and 64 deletions

View File

@@ -26,7 +26,6 @@
<h6>Content</h6>
<a href="/projects">Projects</a>
<a href="/blog">Blog</a>
<!-- <a href="/garden">Digital Garden</a> -->
</div>
<div class="content-box">
<h6>Meta</h6>

View File

@@ -140,7 +140,7 @@
--media-width: 80%;
/* page sizing */
--page-width: 1000px;
--page-width: 900px;
--screen-width-mobile: 800px;
--margin-content-side: 24px;
@@ -341,6 +341,12 @@
image-rendering: pixelated;
}
.small-supertext {
font-size: 0.7rem;
line-height: 0.7rem;
vertical-align: super;
}
/* #region Lists (ul and LinkList) */
.list, ul {
display: flex;

View File

@@ -1,15 +1,11 @@
<script lang="ts">
import { onMount } from "svelte";
import Content from "$lib/viewport/content.svelte";
import GamedevWebring from "$lib/webrings/gamedev.svelte";
import Gallery, { type GalleryEntry } from "$lib/lists/gallery.svelte";
import LinkList from "$lib/lists/link-list.svelte";
import { posts as devlogPosts } from "./projects/projectn5/devlog/posts";
import { posts as blogPosts } from "./blog/posts";
let meImg: string = $state("common/me/a.webp");
let latestDevlogDate = devlogPosts[0].post.date;
let latestBlogDate = blogPosts[0].post.date;
@@ -43,20 +39,6 @@
link: "//files.denizk0461.dev/",
},
];
onMount(() => {
setPicture();
});
function getRandom(max: number): number {
return Math.floor(Math.random() * max);
}
let setPicture = function() {
var pictures = ["a", "b", "c", "e"];
var selectedPicture = pictures[getRandom(pictures.length)];
meImg = "common/me/" + selectedPicture + ".webp";
};
</script>
<svelte:head>
@@ -69,39 +51,33 @@
<hr>
<h3>about ↬<img id="me-img" class="me-img" title="hi there" src={meImg} alt="Deniz, the website developer, small and pixelated">↫ me </h3>
<p>Hi! I'm Deniz. I'm a programmer, sometimes a music producer, and student from Northern Germany. Welcome to my webpage! I mainly share my projects here. Check them out the devlog of the game I'm working on especially!</p>
<h3>where to find me</h3>
<LinkList entries={[
{
icon: "icons/bluesky.svg",
text: "Bluesky",
link: "https://bsky.app/profile/denizk0461.dev",
},
{
icon: "icons/codeberg.svg",
text: "Codeberg",
link: "https://codeberg.org/denizk0461",
},
{
icon: "icons/github.svg",
text: "GitHub",
link: "https://github.com/denizk0461",
},
]}/>
<div>
<img class="me-img pixelated-img" src="me.webp" alt="Pixelated mirror selfie of the website creator wearing a green shirt, fitting the website theme. The face is obscured." title="hi.">
<p>Hi! I'm Deniz (he/him/they). I'm a hobbyist programmer based in 🇩🇪 Northern Germany who does coding, 3D modelling, and sometimes music too. I am also studying to become a secondary school teacher. Welcome to my webpage!</p>
<p>Here I publish my projects in programming, electronics (Arduino, Raspberry Pi etc.), and gamedev specifically, but I also set up a blog to talk about random things on my mind. Feel free to explore.</p>
<p>This place is a constant work-in-progress while I try to keep URLs intact, a lot of stuff is being modified and moved around! If anything's <a href="/blog/2026/0131">broken</a>, please do let me know.</p>
</div>
<div class="webring-container">
<GamedevWebring />
</div>
<Gallery entries={galleryEntries} />
</Content>
<style>
.me-img {
width: 32px;
display: inline-block;
width: 110px;
min-width: 110px;
/* margin-top: 12px; */
float: left;
margin-right: 12px;
}
.webring-container {
display: flex;
flex-direction: row;
align-items: center;
}
.gradient-title {

View File

@@ -6,13 +6,41 @@
let favouriteAlbums: LinkEntry[] = [
{
text: "acloudyskye <i>This Won't Be The Last Time</i>",
text: "acloudyskye <i>This Won't Be The Last Time</i> (placeholder for all albums Skye has made)",
link: "https://acloudyskye.bandcamp.com/album/this-wont-be-the-last-time",
},
{
text: "Avicii <i>True</i> (first album I ever bought a physical copy of)",
link: "https://en.wikipedia.org/wiki/True_(Avicii_album)",
},
{
text: "bitbird artists <i>create together vol. 3</i> (amazing compilation)",
link: "https://bitbird.bandcamp.com/album/create-together-vol-3",
},
{
text: "brakence <i>hypochondriac</i>",
link: "https://soundcloud.com/brakence/sets/hypochondriac-4",
},
{
text: "femtanyl <i>CHASER</i>",
link: "https://femtanyl.bandcamp.com/album/chaser",
},
{
text: "Frost Children <i>SISTER</i>",
link: "https://frostchildren.bandcamp.com/album/sister",
},
{
text: "Jane Remover <i>Frailty</i>",
link: "https://janeremover.bandcamp.com/album/frailty-2",
},
{
text: "Jane Remover <i>Census Designated</i>",
link: "https://janeremover.bandcamp.com/album/census-designated",
},
{
text: "Jaron <i>it's hard to see color [When You're So Impossibly Far Away*]</i>",
link: "https://jaronsteele.bandcamp.com/album/its-hard-to-see-color-when-youre-so-impossibly-far-away",
},
{
text: "Jaron <i>LIGHTYEARS</i>",
link: "https://jaronsteele.bandcamp.com/album/lightyears",
@@ -21,6 +49,14 @@
text: "kmoe <i>K1</i>",
link: "https://kmoethekid.bandcamp.com/album/k1",
},
{
text: "leroy <i>Grave Robbing</i>",
link: "https://soundcloud.com/c0ncernn/sets/nonstop",
},
{
text: "Ninajirachi <i>I Love My Computer</i>",
link: "https://ninajirachi.bandcamp.com/album/i-love-my-computer",
},
{
text: "underscores <i>fishmonger</i>",
link: "https://underscores.bandcamp.com/album/fishmonger",
@@ -29,6 +65,33 @@
text: "venturing <i>Ghostholding</i>",
link: "https://janeremover.bandcamp.com/album/ghostholding",
},
{
text: "xaev <i>TO-THE-CORE_153BPM</i>",
link: "https://xaev.bandcamp.com/album/to-the-core-153bpm",
},
];
let links: LinkEntry[] = [
{
text: "Mail: denizk0461@mailbox.org",
link: "mailto:denizk0461@mailbox.org",
},
{
text: "Bluesky",
link: "https://bsky.app/profile/denizk0461.dev",
},
{
text: "Codeberg",
link: "https://codeberg.org/denizk0461",
},
{
text: "GitHub",
link: "https://github.com/denizk0461",
},
{
text: "Printables",
link: "https://www.printables.com/@denizk0461",
},
];
function getYearsSinceDay(day: Date): number {
@@ -47,7 +110,7 @@
<Content>
<Banner2
title="About"
banner="/common/me/b.webp"
banner="/me.webp"
bannerAlt="Mirror picture of me, pixelated beyond recognition"
subtitle="If you'd like to learn more about me and my website"
pixelated />
@@ -56,47 +119,65 @@
<p>Hi there! I'm Deniz (he/him/they). Welcome to my website!</p>
<p>On here, I share my programming projects, but also a couple of other creative works. Here you can find out a little more about me!</p>
<p>If you found this page, you may be interested in further information. And further information you shall get! I wrote a little bit about myself as well as how I made this website down below.</p>
<h2 id="who">Who are you?</h2>
<h2 id="who">About me</h2>
<p>I'm a {age}-year-old living in the north of Germany. I like video games, electronic music, and programming, though I am no pro (languages I know, in descending order of proficiency: <code>GDScript</code>, <code>Kotlin</code>, <code>Java</code>, <code>Python</code>, <code>TypeScript</code>, and a little bit of <code>C#</code> & <code>C</code>). I generally enjoy creative tasks such as CAD modelling (formerly in Fusion 360, now learning FreeCAD); I am currently learning 3D modelling in Blender, and I also used to make <a href="/projects/#music">music</a> in FL Studio (which I want to do again in the near future). I am also currently studying to become a middle school teacher.</p>
<p>I'm a {age}-year-old living in the north of Germany. I like video games, electronic music, and programming, though I am no pro (I currently mostly use <code>GDScript</code> in gamedev and <code>TypeScript</code> for this website). I generally enjoy creative tasks such as CAD modelling formerly in Fusion 360, now trying to learn FreeCAD. I am currently learning 3D modelling in Blender, and I also used to make <a href="/projects/#music">music</a> in FL Studio (which I want to do again in the near future). I am also studying to become a middle school teacher, though unsure whether I'll see this through until the end.</p>
<h2 id="what">What is this space?</h2>
<h3>Music</h3>
<p>(inspired by <a href="https://blog.avas.space/what-is-this/">this page</a> on <a href="https://blog.avas.space">blog.avas.space</a>)</p>
<p>Music is a big part of my identity. I listen to lots of different artists across the broader <i>electronic music</i> genre, but it's hard to define without giving examples. Every now and then, I want to create some kind of page that showcases all the music I like, but every time I do, something in my head tells me it's silly and I should stop. So instead, here's a list of my current favourites:</p>
<p>At first, my website, formerly under the GitHub Pages domain <a href="https://denizk0461.github.io">djd4rkn355.github.io</a>, served to supply data in HTML format for an <a href="/projects/#avhplan">app I developed for my school</a> back then, I did not know how to code an API endpoint. Sometime later I figured, why not develop a page of my own?</p>
<LinkList entries={favouriteAlbums} />
<p>Almost all the links lead to the artists' Bandcamp profiles because I buy my music files to listen locally on my phone and PC. I vastly prefer this over streaming services, not least because I can actually financially support the artists this way.</p>
<h2 id="what">About this website</h2>
<p>My website, formerly under the GitHub Pages domain <a href="https://denizk0461.github.io">djd4rkn355.github.io</a>, initially served to supply data in HTML format for an <a href="/projects/#avhplan">app I developed for my school</a> back then, I did not know how to code an API endpoint. Sometime later I figured, why not develop a page of my own?</p>
<p>I then proceeded to do pretty much nothing for a few years, until I started developing <a href="/projects/projectn5">a Godot game</a> in 2023. I wanted to share my progress with someone, but I didn't want to bother my friends by constantly bombarding them with tiny little updates, so I figured I could write update posts in the form of a devlog. From this point forward, I continued writing updates, but I also started expanding the website to create my own little space on the web.</p>
<p>I like having this space, because it exposes a part of me I don't/cannot show to people in-person. I can share my interests, but also my projects and anything I work on here. Only thing I'm limited by is my own creativity!</p>
<p>I like having this space, because it exposes a part of me I don't/cannot show to people in-person. I can share my interests, but also my projects and anything I work on here. Only thing I'm limited by is my own creativity and my own head hindering me from posting all the things I'd like to post.</p>
<h3 id="how">How did you make this?</h3>
<h3 id="how">How did I make this?</h3>
<p>i'm techy so i'll dump some tech details here</p>
<h4 id="hardware">Hardware</h4>
<p>I am using either my <a href="https://www.campuspoint.de/lenovocampus-ideapad-pro-5-14-akp-g10-83jl0011ge.html">laptop</a> or my PC, which I built myself in mid-2023 key specs are: AMD Ryzen 5700X, ASUS RTX 3070, 32 GB memory, 2 TB NVMe storage, 1 TB HDD. Both my computers are currently running <a href="https://fedoraproject.org/">Fedora</a> with the KDE Plasma desktop environment. It's a really solid distro that allowed me to free myself from Micro$lop's Windows once and for all. There's a bit of setup required right after installing (for which I used <a href="https://github.com/devangshekhawat/Fedora-43-Post-Install-Guide">a guide</a>) but once that's done, using the operating system is just as simple as using Windows, except it's far less bloated and much more customisable. Look, I set my application launcher icon to Clank in his backpack form:</p>
<p>I am using either my <a href="https://www.campuspoint.de/lenovocampus-ideapad-pro-5-14-akp-g10-83jl0011ge.html">laptop</a> or my PC, which I built myself in mid-2023 key specs are: AMD Ryzen 5700X, ASUS RTX 3070, 32 GB memory, 2 TB NVMe storage, 1 TB HDD. Both my computers are currently running <a href="https://fedoraproject.org/">Fedora</a> with the KDE Plasma desktop environment. It's a really solid Linux distro that allowed me to free myself from Micro$lop's Windows once and for all. There's a bit of setup required right after installing (for which I used <a href="https://github.com/devangshekhawat/Fedora-43-Post-Install-Guide">a guide</a>) but once that's done, using the operating system is just as simple as using Windows, except it's far less bloated and much more customisable. Look, I set my application launcher icon to Clank in his backpack form:</p>
<img alt="Screenshot of the taskbar of a Fedora KDE setup. There are multiple icons. From left to right: Clank as the application launcher icon, Firefox, fooyin music player, Dolphin file explorer." src="taskbar.webp">
<p>As for the server infrastructure: the website is hosted on a Hetzner server instance I am renting. It's a relatively cheap CPX22 node that costs me 7,72€ a month, and besides my website, it's also hosting things such as a Nextcloud instance and a Minecraft server. In order to host and update the website, I pull the changes from the <a href="https://codeberg.org/denizk0461/pages-svelte">Git repository</a>, build the website as a Node server, then expose it via Nginx.</p>
<p>As for the server infrastructure: the website is hosted on a Hetzner server instance I am renting. It's a relatively cheap CPX22 node that costs me 7,72€ a month, and besides my website, it's also hosting things such as a Nextcloud instance and a Minecraft server. In order to host and update the website, I wrote a small bash script that pulls the changes from the <a href="https://codeberg.org/denizk0461/pages-svelte">Git repository</a>, builds the website as a Node server, and then exposes it via Nginx.</p>
<h4 id="software">Tools & Software</h4>
<p>My main IDE for writing this website is <a href="https://vscodium.com/">VSCodium</a>, and the website itself is developed using <a href="https://svelte.dev">SvelteKit</a>. I perceive SvelteKit as a relatively light web dev framework: it allows me to create easily-reusable components (like the header, footer, title banner, etc.) and I can also configure it to create HTML from markdown files (which is how I write posts for the <a href="/blog">Blog</a> and the <a href="/projects/projectn5">Project N5 devlog</a>). For this, I use <a href="https://mdsvex.pngwn.io/">mdsvex</a> by pngwn. After setting it up, it's easier to add content than if I were to rawdog HTML and it's a <b>lot</b> easier to change something if the need arises (which I do more often than I'd like to admit). A lot of the actual page creation is still done with almost entirely vanilla HTML/CSS though, so there's not <i>too</i> much to re-learn.</p>
<p>My main IDE for writing this website is <a href="https://vscodium.com/">VSCodium</a>, and the website itself is developed using <a href="https://svelte.dev">SvelteKit</a>. I perceive SvelteKit as a relatively light web dev framework: it allows me to create easily-reusable components (like the header, footer, title banner, etc.) and I can also configure it to create HTML from markdown files. After setting it up, it's easier to add content than if I were to rawdog HTML and it's a <b>lot</b> easier to change something if the need arises (which I do more often than I'd like to admit). A lot of the actual page creation is still done with almost entirely vanilla HTML/CSS though, so there's not <i>too</i> much to re-learn.</p>
<p>This website uses two fonts: body text uses <b>Bai Jamjuree</b> by Cadson Demak (<a href="https://fonts.google.com/specimen/Bai+Jamjuree">G Fonts</a> | <a href="https://github.com/cadsondemak/Bai-Jamjuree">GitHub</a>), headers and monospaced text use <b>Kode Mono</b> by Isa Ozler (<a href="https://fonts.google.com/specimen/Kode+Mono">G Fonts</a> | <a href="https://github.com/isaozler/kode-mono">GitHub</a>).</p>
<h4 id="resources">Libraries & Resources</h4>
<h2>Contact</h2>
<p>I try to keep the amount of external resources in any of my projects to a minimum, in part because it reduces the risk of things breaking when these dependencies update, but also because I have this need to try and make things from scratch as much as possible. It slows me down a bit, but on the upside, it's really good for learning how to do complex things. Either way, this website has only a few dependencies:</p>
<p>If you want to contact me, please write an e-mail to: <a href="mailto:denizk0461@mailbox.org">denizk0461@mailbox.org</a></p>
<p>Posts in <a href="/blog">Blog</a> and the <a href="/projects/projectn5">Project N5 devlog</a> are generated from Markdown using <a href="https://mdsvex.pngwn.io/">mdsvex</a> by pngwn.</p>
<p>Body text uses <a href="https://github.com/cadsondemak/Bai-Jamjuree">Bai Jamjuree</a> by Cadson Demak, headers and monospaced text use <a href="https://github.com/isaozler/kode-mono">Kode Mono</a> by Isa Ozler.</p>
<p>The <a href="https://ratchetandclank.fandom.com/wiki/Ratchet">rat</a> in the bottom right of the screen is property of <a href="https://insomniac.games/">Insomniac Games</a>. Clicking it will bring you good fortune.</p>
<h2 id="contact">Where to find me</h2>
<p>Best to e-mail me if you want to get in touch I try to respond quickly!</p>
<LinkList entries={links} />
<p>You can also try messaging me on Discord (@denizk0461) <span class="small-supertext">but good luck i'm hardly active there lmao</span></p>
<h2>Anything else?</h2>
<p>hmm... this website and everything else I make comes straight from my own hands and brain. No generative AI is used, ever.</p>
<p>hmm... maybe worth it to point out that this website and everything else I make comes straight from my own hands and brain. No generative AI is used, ever.</p>
<p><i>Last updated: 2026-02-01</i></p>
<p><i>Last updated: 2026-02-02</i></p>
</Content>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 650 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1006 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 KiB

View File

Before

Width:  |  Height:  |  Size: 894 B

After

Width:  |  Height:  |  Size: 894 B