"use client" import React, { useState, useEffect } from 'react'; import { Terminal, Server, Network, Code, Database, Cpu, Globe, Mail, Phone, MapPin, Menu, X, Linkedin, Github, Briefcase, GraduationCap, Calendar } from 'lucide-react'; // --- Data Constants --- const DATA = { profile: { name: "Pietro Quintavalle", role: "System Administrator | IT Consultant | Economics Student", tagline: "Bridging Enterprise Infrastructure with Economic Strategy", summary: "I am a Systems Administrator with a strategic edge. Combining 5+ years of bare-metal virtualization and network engineering experience with an academic foundation in Economics, I don't just 'keep the lights on'—I build cost-efficient, scalable infrastructure that drives business value. My expertise spans from deploying complex Proxmox clusters to optimizing IT budgets.", location: "Switzerland", email: "0pietroquintavalle0@gmail.com", links: { github: "https://github.com/Quinta0", linkedin: "https://www.linkedin.com/in/pietro-quintavalle-996b96267/" } }, skills: [ { category: "Infrastructure & Virtualization", icon: , items: ["Proxmox VE (Clustering)", "Hyper-V", "Windows Server (AD/DNS/GP)", "Linux (Debian/Ubuntu/Alpine)", "Office 365 Administration", "Bare Metal Deployment"] }, { category: "Network Engineering", icon: , items: ["VLANs & Subnetting", "Firewall Policy Management", "Tailscale Mesh VPNs", "Reverse Proxies (NGINX)", "Network Topology Design", "Secure Remote Access"] }, { category: "DevOps & Automation", icon: , items: ["Infrastructure as Code (IaC)", "Bash & PowerShell Scripting", "Docker Containerization", "LXC Management", "Git Version Control", "Python Automation"] }, { category: "Analytics & Web", icon: , items: ["Grafana & Prometheus", "Disaster Recovery Planning", "React & Next.js", "SQL/SQLite", "Hardware Benchmarking", "Google Data Analytics"] }, ], experience: [ { id: 1, role: "Systems Engineering Consultant", company: "Freelance", location: "Ticino, Switzerland", period: "Jan 2020 - Present", description: "Delivering end-to-end IT infrastructure services.", achievements: [ "Built and maintained 6-10 production-grade servers with 90%+ uptime using automation tools.", "Designed VLAN-based network topologies and firewall policies.", "Managed Windows Server environments including AD and Disaster Recovery.", "Implemented secure remote access via Tailscale VPN." ] } ], education: [ { degree: "Bachelor's Degree in Economics", institution: "USI Università della Svizzera italiana", period: "Sep 2024 - Present", status: "Current", details: "Microeconomics, Macroeconomics, Statistics, Accounting, Quantitative Methods." }, { degree: "Bachelor of Science in Informatics", institution: "USI Università della Svizzera italiana", period: "Sep 2022 - June 2024", status: "2 Years Completed", details: "Software Engineering, Agile, Data Structures, OOP (Java, C++), Web Dev." }, { degree: "Maturità Cantonale & AFC Economics", institution: "Scuola cantonale di commercio", period: "Sep 2018 - June 2022", status: "Completed", details: "Achieved 4.5/6 (Maturità), 5/6 (AFC). Above average performance." } ], projects: [ { title: "Enterprise Proxmox Infrastructure", type: "Professional Client Project", tech: ["Proxmox", "Docker", "LXC", "NGINX", "Tailscale"], description: "Deployed a full single-node virtualization environment with structured cabling, reverse proxy, and centralized monitoring via Grafana and Prometheus." }, { title: "Multi-User NAS Solution", type: "Professional Client Project", tech: ["TrueNAS", "RAID 10", "ZFS", "Linux", "ACLs"], description: "Designed a RAID 10-based NAS supporting 9 users, serving as a self-hosted cloud alternative with automated rsync backups and strict access controls." }, { title: "Valgo - Algo Visualizer", type: "Personal Project", tech: ["React", "Next.js", "TypeScript", "Tailwind"], description: "Developed a web-based algorithm visualization tool focusing on front-end performance and real-time UI interactivity to demonstrate logic." }, { title: "Finance Tracker App", type: "In Development", tech: ["Django", "Python", "SQLite", "Chart.js"], description: "Building a personal finance tool implementing the 50/30/20 rule, focusing on clarity and data visualization for budget management." }, { title: "Personal Homelab", type: "Personal Project", tech: ["IaC", "Bash", "Virtualization", "Networking"], description: "Replicated enterprise-level infrastructure using IaC principles to standardize and document reproducible deployment procedures." } ], languages: [ { lang: "Italian", level: "Native" }, { lang: "English", level: "Fluent" }, { lang: "German", level: "Conversational" }, { lang: "Spanish", level: "Basic" }, { lang: "Norwegian", level: "Basic" } ] }; // --- Components --- const SwissMap = ({ className }: { className?: string }) => ( ); const SectionHeading = ({ children, icon: Icon }: { children: React.ReactNode; icon?: React.ComponentType }) => (
{Icon && }

{children}

); const Card = ({ children, className = "" }: { children: React.ReactNode; className?: string }) => (
{children}
); const Badge = ({ children, variant = "primary" }: { children: React.ReactNode; variant?: "primary" | "secondary" | "outline" }) => { const variants: Record<"primary" | "secondary" | "outline", string> = { primary: "bg-blue-100 text-blue-700 dark:bg-blue-900/50 dark:text-blue-300", secondary: "bg-slate-100 text-slate-700 dark:bg-slate-700 dark:text-slate-300", outline: "border border-slate-300 text-slate-600 dark:border-slate-600 dark:text-slate-400" }; return ( {children} ); }; // --- Main Application --- export default function App() { const [activeSection, setActiveSection] = useState('home'); const [isMenuOpen, setIsMenuOpen] = useState(false); const [darkMode, setDarkMode] = useState(false); useEffect(() => { if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { setDarkMode(true); } }, []); const toggleTheme = () => setDarkMode(!darkMode); const navLinks = [ { id: 'about', label: 'About' }, { id: 'skills', label: 'Skills' }, { id: 'experience', label: 'Experience' }, { id: 'education', label: 'Education' }, { id: 'projects', label: 'Projects' }, { id: 'contact', label: 'Contact' }, ]; const scrollToSection = (id: string) => { const element = document.getElementById(id); if (element) { element.scrollIntoView({ behavior: 'smooth' }); setActiveSection(id); setIsMenuOpen(false); } }; return (
{/* Navigation */} {/* Hero Section */}
Available for Junior SysAdmin & IT Projects

{DATA.profile.name}

{DATA.profile.role}

{DATA.profile.tagline}. Integrating robust IT infrastructure skills with economic analysis to deliver efficient, scalable solutions.

{/* Visual Map Indicator */}
Based in
Switzerland
{/* Terminal Decoration */}
quinta@server:~
➜ ~ neofetch 
{`       _     _
      | |   | |
 _ __ | |__ | |
| '_ \\| '_ \\| |
| |_) | |_) |_|
| .__/|_.__/(_)
| |            
|_|            `}

OS: Linux / Windows Server

Host: Proxmox VE Cluster

Uptime: 5+ years experience

Shell: Bash, PowerShell

Spoken: IT, EN, DE, ES, NO

Code: Python, JS, React, SQL

Status: Open for Work

➜ ~
{/* About Section */}
Professional Summary

{DATA.profile.summary}

{DATA.languages.map((lang, idx) => (
{lang.lang}
{lang.level}
))}
{/* Skills Section */}
Technical Arsenal
{DATA.skills.map((skillGroup, idx) => (
{skillGroup.icon}

{skillGroup.category}

    {skillGroup.items.map((item, i) => (
  • {item}
    • ))}
))}
{/* Experience Section */}
Experience
{DATA.experience.map((exp) => (

{exp.role}

{exp.period}

{exp.company} • {exp.location}

{exp.description}

    {exp.achievements.map((item, i) => (
  • {item}
    • ))}
))}
{/* Education Section - Redesigned as Timeline */}
Education Timeline
{/* Vertical Line */}
{DATA.education.map((edu, idx) => (
{/* Date Badge / Center Node */}
{/* Empty space for alignment */}
{/* Content Card */}
{/* Mobile Arrow */}
{edu.period} {edu.status}

{edu.degree}

{edu.institution}

{edu.details}

))}
{/* Projects Section */}
Featured Projects
{DATA.projects.map((project, idx) => (
{idx % 2 === 0 ? : }

{project.title}

{project.type}

{project.description}

{project.tech.map((tech, i) => ( {tech} ))}
))}
{/* Contact Section */}

Ready to Collaborate?

Whether you need assistance with server infrastructure, network architecture, or are looking for a Junior SysAdmin, I'm here to help.

{DATA.profile.email}

Send a Message

e.preventDefault()}>
); }