diff --git a/app/k-suite/page.tsx b/app/k-suite/page.tsx index 1d63561..a596cbc 100644 --- a/app/k-suite/page.tsx +++ b/app/k-suite/page.tsx @@ -4,429 +4,438 @@ import Image from "next/image"; import { ExternalLink, Github } from "lucide-react"; interface KSuiteApp { - id: number; - name: string; - shortDescription: string; - description: string; - url: string; - githubUrl?: string | null; - icon: string; - technologies: string[]; - color: string; + id: number; + name: string; + shortDescription: string; + description: string; + url: string; + githubUrl?: string | null; + icon: string; + technologies: string[]; + color: string; } const kSuiteApps: KSuiteApp[] = [ - { - id: 1, - name: "K-Notes", - shortDescription: "Google Keep replica", - description: - "A full-featured note-taking app designed for speed and simplicity.", - url: "https://knotes.gabrielkaszewski.dev/", - githubUrl: "https://github.com/GKaszewski/k-notes", - icon: "/images/k-notes.png", - technologies: ["Rust", "React", "TailwindCSS", "PWA"], - color: "from-amber-400 to-orange-500", - }, - { - id: 2, - name: "Thoughts", - shortDescription: "Microblogging platform", - description: - "Nostalgic social platform with Frutiger Aero style. 128-char posts, custom CSS profiles.", - url: "https://thoughts.gabrielkaszewski.dev/", - githubUrl: "https://git.gabrielkaszewski.dev/GKaszewski/thoughts", - icon: "/images/thoughts.avif", - technologies: ["Rust", "Next.js", "Axum"], - color: "from-cyan-400 to-blue-500", - }, - { - id: 3, - name: "K-Tuner", - shortDescription: "Instrument tuner", - description: - "Tune guitar, ukulele, and piano with this Frutiger Aero styled PWA.", - url: "https://tuner.gabrielkaszewski.dev/", - githubUrl: "https://github.com/GKaszewski/aero-tuner", - icon: "/images/k-tuner.png", - technologies: ["React", "PWA"], - color: "from-emerald-400 to-teal-500", - }, - { - id: 4, - name: "K-QR", - shortDescription: "QR code generator", - description: - "High-performance QR generator. Single Rust executable serving clean HTML.", - url: "https://qr.gabrielkaszewski.dev/", - githubUrl: "https://github.com/GKaszewski/k-qr", - icon: "/images/k-qr.png", - technologies: ["Rust", "HTML"], - color: "from-amber-400 to-orange-500" - }, + { + id: 1, + name: "K-Notes", + shortDescription: "Google Keep replica", + description: + "A full-featured note-taking app designed for speed and simplicity.", + url: "https://knotes.gabrielkaszewski.dev/", + githubUrl: "https://github.com/GKaszewski/k-notes", + icon: "/images/k-notes.png", + technologies: ["Rust", "React", "TailwindCSS", "PWA"], + color: "from-amber-400 to-orange-500", + }, + { + id: 2, + name: "Thoughts", + shortDescription: "Microblogging platform", + description: + "Nostalgic social platform with Frutiger Aero style. 128-char posts, custom CSS profiles.", + url: "https://thoughts.gabrielkaszewski.dev/", + githubUrl: "https://git.gabrielkaszewski.dev/GKaszewski/thoughts", + icon: "/images/thoughts.avif", + technologies: ["Rust", "Next.js", "Axum"], + color: "from-cyan-400 to-blue-500", + }, + { + id: 3, + name: "K-Tuner", + shortDescription: "Instrument tuner", + description: + "Tune guitar, ukulele, and piano with this Frutiger Aero styled PWA.", + url: "https://tuner.gabrielkaszewski.dev/", + githubUrl: "https://github.com/GKaszewski/k-tuner", + icon: "/images/k-tuner.png", + technologies: ["React", "PWA"], + color: "from-emerald-400 to-teal-500", + }, + { + id: 4, + name: "K-QR", + shortDescription: "QR code generator", + description: + "High-performance QR generator. Single Rust executable serving clean HTML.", + url: "https://qr.gabrielkaszewski.dev/", + githubUrl: "https://github.com/GKaszewski/k-qr", + icon: "/images/k-qr.png", + technologies: ["Rust", "HTML"], + color: "from-amber-400 to-orange-500", + }, ]; // Connection definitions for the organism const connections = [ - { from: 0, to: 1 }, // K-Notes -> Thoughts - { from: 1, to: 2 }, // Thoughts -> K-Tuner - { from: 2, to: 3 }, // K-Tuner -> K-QR - { from: 3, to: 0 }, // K-QR -> K-Notes - { from: 0, to: 2 }, // K-Notes -> K-Tuner (cross) - { from: 1, to: 3 }, // Thoughts -> K-QR (cross) + { from: 0, to: 1 }, // K-Notes -> Thoughts + { from: 1, to: 2 }, // Thoughts -> K-Tuner + { from: 2, to: 3 }, // K-Tuner -> K-QR + { from: 3, to: 0 }, // K-QR -> K-Notes + { from: 0, to: 2 }, // K-Notes -> K-Tuner (cross) + { from: 1, to: 3 }, // Thoughts -> K-QR (cross) ]; const KSuiteOrganism = () => { - // Calculate positions for apps in a circular pattern - const getPosition = (index: number, total: number, radius: number) => { - const angle = (index * 2 * Math.PI) / total - Math.PI / 2; - return { - x: 50 + radius * Math.cos(angle), - y: 50 + radius * Math.sin(angle), - }; + // Calculate positions for apps in a circular pattern + const getPosition = (index: number, total: number, radius: number) => { + const angle = (index * 2 * Math.PI) / total - Math.PI / 2; + return { + x: 50 + radius * Math.cos(angle), + y: 50 + radius * Math.sin(angle), }; + }; - const radius = 35; - const positions = kSuiteApps.map((_, i) => - getPosition(i, kSuiteApps.length, radius) - ); + const radius = 35; + const positions = kSuiteApps.map((_, i) => + getPosition(i, kSuiteApps.length, radius) + ); - return ( -
- {/* SVG Connection Lines */} - + {/* SVG Connection Lines */} + + + + + + + + + + + + + + + + + {/* Connection lines */} + {connections.map((conn, i) => { + const from = positions[conn.from]; + const to = positions[conn.to]; + return ( + + ); + })} + + {/* Lines from center to each app */} + {positions.map((pos, i) => ( + + ))} + + + {/* App Cards */} + {kSuiteApps.map((app, index) => { + const pos = positions[index]; + return ( +
+
- - - - - - - - - - - - - - + {/* Glow effect on hover */} +
- {/* Connection lines */} - {connections.map((conn, i) => { - const from = positions[conn.from]; - const to = positions[conn.to]; - return ( - - ); - })} + {/* Content */} +
+
+ {app.name} +
+

+ {app.name} +

+

+ {app.shortDescription} +

- - - {/* Lines from center to each app */} - {positions.map((pos, i) => ( - - ))} - - - {/* App Cards */} - {kSuiteApps.map((app, index) => { - const pos = positions[index]; - return ( - - ); + + + )} +
+
+
+
+ ); + })} +
+ ); }; const KSuiteAppCard = ({ app }: { app: KSuiteApp }) => { - return ( -
- {/* Gradient glow */} -
+ {/* Gradient glow */} +
+ +
+
+
+ {app.name} - -
-
-
- {app.name} -
-
-

{app.name}

-

{app.shortDescription}

-
-
- -

{app.description}

- -
- {app.technologies.map((tech) => ( - - {tech} - - ))} -
- -
- - - Visit - - {app.githubUrl && ( - - - - )} -
-
+
+
+

{app.name}

+

{app.shortDescription}

+
- ); + +

{app.description}

+ +
+ {app.technologies.map((tech) => ( + + {tech} + + ))} +
+ +
+ + + Visit + + {app.githubUrl && ( + + + + )} +
+
+
+ ); }; export default function KSuitePage() { - return ( -
- {/* Hero Section */} -
-
-

- K-Suite -

-

- A cohesive ecosystem of open-source, self-hosted applications - designed to restore digital sovereignty to the user. -

-

- A "Personal Universe" containing interconnected applications ranging - from media playback to knowledge management. -

+ return ( +
+ {/* Hero Section */} +
+
+

+ K-Suite +

+

+ A cohesive ecosystem of open-source, self-hosted applications + designed to restore digital sovereignty to the user. +

+

+ A "Personal Universe" containing interconnected + applications ranging from media playback to knowledge management. +

- {/* Organism Visualization */} - -
-
- - {/* Origin Story Section */} -
-
-
-
-

- Origin Story -

-
-

- The concept of K-Suite was born in 2017. - As a middle school student, I envisioned a digital environment where every - tool I used was built by my own hands—a space customized exactly to my needs. - However, my vision at the time far outpaced my technical abilities. -

-

- K-Suite is the realization of that long-standing dream. It bridges the gap - between the middle schooler who wanted to build, and the developer who now can. -

-
-
-
-
-
- - {/* Engineering Mission Section */} -
-
-
-
-

- Engineering Mission -

-
-

- This project represents my Magnum Opus. - It is the most ambitious software engineering undertaking I have attempted to date. - Beyond simply providing privacy and utility, K-Suite serves as a rigorous testing - ground for advanced System Design and{" "} - Software Architecture. -

-
- - {/* Core Goals */} -
-

Core Goals

- -
-

- Architectural Mastery -

-

- To design a distributed system where independent modules (like K-Notes) - function flawlessly on their own but become exponentially more powerful when connected. -

-
- -
-

- Digital Sovereignty -

-

- To create a viable, privacy-first alternative to commercial ecosystems - (Google/Apple), focused entirely on open-source principles and self-hosting. -

-
- -
-

- Seamless Integration -

-

- To solve the complex challenge of inter-app communication. In K-Suite, - a photo stored in K-Photos isn't just a file; it's an asset that can be - referenced in other apps or attached to an entry in the upcoming K-Mood. -

-
-
-
-
-
-
- - {/* Detailed Cards Section */} -
-
-

- Explore the Suite -

-

- Each application is designed to work independently, but together they form - something greater. -

-
- {kSuiteApps.map((app) => ( - - ))} -
-
-
- - {/* Coming Soon Section */} -
-
-
-

- More Apps Coming Soon -

-

- K-Suite is still growing. The ecosystem will expand with more interconnected - applications including K-Photos, K-Mood, and more. -

-

- Built with Rust, React, and modern web technologies. -

-
-
-
+ {/* Organism Visualization */} +
- ); +
+ + {/* Origin Story Section */} +
+
+
+
+

+ Origin Story +

+
+

+ The concept of K-Suite was born in{" "} + 2017. + As a middle school student, I envisioned a digital environment + where every tool I used was built by my own hands—a space + customized exactly to my needs. However, my vision at the time + far outpaced my technical abilities. +

+

+ K-Suite is the realization of that long-standing dream. It + bridges the gap between the middle schooler who wanted to + build, and the developer who now can. +

+
+
+
+
+
+ + {/* Engineering Mission Section */} +
+
+
+
+

+ Engineering Mission +

+
+

+ This project represents my{" "} + + Magnum Opus + + . It is the most ambitious software engineering undertaking I + have attempted to date. Beyond simply providing privacy and + utility, K-Suite serves as a rigorous testing ground for + advanced System Design{" "} + and{" "} + Software Architecture. +

+
+ + {/* Core Goals */} +
+

Core Goals

+ +
+

+ Architectural Mastery +

+

+ To design a distributed system where independent modules + (like K-Notes) function flawlessly on their own but become + exponentially more powerful when connected. +

+
+ +
+

+ Digital Sovereignty +

+

+ To create a viable, privacy-first alternative to commercial + ecosystems (Google/Apple), focused entirely on open-source + principles and self-hosting. +

+
+ +
+

+ Seamless Integration +

+

+ To solve the complex challenge of inter-app communication. + In K-Suite, a photo stored in K-Photos isn't just a + file; it's an asset that can be referenced in other + apps or attached to an entry in the upcoming K-Mood. +

+
+
+
+
+
+
+ + {/* Detailed Cards Section */} +
+
+

+ Explore the Suite +

+

+ Each application is designed to work independently, but together + they form something greater. +

+
+ {kSuiteApps.map((app) => ( + + ))} +
+
+
+ + {/* Coming Soon Section */} +
+
+
+

+ More Apps Coming Soon +

+

+ K-Suite is still growing. The ecosystem will expand with more + interconnected applications including K-Photos, K-Mood, and more. +

+

+ Built with Rust, React, and modern web technologies. +

+
+
+
+
+ ); } diff --git a/lib/data.ts b/lib/data.ts index 995d330..0b222dc 100644 --- a/lib/data.ts +++ b/lib/data.ts @@ -206,7 +206,7 @@ export const projects: Project[] = [ "short_description": "Web app to tune guitar, ukulele and piano.", "description": "A web application for tuning musical instruments including guitar, ukulele, and piano. It features a nostalgic Frutiger Aero style and is built as a Progressive Web App (PWA) for use on any device.\n\n**Technical details:**\n- **Frontend:** React PWA", "category": "Web", - "github_url": "https://github.com/GKaszewski/aero-tuner", + "github_url": "https://github.com/GKaszewski/k-tuner", "visit_url": "https://tuner.gabrielkaszewski.dev/", "download_url": null, "technologies": [