From 831f3a46b0db6d06beed33b9f7f7ed4e8677e91b Mon Sep 17 00:00:00 2001 From: mr-forust Date: Sat, 4 Jul 2026 00:45:40 +0200 Subject: [PATCH] updated xdfnx's page --- homepages/xdfnx_files/index.html | 1751 +++++++++++------------------- 1 file changed, 615 insertions(+), 1136 deletions(-) diff --git a/homepages/xdfnx_files/index.html b/homepages/xdfnx_files/index.html index 4ef615b..2c79299 100644 --- a/homepages/xdfnx_files/index.html +++ b/homepages/xdfnx_files/index.html @@ -1,1173 +1,652 @@ - + - - - - - xdfnx — Senior Full Stack Engineer - - - - - - -
-
-
-
+ /* ---- about ---- */ + .about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:start} + .about-lead{font-size:clamp(21px,2.5vw,28px);line-height:1.42;font-weight:300;color:var(--ink);letter-spacing:-.01em} + .about-lead .hl{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--accent)} + .about-body{color:var(--ink-dim);font-size:15px;line-height:1.85;margin-top:24px;max-width:560px} + .variant-note{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-faint);letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px} + .variants{display:flex;flex-direction:column;gap:18px} + .variant{border:1px solid var(--line);background:linear-gradient(180deg,var(--surface),var(--bg-2));padding:22px 24px;border-radius:6px;position:relative;overflow:hidden;transition:border-color .35s var(--ease),transform .35s var(--ease-out)} + .variant:hover{border-color:var(--line-3);transform:translateX(6px)} + .variant::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--grad);transform:scaleY(0);transform-origin:top;transition:transform .35s var(--ease-out)} + .variant:hover::before{transform:scaleY(1)} + .variant p{color:var(--ink-dim);font-size:14px;line-height:1.7} + .variant .tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--accent);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px;display:block;font-weight:600} -
-
-
xdfnx.
- + /* ---- stats ---- */ + .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden} + .stat{background:var(--bg);padding:44px 30px;position:relative;overflow:hidden;transition:background .4s var(--ease)} + .stat::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 100% 0%,rgba(194,168,120,.07),transparent 55%);opacity:0;transition:opacity .4s var(--ease)} + .stat:hover{background:var(--bg-2)} + .stat:hover::after{opacity:1} + .stat-num{font-size:clamp(46px,6.5vw,68px);font-weight:700;letter-spacing:-.035em;color:var(--ink);line-height:1} + .stat-num .plus{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--accent)} + .stat-label{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-faint);letter-spacing:.14em;text-transform:uppercase;margin-top:12px;font-weight:500} + .stat-desc{color:var(--ink-dim);font-size:13px;margin-top:8px;font-weight:300} + + /* ---- marquee ---- */ + .marquee{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;background:rgba(255,255,255,.015);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)} + .marquee-track{display:flex;gap:48px;width:max-content;animation:scroll 32s linear infinite;font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:.12em;color:var(--ink-dim);text-transform:uppercase} + .marquee-track span{display:inline-flex;align-items:center;gap:12px;white-space:nowrap} + .marquee-track span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)} + @media (prefers-reduced-motion: no-preference){@keyframes scroll{to{transform:translateX(-50%)}}} + + /* ---- experience ---- */ + .timeline{display:flex;flex-direction:column;gap:2px} + .job{display:grid;grid-template-columns:170px 1fr;gap:40px;padding:46px 0;border-top:1px solid var(--line);transition:padding-left .4s var(--ease-out)} + .job:last-child{border-bottom:1px solid var(--line)} + .job:hover{padding-left:10px} + .job-period{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--accent);letter-spacing:.04em;padding-top:5px;font-weight:500} + .job-body h3{font-size:22px;font-weight:700;letter-spacing:-.01em} + .job-co{color:var(--ink-dim);font-weight:300;font-size:15px;margin-top:3px} + .job-co span{color:var(--ink-faint)} + .job-desc{color:var(--ink-dim);font-size:15px;line-height:1.75;margin-top:18px;max-width:680px} + .job-desc b{color:var(--ink);font-weight:500} + .job-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px} + .tag-chip{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-dim);border:1px solid var(--line-2);padding:6px 12px;border-radius:999px;letter-spacing:.04em;transition:border-color .25s var(--ease),color .25s var(--ease)} + .tag-chip:hover{border-color:var(--line-3);color:var(--ink)} + .tag-chip.hi{color:var(--accent);border-color:var(--accent-dim);background:rgba(194,168,120,.06)} + + /* ---- arsenal ---- */ + .arsenal{display:grid;grid-template-columns:repeat(3,1fr);gap:22px} + .arm-card{border:1px solid var(--line);background:linear-gradient(180deg,var(--surface),var(--bg));padding:36px 30px;border-radius:8px;position:relative;transition:transform .4s var(--ease-out),border-color .35s var(--ease);overflow:hidden} + .arm-card::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:0;transition:opacity .4s var(--ease)} + .arm-card::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(194,168,120,.07),transparent 60%);opacity:0;transition:opacity .4s var(--ease)} + .arm-card:hover{border-color:var(--line-3);transform:translateY(-6px)} + .arm-card:hover::before,.arm-card:hover::after{opacity:1} + .arm-num{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-faint);letter-spacing:.14em;font-weight:500} + .arm-title{font-size:20px;font-weight:700;margin:14px 0 12px;letter-spacing:-.01em} + .arm-desc{color:var(--ink-dim);font-size:14px;line-height:1.7;font-weight:300} + .arm-stack{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)} + .arm-stack span{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-dim);border:1px solid var(--line);padding:5px 11px;border-radius:4px;letter-spacing:.04em;transition:color .25s var(--ease),border-color .25s var(--ease)} + .arm-stack span:hover{color:var(--accent);border-color:var(--accent-dim)} + + /* ---- work ---- */ + .work-grid{display:flex;flex-direction:column;gap:2px} + .work{display:grid;grid-template-columns:90px 1fr 280px;gap:36px;padding:50px 0;border-top:1px solid var(--line);align-items:start;transition:padding-left .4s var(--ease-out),background .4s var(--ease)} + .work:last-child{border-bottom:1px solid var(--line)} + .work:hover{padding-left:12px;background:linear-gradient(90deg,rgba(255,255,255,.02),transparent 40%)} + .work-idx{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--accent);letter-spacing:.08em;padding-top:6px;font-weight:500} + .work-main h3{font-size:clamp(23px,2.7vw,32px);font-weight:700;letter-spacing:-.02em} + .work-main p{color:var(--ink-dim);font-size:15px;line-height:1.75;margin-top:16px;max-width:580px;font-weight:300} + .work-main p b{color:var(--ink);font-weight:500} + .work-side{padding-top:8px} + .work-side .lbl{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-faint);letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;font-weight:500} + .work-stack{display:flex;flex-wrap:wrap;gap:8px} + .work-stack span{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-dim);border:1px solid var(--line-2);padding:6px 11px;border-radius:4px} + + /* ---- final cta ---- */ + .cta-sec{padding:150px 0;text-align:center;border-top:1px solid var(--line);position:relative} + .cta-sec::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 80% at 50% 100%,rgba(194,168,120,.09),transparent 70%);pointer-events:none} + .cta-eyebrow{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--accent);letter-spacing:.16em;text-transform:uppercase;margin-bottom:26px;position:relative;font-weight:600} + h2.cta-title{font-size:clamp(40px,6.4vw,76px);font-weight:700;letter-spacing:-.04em;line-height:1.02;position:relative;max-width:860px;margin:0 auto} + .cta-title .soft{color:var(--ink-faint);font-weight:300} + .cta-title .accent{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--accent)} + .cta-sub{color:var(--ink-dim);font-size:17px;margin-top:26px;font-weight:300;max-width:540px;margin-left:auto;margin-right:auto;position:relative} + .cta-sec .cta-row{justify-content:center;margin-top:42px;position:relative} + + .email-copy{position:relative} + .copy-tip{ + position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%) translateY(6px); + background:var(--surface-2);border:1px solid var(--line-2);color:var(--accent); + font-family:'JetBrains Mono',monospace;font-size:11px;padding:7px 13px;border-radius:4px; + opacity:0;pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease);white-space:nowrap; + } + .copy-tip.show{opacity:1;transform:translateX(-50%) translateY(0)} + + /* ---- footer ---- */ + footer{border-top:1px solid var(--line);padding:54px 0;padding-bottom:max(60px,env(safe-area-inset-bottom))} + .foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px} + .foot-left{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-faint);letter-spacing:.04em} + .foot-left b{color:var(--ink-dim);font-weight:500} + .foot-right{display:flex;gap:24px} + .foot-right a{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-dim);text-decoration:none;letter-spacing:.04em;transition:color .25s var(--ease)} + .foot-right a:hover{color:var(--accent)} + + /* ---- reveal ---- */ + .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)} + .reveal.in{opacity:1;transform:none} + .reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}.reveal.d5{transition-delay:.4s} + + /* ---- responsive ---- */ + @media(max-width:880px){ + .nav-links{position:fixed;inset:64px 0 auto 0;background:rgba(10,10,16,.97);backdrop-filter:blur(16px);flex-direction:column;gap:0;padding:8px 0;border-bottom:1px solid var(--line);transform:translateY(-130%);transition:transform .35s var(--ease);border-radius:0 0 12px 12px} + .nav-links.open{transform:translateY(0)} + .nav-links a{padding:18px 28px;width:100%;border-bottom:1px solid var(--line)} + .menu-btn{display:block} + .about-grid{grid-template-columns:1fr;gap:44px} + .stats{grid-template-columns:1fr} + .arsenal{grid-template-columns:1fr} + .job{grid-template-columns:1fr;gap:14px;padding-left:0!important} + .job-period{padding-top:0} + .work{grid-template-columns:1fr;gap:18px;padding-left:0!important} + .work-side{padding-top:0} + .hero{padding-top:120px} + .sec{padding:84px 0} + .hero-term{max-width:none} + } + @media(prefers-reduced-motion:reduce){ + *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important} + .reveal{opacity:1;transform:none} + } + + + + + + + + + +
+
+ xdfnx + + +
+
+ +
+ + +
+
+
+ + Open for Complex Projects
-
-
- -
-
-
- - Open for Complex Projects -
+

+ Systems built
+ for pressure. +

-

- Systems built
- for pressure. -

+

+ Senior Full Stack Engineer. I build scalable web applications and optimize the core infrastructure that holds them together. Rust & C++ on the paths where speed is not optional. +

-

- Senior Full Stack Engineer. I build scalable web applications and optimize the - core infrastructure that holds them together. Rust & C++ on the paths where speed is not - optional. -

+
+ Contact Me + View Work +
-
- Contact Me → - View Work -
+
+
ROLE / Senior Full Stack Engineer
+
FOCUS / System Performance
+
STACK / Rust · C++ · TS
+
-
-
ROLE / Senior Full Stack Engineer
-
FOCUS / System Performance
-
STACK / Rust · C++ · TS
-
+
- - -
-
- 01 / ABOUT -

The Engineer

- +
+
// six years in the engine room
+
$ cargo build --release
+
✓ Finished in 0.42s // zero-cost abstractions
+
$ ./serve --load high
+
✓ latency −40% · holding steady
+
+ +
-
-
-

- Senior Full Stack Engineer with a focus on system performance. I design - infrastructure that withstands pressure, write code that respects the machine, and ship systems built to - outlast their first traffic spike. -

-

- Six years in the engine room. Scalable web applications, optimized core infrastructure, and the low-level - work most teams avoid. When the load hits, the system holds — because it was designed to. -

-
+ + -
-
Voice — three cuts
+ +
+
+ 01 / ABOUT +

The Engineer

+ +
-
- Short -

- Senior Full Stack Engineer. I build systems that survive scale. Rust & C++ where speed is not - optional. -

-
- -
- Atmospheric -

- Six years in the engine room. Scalable web applications and the core infrastructure that holds them up. - When the load hits, the system holds — because it was built to. -

-
- -
- Premium -

- Senior Full Stack Engineer focused on system performance. I design infrastructure that withstands - pressure, write code that respects the machine, and ship systems built to outlast their first traffic - spike. -

-
-
-
- - - -
-
- 02 / SIGNAL -

By the Numbers

- -
- -
-
-
6+
-
Years Experience
-
In the engine room.
-
-
-
20+
-
Production Deploys
-
Shipped under load.
-
-
-
100%
-
Performance Focused
-
Every cycle accounted for.
-
-
-
- - -
-
- 03 / RECORD -

Professional Experience

- -
- -
-
-
2025 — Present
-
-

Senior Full Stack Engineer

-
TechFlow Systems // Full-stack, infra, perf
-

- Leading the backend migration to microservices. Built a - high-throughput event processing pipeline in Python and Rust — latency cut by 40%. Own the - React architecture behind the main dashboard, from data layer to render. -

-
- Microservices Migration - Event Pipeline - Python - Rust - React - −40% Latency -
-
-
- -
-
2020 — 2023
-
-

Software Engineer

-
Creative Solutions Ltd. // Full-stack, native modules
-

- Full-stack web applications in Node.js and TypeScript. When the runtime slowed down, I went lower - — native C++ modules for image processing pushed workflows 3× faster. Where JavaScript - couldn't keep up, the machine did. -

-
- Node.js - TypeScript - Native C++ Modules - Image Processing - 3× Faster -
-
-
-
-
- - -
-
- 04 / ARSENAL -

Technical Arsenal

- -
- -
-
-
A / FRONT
-
Modern Frontend
-
- Type-safe, responsive interfaces. UX and accessibility built in — not bolted on. Every pixel earns its - place. -
-
ReactNext.jsTypeScript
-
- -
-
B / INFRA
-
Backend & Infra
-
- Scalable architectures in Node and Python. Dockerized, cloud-native — built to grow without breaking under - its own weight. -
-
- Node.jsPythonDockerRedisWebSockets -
-
- -
-
C / CORE
-
Systems & Low Level
-
- When the runtime isn't fast enough. Memory-safe, high-performance modules for the critical path. The work - most teams avoid. -
-
RustC++System Design
-
-
-
- - -
-
- 05 / SELECTED WORK -

Case Studies

- -
- -
-
-
01
-
-

Fintech Analytics Engine

-

- Real-time financial dashboard. The backend aggregates streams from multiple sources through a - custom Rust service — zero-cost abstractions, real performance. Built to render data the moment - it arrives, not a cycle later. -

-
-
-
Stack
-
Next.jsRustWebSockets
-
-
- -
-
02
-
-

AI Data Pipeline

-

- Automated ETL across terabytes of data. Python for flexibility, C++ bindings for the heavy - lifting. The pipeline doesn't choke when the data grows — it was designed for the next order of - magnitude. -

-
-
-
Stack
-
PythonC++Docker
-
-
- -
-
03
-
-

Distributed Task Queue

-

- Fault-tolerant job scheduler. Celery-inspired, rebuilt for low-memory environments. Jobs survive - crashes. The queue doesn't bleed — engineered to hold the line when the system is under pressure. -

-
-
-
Stack
-
Node.jsRedisSystem Design
-
-
-
-
- - -
-
06 / TRANSMISSION OPEN
-

Ready for the pressure?

-

- Let's talk about systems that scale without noise — performance where it matters, infrastructure that holds - the line. +

+
+

+ Senior Full Stack Engineer with a focus on system performance. I design infrastructure that withstands pressure, write code that respects the machine, and ship systems built to outlast their first traffic spike.

-
- contact@xdfnx.cfd → - View Work -
-
-
+

+ Six years in the engine room. Scalable web applications, optimized core infrastructure, and the low-level work most teams avoid. When the load hits, the system holds — because it was designed to. +

+ - +
+
2020 — 2023
+
+

Software Engineer

+
Creative Solutions Ltd. // Full-stack, native modules
+

Full-stack web applications in Node.js and TypeScript. When the runtime slowed down, I went lower — native C++ modules for image processing pushed workflows 3× faster. Where JavaScript couldn't keep up, the machine did.

+
+ Node.jsTypeScriptNative C++ ModulesImage Processing3× Faster +
+
+
+ + - - + +
+
+ 05 / SELECTED WORK +

Case Studies

+ +
+
+
+
01
+
+

Fintech Analytics Engine

+

Real-time financial dashboard. The backend aggregates streams from multiple sources through a custom Rust service — zero-cost abstractions, real performance. Built to render data the moment it arrives, not a cycle later.

+
+
Stack
Next.jsRustWebSockets
+
+
+
02
+
+

AI Data Pipeline

+

Automated ETL across terabytes of data. Python for flexibility, C++ bindings for the heavy lifting. The pipeline doesn't choke when the data grows — it was designed for the next order of magnitude.

+
+
Stack
PythonC++Docker
+
+
+
03
+
+

Distributed Task Queue

+

Fault-tolerant job scheduler. Celery-inspired, rebuilt for low-memory environments. Jobs survive crashes. The queue doesn't bleed — engineered to hold the line when the system is under pressure.

+
+
Stack
Node.jsRedisSystem Design
+
+
+
+ + +
+
06 / TRANSMISSION OPEN
+

Ready for the pressure?

+

Let's talk about systems that scale without noise — performance where it matters, infrastructure that holds the line.

+
+ + View Work +
+
+ + + + + + +