Building a Lightweight Portfolio That Scales: Pure CSS, Three.js, Docker, Cloud Run

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

About Me

Hi, I'm Jakub, a full stack web developer who likes building tools that solve real problems and stay easy to use as they grow. I'm strongest on the backend and data side, but I also care a lot about the UI, because a solid system is only valuable if people actually want to work with it.

With this portfolio I want to show how I approach work: turning complex requirements into clear features, keeping the architecture modular, and shipping solutions that are reliable in day to day use. You’ll see projects from university (a student events platform and a route planning and optimization app using real map and routing services) as well as professional systems like ERP-style digitization, offer and calculation engines, and internal apps for planning and reporting.

Portfolio

🤘 Also here wojak.works

How I Built It

Here is a breakdown of the custom portfolio, the decisions behind it, and the tools involved.

🛠️ Tech Stack
Prioritized performance and longevity by using a standardized, lightweight stack without the overhead of heavy frameworks.

• Frontend:
  • HTML: Semantic structure for accessibility and SEO.
  • CSS: Native CSS Variables var(--color-primary) for theming and Flexbox/Grid for layout. No Tailwind or Bootstrap. Just pure CSS.
  • JavaScript: Vanilla JS for scroll observers and logic.
  • Three.js: A WebGL library used for the interactive 3D hero element.
• Infrastructure:
  • Docker: Used to containerize the application with a lightweight Nginx (Alpine) image.
  • Google Cloud Run: A fully managed compute platform that automatically scales the container.

🎨 Design Decisions

1. Glassmorphism & Dark Mode:
   • Chose a deep, dark palette contrasted with vibrant gradients (Purple/Teal) to give a premium software engineer aesthetic.
   • Used backdrop-filter on cards and the navigation bar to create depth and layering.
2. Interactive "Wow" Factor:
   • Instead of a static image, we implemented a 3D Icosahedron that tracks mouse movement. This immediately demonstrates technical capability and attention to detail.
3. Professional vs. Personal:
   • Added "Internal System" badges to project cards. This was a key decision to showcase high-level enterprise work (ERP, CRM) even when public links weren't available.

🤖 Google AI & Tools Used

• Gemini (The AI Agent): I am the AI agent that acted as your pair programmer. I analyzed your requests, wrote the code, debugged the white-screen issues, and generated the deployment configuration.
• Google Cloud Run: The platform hosting your live site. It abstracts away server management, allowing us to just push a container.
• Google Fonts: We utilized Inter and Outfit from Google's font library for modern typography.

What I'm Most Proud Of

What I'm most proud of is building complete, real-world systems end to end, not just isolated features. At university I delivered two full-stack apps: a student events platform and a route planning tool that combines an interactive map with real geospatial services. In the routing app I integrated OpenStreetMap with Leaflet, OSRM for routing, and Nominatim for geocoding, so users can create routes, manage saved points, and optimize trips in a way that feels practical and fast.

Professionally, I'm proud of the impact of my work in digitizing business processes. In one company I helped transform operations into a connected CRM/ERP-style ecosystem with multiple modules like purchasing, warehouse, production, invoicing, time tracking, reporting, and integrations with external systems. In another, I built complex configuration and calculation flows for customer offers, modeling products, references, processes, stations, cycle times, and reports, and I delivered responsive UIs and data-heavy views using React with the TanStack stack, plus real-time communication with Socket.IO where it mattered.

Across all projects, I'm especially proud of combining clean front-end UX with solid back-end foundations: designing databases (SQL and NoSQL), keeping systems modular, and running everything in Docker to make development and deployment reproducible.