| Feature | Description |
|---|---|
| 🖥️ Terminal UI | CRT scanlines, ASCII art hero, git-log experience, JSON education, npm-list certifications, ASCII progress bars |
| 🌍 i18n | Full translations in English, Spanish & Chinese with language selector dropdown and flag icons |
| 🌗 Theme Toggle | Dark (default) and light mode with persistent preference |
| 📱 Responsive | Mobile-first with collapsible navbar, adaptive ASCII art (big text on mobile), compact progress bars |
| ✨ Animated | Framer Motion entrance, scroll-triggered animations, staggered lists |
| ⌨️ Keyboard Shortcuts | Navigate sections with H, A, S, E, D, C, L, N and scroll to top with Home key; visible shortcuts hint UI |
| 🔝 Scroll to Top | Floating button appears on scroll |
| � Portfolio | Inline tabbed section with libraries/webs, pagination, terminal-styled cards |
| 📋 Copy to Clipboard | One-click copy for email, phone and URL |
| 🖨️ Print Optimized | Skills section auto-expands all categories when printing |
| 🧭 ScrollSpy Navbar | Active section highlighting on scroll with smooth anchor navigation |
| 🏳️ Flag Icons | Dynamic flag CDN images for language selector and language section |
| 📊 Progress Bars | Terminal-style ASCII block progress bars for language proficiency |
| 📬 Contact | Terminal-styled contact info with email, phone, location and social links |
| ♿ Accessible | ARIA labels on icon buttons, semantic roles, aria-hidden on decorative elements |
| 🔍 SEO | Meta tags, Open Graph, Twitter cards, canonical URL, hreflang, PWA manifest |
| 🚀 CI/CD | Auto-deploy on push via GitHub Actions |
| 🌐 Custom Domain | mathiaspaulenko.com with CNAME |
| Layer | Tech |
|---|---|
| Framework | React 18 |
| Bundler | Vite 5 |
| Styling | TailwindCSS 3 |
| Animations | Framer Motion 11 |
| Icons | Lucide React |
| Fonts | IBM Plex Mono · Space Mono |
| Deploy | GitHub Pages (Actions) |
| Domain | mathiaspaulenko.com |
| Tool | Version |
|---|---|
| Node.js | >= 18 |
| npm | >= 9 |
# Clone
git clone https://github.com/MathiasPaulenko/mathias-paulenko-cv.git
cd mathias-paulenko-cv
# Install
npm install
# Dev server → http://localhost:5173
npm run dev# Production build
npm run build
# Preview locally
npm run previewEvery push to main triggers the GitHub Actions workflow:
push → checkout → npm ci → vite build → upload artifact → deploy to Pages
mathias-paulenko-cv/
├── .github/workflows/ # CI/CD deploy pipeline
├── public/ # CNAME, static assets
├── src/
│ ├── components/
│ │ ├── layout/ # Navbar, Footer
│ │ ├── pages/ # HomePage, PrivacyPage, NotFound
│ │ ├── sections/ # Terminal, About, TechStack, Experience,
│ │ │ # Education, Certifications, Portfolio, Languages, Contact
│ │ └── ui/ # SectionWrapper, CookieBanner, CopyButton, ScrollToTop
│ ├── data/
│ │ ├── cvData.js # CV content (tags, tech stack, projects)
│ │ └── translations.js # i18n (EN / ES / ZH)
│ ├── helpers/ # Animation variants
│ ├── hooks/
│ │ ├── useLanguage # Language context & selector
│ │ ├── useTheme # Dark/Light theme context
│ │ └── useTranslation # Translation accessor
│ ├── routers/ # AppRouter
│ ├── index.css # Global styles + CSS variables (themes)
│ ├── App.jsx # Root component
│ └── main.jsx # Entry point (providers)
├── index.html
├── tailwind.config.js
├── vite.config.js
└── package.json
| Setting | File | Value |
|---|---|---|
| Custom domain | public/CNAME |
mathiaspaulenko.com |
| Base URL | vite.config.js |
/ |
| Resource | Author / Owner |
|---|---|
| React | Meta / React Team |
| Vite | Evan You / Vite Team |
| Tailwind CSS | Tailwind Labs, Inc. |
| Framer Motion | Motion (formerly Framer) |
| Lucide Icons | Lucide Contributors |
| IBM Plex Mono & Space Mono | IBM · Colophon Foundry / Google Fonts |
| Capsule Render (header/footer banners) | kyechan99 |
| Readme Typing SVG | DenverCoder1 |
| GitHub Pages | GitHub, Inc. |
| AI Assistance | Design & code assistance by Cascade |
Personal project — All rights reserved.
$ echo "Mathias Paulenko 2026"