update

src/components/BaseHead.astro

@@ -1,6 +1,4 @@
 ---
-// Import the global.css file here so that it is included on
-// all pages through the use of the <BaseHead /> component.
 import "../styles/global.css";
 import ubuntuRegularWoff2 from "@fontsource/ubuntu/files/ubuntu-latin-400-normal.woff2?url";
 import ubuntuBoldWoff2 from "@fontsource/ubuntu/files/ubuntu-latin-700-normal.woff2?url";

src/components/ProjectSection.astro

@@ -0,0 +1,40 @@
+---
+import { Picture } from "astro:assets";
+import { projects } from "../consts";
+---
+
+<section class="py-16 bg-mytheme-200/70 dark:bg-mytheme-700/50">
+  <h2
+    class="text-3xl md:text-4xl font-bold mb-12 text-center text-slate-800 dark:text-slate-100"
+  >
+    Software I developed
+  </h2>
+
+  <div
+    class="max-w-7xl mx-auto
+      grid grid-cols-1 lg:grid-cols-[auto,1fr,auto]
+      items-center md:items-start
+      gap-8
+      py-8 md:py-12"
+  >
+    <div class="w-72 md:block">project details</div>
+
+    <div class="max-w-2xl px-4 order-2 md:order-none">
+      {
+        projects.map((project, index) => (
+          <div class="">
+            -- TODO: make it rotate through images, create new component for
+            this
+            <Picture
+              src={project.images[0].src}
+              alt={project.images[0].alt}
+              class="w-full"
+            />
+          </div>
+        ))
+      }
+    </div>
+
+    <div class="w-48 md-w-64 md:block hidden"></div>
+  </div>
+</section>

src/consts.ts

@@ -1,6 +1,201 @@
-// Place any global data in this file.
+import type { ImageMetadata } from "astro";
-// You can import this data from anywhere in your site by using the `import` keyword.
+import optimizer1 from "./assets/projects/optimizer/Discretize-Gear-Optimizer-08-05-2025_11_52_AM.png";
+import optimizer2 from "./assets/projects/optimizer/Discretize-Gear-Optimizer-08-05-2025_11_53_AM.png";
+import optimizer3 from "./assets/projects/optimizer/Discretize-Gear-Optimizer-08-05-2025_11_54_AM.png";
+import optimizer4 from "./assets/projects/optimizer/Discretize-Gear-Optimizer-08-05-2025_11_55_AM.png";
 
 export const SITE_TITLE = "Alex Daichendt";
 export const SITE_DESCRIPTION =
   "Alex Daichendt's personal website, blog, and portfolio.";
+
+export interface Project {
+  title: string;
+  live_url?: string;
+  repo_url?: string;
+  description: string;
+  tech_stack: string[];
+  duration: string;
+  deliverables: string[];
+  company?: string;
+  images: {
+    src: ImageMetadata;
+    alt: string;
+  }[];
+}
+
+export const projects: Project[] = [
+  // {
+  //   title: "daichendt.one (this site)",
+  //   live_url: "https://www.youtube.com/watch?v=XfELJU1mRMg",
+  //   repo_url: "https://github.com/AlexDaichendt/site",
+  //   description: "Personal website and blog.",
+  //   tech_stack: ["Astro", "Tailwind CSS"],
+  //   duration: "2022 - Present",
+  //   deliverables: [
+  //     "Cloudflare Workers & KV Integration",
+  //     "Lightweight & easy to maintain",
+  //   ],
+  // },
+  // {
+  //   title: "Radio Player",
+  //   live_url: "https://video.taxi/en/functions/simultaneous-interpreting/",
+  //  description: "A radio player for the VIDEO.TAXI website. Allows users to listen to radio stations with dubbed audio with the voice of the original speaker.",
+  //  tech_stack: ["React", "TypeScript", "Vite", "Go", "Docker"],
+  // duration: "2024 - Present",
+  // complexity: 4,
+  // company: "TV1 GmbH",
+  // },
+  // {
+  //   title: "VIDEO.TAXI Meetings",
+  //   live_url: "https://meetings.video.taxi/",
+  //   description:
+  //     "Records, transcribes, and translates meetings (Webex, Teams, Zoom). Interfaces with the GraphQL API of VIDEO.TAXI. Architecure, development, and deployment all done by me. Greenfield project.",
+  //   tech_stack: [
+  //     "Svelte",
+  //     "TypeScript",
+  //     "Tailwind CSS",
+  //     "Express",
+  //     "GraphQL",
+  //     "PostgreSQL",
+  //     "Docker",
+  //     "OpenAPI",
+  //   ],
+  //   duration: "2024 - Present",
+  //   company: "TV1 GmbH",
+  //   deliverables: [
+  //     "Live Updating Dashboard",
+  //     "Meeting Bots for Teams, Zoom and Webex",
+  //     "Keycloak integration",
+  //   ],
+  // },
+  // {
+  //   title: "Netbox PDU Plugin",
+  //   repo_url: "https://github.com/AlexDaichendt/axians-netbox-plugin-pdu",
+  //   description:
+  //     "Netbox plugin to read out power usage of PDUs. Forked and maintained from the original plugin by Axians. Used in production by multiple companies.",
+  //   tech_stack: ["Python", "Django", "Netbox"],
+  //   duration: "2023 - Present",
+  //   complexity: 4,
+  //   company: "TV1 GmbH",
+  // },
+  // {
+  //   title: "Latency IRQ Analyzer",
+  //   repo_url: "https://github.com/AlexDaichendt/latency-irq-analyzer",
+  //   description:
+  //     "Quick uni project for overlaying latency files with IRQ data.",
+  //   tech_stack: ["NodeJS", "Highcharts"],
+  //   duration: "2024",
+  //   complexity: 2,
+  // },
+  // {
+  //   title: "Netbox Agent",
+  //   description:
+  //     "Reads out lshw, dmidecode and other data of a server and creates Netbox devices. Forked from the original project.",
+  //   tech_stack: ["Python"],
+  //   duration: "2023 - Present",
+  //   complexity: 2,
+  //   company: "TV1 GmbH",
+  // },
+  // {
+  //   title: "magewell-exporter",
+  //   repo_url: "https://github.com/TV1-EU/magewell-exporter",
+  //   description:
+  //     "Prometheus exporter for Magewell AiO encoders. Allows monitoring of the capture card status and video signal. Used in production by TV1.",
+  //   tech_stack: ["NodeJs", "Typescript"],
+  //   duration: "2023",
+  //   complexity: 4,
+  //   company: "TV1 GmbH",
+  // },
+  {
+    title: "Discretize -- Gear Optimizer",
+    live_url: "https://optimizer.discretize.eu/",
+    repo_url: "https://github.com/discretize/discretize-gear-optimizer",
+    description:
+      "A gear optimizer for the popular MMORPG Guild Wars 2. The optimizer is used by thousands of players daily to find the best gear combinations for their characters.",
+    tech_stack: ["React", "Redux", "Rust", "Vite", "MaterialUI"],
+    duration: "2021 - Present",
+    deliverables: [
+      "User-friendly interface",
+      "Rust/WASM calculation core",
+      "Internationalization",
+      "Keyboard Navigation",
+    ],
+    images: [
+      {
+        src: optimizer1,
+        alt: "Discretize Gear Optimizer Screenshot",
+      },
+      {
+        src: optimizer2,
+        alt: "Discretize Gear Optimizer Screenshot",
+      },
+      {
+        src: optimizer3,
+        alt: "Discretize Gear Optimizer Screenshot",
+      },
+      {
+        src: optimizer4,
+        alt: "Discretize Gear Optimizer Screenshot",
+      },
+    ],
+  },
+  // {
+  //   title: "Discretize -- UI Library",
+  //   repo_url: "https://github.com/discretize/discretize-ui",
+  //   description:
+  //     "A beautiful component library with tooltips for the popular MMORPG Guild Wars 2. Allows websites to look and feel like the game. Integral part of the Discretize ecosystem.",
+  //   live_url:
+  //     "https://discretize.github.io/discretize-ui/gw2-ui/?path=/story/components-attribute--boon-duration",
+  //   tech_stack: ["React", "TypeScript", "Storybook"],
+  //   duration: "2021 - Present",
+  //   complexity: 5,
+  // },
+  // {
+  //   title: "Discretize -- Rewritten Website",
+  //   description:
+  //     "Rewritten website for the Discretize community. Contains guides, builds, and other useful information for the popular MMORPG Guild Wars 2. Awaiting last few changes and content updates by players before deployment.",
+  //   live_url: "https://next.discretize.eu/",
+  //   repo_url: "https://github.com/discretize/discretize.eu-rewrite",
+  //   tech_stack: ["Astro", "React", "TypeScript", "Tailwind CSS"],
+  //   duration: "2022 - Present",
+  //   complexity: 5,
+  // },
+  // {
+  //   title: "Discretize -- CC Tool",
+  //   description:
+  //     "Allows players to create skill schedules with drag and drop. Used by high-end players to optimize and coordinate their gameplay.",
+  //   live_url: "https://cc-tool.pages.dev/",
+  //   repo_url: "https://github.com/discretize/cc-tool",
+  //   tech_stack: ["Vite", "React", "TypeScript", "Tailwind CSS"],
+  //   duration: "2024 - Present",
+  //   complexity: 3,
+  // },
+  // {
+  //   title: "Discretize -- Random Builds",
+  //   description:
+  //     "Generates random builds for the popular MMORPG Guild Wars 2. Meant as a way to force players out of their comfort zone and try new things.",
+  //   live_url: "https://random-builds.discretize.eu/",
+  //   tech_stack: ["Vite", "React", "TypeScript", "Tailwind CSS"],
+  //   duration: "2022",
+  //   complexity: 3,
+  // },
+  // {
+  //   title: "Discretize -- Old Website",
+  //   description:
+  //     "Currently deployed website for the Discretize community. Contains guides, builds, and other useful information for the popular MMORPG Guild Wars 2. Inherited project from previous maintainer. Several hundred thousand monthly users.",
+  //   live_url: "https://discretize.eu/",
+  //   tech_stack: ["React", "Gatsby", "Material UI"],
+  //   duration: "2019 - Present",
+  //   complexity: 3,
+  // },
+  // {
+  //   title: "Minecraft LandLord Spigot Plugin",
+  //   live_url: "https://www.spigotmc.org/resources/landlord-2.44398/",
+  //   repo_url: "https://github.com/LandlordPlugin/LandLord",
+  //   description:
+  //     "Landlord aims to keep the Minecraft experience simple and fluid for players while also protecting their land. The idea for this plugin is to protect player builds with minimal game-play interference, while also allowing them to tweak the protection details in a simple and user-friendly way. Handed over the project to a new group of maintainers in 2019.",
+  //   tech_stack: ["Java"],
+  //   duration: "2017 - 2019",
+  //   complexity: 2,
+  // },
+];

src/pages/index.astro

@@ -4,6 +4,8 @@ import me from "../assets/me.jpg";
 import { Image } from "astro:assets";
 import Picture from "../components/Picture.astro";
 import Link from "../components/Link.astro";
+import { projects } from "../consts";
+import ProjectSection from "../components/ProjectSection.astro";
 
 const love = [
   {
@@ -64,10 +66,8 @@ const skills = {
         gap-8
         py-8 md:py-12"
   >
-    <!-- Left Spacer: Already responsive, no changes needed -->
     <div class="w-72 hidden md:block"></div>
 
-    <!-- Main Content: Add order to place it below the image on mobile -->
     <div class="max-w-2xl px-4 order-2 md:order-none">
       <p class="mb-4">
         I am a privacy-first software engineer passionate about building web
@@ -86,7 +86,6 @@ const skills = {
       </p>
     </div>
 
-    <!-- Picture: Place it first on mobile using order -->
     <div class="px-4 order-1 md:order-none">
       <Picture src={me} alt="me" class="w-48 md:w-64 h-auto mx-auto" />
     </div>
@@ -141,4 +140,6 @@ const skills = {
       </div>
     </div>
   </section>
+
+  <ProjectSection />
 </BaseLayout>