Skip to content

Commit aa71048

Browse files
committed
✨ Added a lot of additional information about my projects via a drawer && Major refactor && Major design changes
1 parent ee2ecc7 commit aa71048

20 files changed

+220
-109
lines changed

bun.lockb

1.9 KB
Binary file not shown.

src/lib/index.ts

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
export const projects = [
2+
{
3+
title: 'console-utils-rs',
4+
summary: 'CLI Input Library for Rust',
5+
picture: 'console-utils.png',
6+
description:
7+
'Soooo this project was initiated through writing Python in my Informatics Lessons. The thing is that Rust itself (the std library) does\'nt have a very "nice" way of retrieving user input. In comparison python has the super simple <code class="code" >input</code> function which can do that very easily! Therefore, I decided to develop this crate which main point is to be very developer friendly with providing high functionality!',
8+
link: 'https://crates.io/crates/console-utils'
9+
},
10+
{
11+
title: 'dashboard',
12+
summary: 'A dashboard of all my websites',
13+
picture: 'dashboard.png',
14+
description:
15+
'The summary basically is enough to explain this project: A dashboard of all my websites. I am here going to explain further how it came to this project. I bought some time ago the domain <code class="code">nwrenger.dev</code> and wanted to host under that domain some websites, which btw was harder than I thought because of DNS, the provider and GH-Pages. Nevertheless, the idea of an overview of all my websites began to grow and now here we are!',
16+
link: 'https://nwrenger.dev/'
17+
},
18+
{
19+
title: 'doenermann-bot',
20+
summary: 'The Dönermann Discord Bot used on a Discord-Server of mine',
21+
picture: 'doenermann-bot.png',
22+
description:
23+
'Before I am explaining the origins/need of this bot please note that the black bars in the picture is there to protect personal information, nothing more, nothing less! So, this bot was created for a discord server which I am also a part of. It can track birthdays (second message seen in the picture), copy messages from a channel (first message seen in the picture), give users automatically roles on certain conditions,... This was created as a drop in replacement of Mee6 which did some very shady stuff lately.',
24+
link: 'https://github.com/nwrenger/doenermann-bot'
25+
},
26+
{
27+
title: 'Escaping-from-the-Supernova',
28+
summary: 'A procedural generated textadventure coded in Rust',
29+
picture: 'efts.png',
30+
description:
31+
'This project marks my first attempt at writing in Rust, and the original version is available under the "old" branch. After gaining more experience and developing my own CLI crate <code class="code">console-utils</code>, I expanded the project into a procedurally generated text adventure with a total of 16 different endings. Have fun exploring them!',
32+
link: 'https://github.com/nwrenger/Escaping-from-the-Supernova'
33+
},
34+
{
35+
title: 'eta',
36+
summary: 'An efficient Code Editor made from scratch using egui',
37+
picture: 'eta.png',
38+
description:
39+
'As explained the summary, this is a code editor made in egui which focusses on efficiency. Furthermore, this was created due to the lack of performance seen in VSC, the most used code editor, and my curiosity of how a project editor app works and how hard is it to create one, which I now know is <code class="code">VERY HARD</code>.',
40+
link: 'https://github.com/nwrenger/eta'
41+
},
42+
{
43+
title: 'flip-ui',
44+
summary: 'The UI Builder for the Flipper Zero',
45+
picture: 'flip-ui.png',
46+
description:
47+
"This is a UI build for the flipperzero, a small IoT device which was mainly hyped due to it's hacking capabilities. The idea itself came from building a Flipperzero App myself and seeing how unnecessary difficult that was. Nevertheless, the workflow when using this is to create a UI using the website and then use a Rust crate which converts the ui data and your own custom functions into a flipperzero compatible binary.",
48+
link: 'https://github.com/flip-ui'
49+
},
50+
{
51+
title: 'hadar',
52+
summary: 'The current code of Hunger of Hadar, a Battlesnake agent',
53+
picture: 'hadar.png',
54+
description:
55+
'This is a very simple Battlesnake agent, a bot designed to play competitive snake against other bots. Its sole mission is to seek food and avoid killing itself when it gets too long. The results of this strategy are displayed in the picture above!',
56+
link: 'https://github.com/nwrenger/hadar'
57+
},
58+
{
59+
title: 'omega',
60+
summary: 'A performant terminal-based project editor with extensive shortcuts',
61+
picture: 'omega.png',
62+
description:
63+
'This project was created after I created <code class="code">eta</code> from which I learned a lot. It\'s a terminal-based project editor editor with syntax highlighting, great performance and very useful and powerful shortcuts. So please give it a try!',
64+
link: 'https://crates.io/crates/omega'
65+
},
66+
{
67+
title: 'portfolio',
68+
summary: 'My personal Portfolio, or more precise THIS website',
69+
picture: 'portfolio.png',
70+
description:
71+
'As outlined in the summary, you are currently viewing my portfolio. Feel free to explore the project source code to understand how I built this website and provide feedback on areas for improvement. This portfolio style emphasizes simplicity with a touch of design and fun. My portfolio/personal website has evolved significantly over time, so don’t hesitate to revisit and see what has changed!',
72+
link: 'https://github.com/nwrenger/portfolio'
73+
},
74+
{
75+
title: 'quickmaths',
76+
summary: 'A school project...QUICKMATHS!!!',
77+
picture: 'quickmaths.png',
78+
description:
79+
"Indeed, this summary hints at something math-related, and that's essentially accurate. Developed during my school lessons, this website focuses on learning math calculations and uniquely features local co-op! Surprising, right? Grab a friend, try it out below, and see who excels at calculations!",
80+
link: 'https://quickmaths.nwrenger.dev'
81+
},
82+
{
83+
title: 'schiller-db',
84+
summary: "Schillernova's Database Management Software",
85+
picture: 'schiller-db.png',
86+
description:
87+
"Developed for a project week (a school-wide activity for a week, in my case we were out own state), this project unfortunately didn't meet expectations, but that's a tale for another time! Here, authorities could access an overview of all citizens, including the unemployed, as well as a record of crimes committed by citizens. The aim was to assist authorities in state management by eliminating the need for extensive paperwork, which is typically essential in bureaucratic processes.",
88+
link: 'https://github.com/nwrenger/schiller-db'
89+
},
90+
{
91+
title: 'schiller-lib',
92+
summary: 'The Schiller School Library App',
93+
picture: 'schiller-lib.png',
94+
description:
95+
"Like many schools, mine also has a library where students can read and borrow books. My brother and I developed this piece of software to address this need. Originally, the library's software was a Windows application, but now it has been transformed into a comprehensive website plus server with OAuth for authentication. This update was made to eliminate the need for Windows/PC and to simplify the user interface for younger students.",
96+
link: 'https://github.com/wrenger/schiller-lib'
97+
},
98+
{
99+
title: 'schulen-im-chaos',
100+
summary: 'Homework-Sharing Platform',
101+
picture: 'sic.png',
102+
description:
103+
'The "Schulen im Chaos" (Schools in Chaos) project, which I was invited to develop the infrastructure and website for, focuses—as the summary suggests—on sharing notes on various school subjects, such as Mathematics, Physics, Computer Science, etc. It\'s important to note that the current scope of this project is limited to German schools only, due to the significant differences in school systems worldwide.',
104+
link: 'https://schulenimchaos.de'
105+
},
106+
{
107+
title: 'shitboard',
108+
summary: 'Online Soundboard App',
109+
picture: 'shitboard.png',
110+
description:
111+
'Developed at the request of a friend who wanted a sound-sharing platform but never ended up uploading anything... So please, if you have content to share, go ahead and upload it. What gets uploaded won’t be deleted. Have fun! Note: Not everything will stay there indefinitely, so please don’t upload illegal material!',
112+
link: 'https://shitboard.nwrenger.dev'
113+
}
114+
];

src/lib/stores.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { writable } from 'svelte/store';
2+
3+
export let playAnim = writable(false);

src/lib/utils.ts

Lines changed: 0 additions & 6 deletions
This file was deleted.

src/routes/+layout.svelte

Lines changed: 46 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,31 +7,70 @@
77
AppShell,
88
LightSwitch,
99
storePopup,
10-
setInitialClassState
10+
initializeStores,
11+
setInitialClassState,
12+
Drawer,
13+
getDrawerStore
1114
} from '@skeletonlabs/skeleton';
1215
13-
import { computePosition, autoUpdate, offset, shift, flip, arrow } from '@floating-ui/dom';
16+
// drawer
17+
initializeStores();
18+
const drawerStore = getDrawerStore();
19+
20+
// animations
1421
import { fade } from 'svelte/transition';
15-
import { onMount } from 'svelte';
22+
23+
// popup
24+
import { computePosition, autoUpdate, offset, shift, flip, arrow } from '@floating-ui/dom';
25+
import { playAnim } from '$lib/stores';
26+
import { projects } from '$lib';
1627
storePopup.set({ computePosition, autoUpdate, offset, shift, flip, arrow });
1728
1829
const profile: PopupSettings = {
1930
event: 'click',
2031
target: 'profileContents',
2132
placement: 'bottom'
2233
};
23-
24-
let mounted = false;
25-
onMount(() => (mounted = true));
2634
</script>
2735

2836
<svelte:head>{@html '<script>(' + setInitialClassState.toString() + ')();</script>'}</svelte:head>
2937

38+
<!-- Drawer for further infos -->
39+
<Drawer>
40+
{#each projects as { title, picture, description, link }}
41+
{#if $drawerStore.id === title}
42+
<div class="p-4 space-y-4">
43+
<button
44+
type="button"
45+
class="btn-icon variant-filled mb-2"
46+
title="Close"
47+
on:click={drawerStore.close}><i class="fa-solid fa-xmark"></i></button
48+
>
49+
<h2 class="h2">{title}</h2>
50+
<a href="projects/{picture}" target="_blank">
51+
<img
52+
src="projects/{picture}"
53+
alt="Picture of {title}"
54+
class="bg-black/50 w-full md:h-64 object-cover rounded-lg shadow-md"
55+
/>
56+
</a>
57+
<p>{@html description}</p>
58+
59+
<div>
60+
<a class="anchor" target="_blank" href={link}
61+
>See the project here <i class="fa-solid fa-up-right-from-square"></i></a
62+
>
63+
</div>
64+
</div>
65+
{/if}
66+
{/each}
67+
</Drawer>
68+
3069
<!-- App Shell -->
3170
<AppShell>
3271
<svelte:fragment slot="pageHeader">
3372
<!-- Page Container -->
34-
{#if mounted}
73+
{#if $playAnim}
3574
<div
3675
class="page-container !max-w-6xl mx-auto grid grid-cols-[1fr_auto] items-center gap-4 p-4"
3776
in:fade={{ duration: 200, delay: 0 }}

0 commit comments

Comments
 (0)