372 lines
21 KiB
HTML
372 lines
21 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Home</title>
|
|
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
|
|
<link rel="stylesheet" href="/static/tailwind.css" />
|
|
<head>
|
|
<body class="m-0 p-0 bg-zinc-50 rubik-400">
|
|
|
|
<!-- NAV -->
|
|
<nav class="fixed inset-x-0 top-0 h-12 z-50 flex items-center px-8 bg-white/95 backdrop-blur-l border-b border-gray-200">
|
|
<a class="text-blue-400 text-xs" href="#"><span class="text-green-500">></span> samantha_vero_friis</a>
|
|
<div class="ml-auto">
|
|
<button onclick="openOverlay()">login</button>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- MAIN with parallax -->
|
|
<main id="parallax-section" class="relative h-screen overflow-hidden">
|
|
<div id="parallax-bg"
|
|
class="absolute inset-x-0 will-change-transform overflow-hidden"
|
|
style="top:-100%;bottom:-30%;">
|
|
<div hx-get="/static/components/background.html" hx-trigger="load" hx-swap="outerHTML"></div>
|
|
|
|
</div>
|
|
<!-- scroller: fills the viewport, scrolls inside -->
|
|
<div id="scroller" class="relative z-10 h-full flex justify-center overflow-y-auto">
|
|
<div class="text-black bg-white h-fit w-4xl flex font-light">
|
|
|
|
<aside id="sidebar" class="w-48 bg-white shrink-0 p-6 sticky top-0 self-start h-screen overflow-y-auto pt-20 hidden lg:block">
|
|
<div class="mb-6">
|
|
<p class="text-xs uppercase tracking-widest text-gray-400 mb-2">navigate</p>
|
|
<div class="flex flex-col gap-1 text-sm">
|
|
<a href="#about">about</a>
|
|
<a href="#experience">experience</a>
|
|
<a href="#education">education</a>
|
|
<a href="#opinion">opinion</a>
|
|
<a href="#automation">automation</a>
|
|
<a href="#interests" onclick="InterestShow()">interests</a>
|
|
</div>
|
|
</div>
|
|
<div class="mb-6">
|
|
<p class="text-xs uppercase tracking-widest text-gray-400 mb-2">skills</p>
|
|
<div class="flex flex-col gap-1 text-sm">
|
|
<div>Excel</div>
|
|
<div>Python</div>
|
|
<div>SQL</div>
|
|
<div>Go</div>
|
|
<div>Git</div>
|
|
</div>
|
|
</div>
|
|
<div class="mb-6">
|
|
<p class="text-xs uppercase tracking-widest text-gray-400 mb-2">location</p>
|
|
<div class="text-xs text-gray-500 font-mono">Denmark<br>Aalborg Øst, 9220</div>
|
|
</div>
|
|
<div class="mb-6">
|
|
<p class="text-xs uppercase tracking-widest text-gray-400 mb-2">languages</p>
|
|
<div class="flex gap-2 text-xs">
|
|
<span class="border px-2 py-0.5">Danish</span>
|
|
<span class="border px-2 py-0.5">English</span>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
<div class="bg-zinc-50 pt-20 " id="resume" >
|
|
<section class="flex-1 pl-10 pr-6 ">
|
|
<div id="about" class="mb-12">
|
|
<p class="text-xs uppercase tracking-widest text-gray-400 mb-2">About Me · 2026</p>
|
|
<h1 class="text-5xl font-light mb-4 libre-caslon-text-regular">Samantha<br><span class="text-blue-400 libre-caslon-text-regular ">Vero Friis</span></h1>
|
|
<p class="text-base text-gray-600 leading-relaxed max-w-prose">Bachelor's student in Business Administration seeking an entry-level analyst or
|
|
finance-related role while studying. Strong numerical skills, advanced Excel, and experience in company, risk,
|
|
and financial analysis. Analytical, detail-oriented, and efficiency-focused.</p>
|
|
<div class="mt-4 text-sm text-gray-500">
|
|
<div hx-get="/status" hx-trigger="load" hx-swap="outerHTML"></div>
|
|
<span>email: me@samantha42.xyz</span>
|
|
</div>
|
|
</div>
|
|
|
|
<section id="experience" class="mb-12">
|
|
<h2 class="text-2xl font-light border-b pb-2 mb-6">Experience</h2>
|
|
<div class="grid grid-cols-1 gap-4">
|
|
<div class="border border-gray-400 hover:border-pink-400 p-6 rounded-md cursor-pointer hover:bg-gray-50" onclick="window.location.href='#research'">
|
|
<div class="flex justify-between mb-2">
|
|
<span class="font-medium">Independent Equity Research</span>
|
|
<span class="text-xs border border-blue-600 text-blue-600 rounded-sm px-2 py-0.5 self-start">finance</span>
|
|
</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed">Fundamental analysis using SEC filings (10-K, 10-Q) and earnings reports. Assess
|
|
profitability, liquidity, risk factors, and long-term business sustainability. Handle incomplete or
|
|
low-transparency information through structured cross-validation.</p>
|
|
<a class="text-xs font-mono mt-3 inline-block text-blue-600" href="#research">// Go to Analysis</a>
|
|
</div>
|
|
<div class="border p-6 rounded-xl cursor-pointer hover:bg-gray-50" onclick="window.location.href='#automation'">
|
|
<div class="flex justify-between mb-2">
|
|
<span class="font-medium">Technical Tools & Automation</span>
|
|
<span class="text-xs border px-2 py-0.5 self-start">engineering</span>
|
|
</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed">Build lightweight backend tools to automate repetitive analytical and operational tasks.
|
|
Python for data processing, validation, and workflow automation. Lightweight online services in Go,
|
|
focusing on speed and reliability.</p>
|
|
<a class="text-xs font-mono mt-3 inline-block" href="#automation">// Go to Tools</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="education" class="mb-12">
|
|
<h2 class="text-2xl font-light border-b pb-2 mb-6">Education</h2>
|
|
<div class="flex flex-col gap-4">
|
|
<div class="flex gap-6 border-b pb-4">
|
|
<div class="text-xs text-gray-400 font-mono w-28 shrink-0">2025 — present</div>
|
|
<div>
|
|
<div class="font-medium text-sm">Bachelor of Economics & Business Administration (HA)</div>
|
|
<div class="text-xs text-gray-500">Aalborg University · Expected 2028</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex gap-6 border-b pb-4">
|
|
<div class="text-xs text-gray-400 font-mono w-28 shrink-0">2024 — 2025<br>
|
|
<span class="text-red-400">discontinued</span>
|
|
</div>
|
|
<div>
|
|
<div class="font-medium text-sm">Mathematics-Technology (BSc)</div>
|
|
<div class="text-xs text-gray-500">Aalborg University · 1 semester</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex gap-6 border-b pb-4">
|
|
<div class="text-xs text-gray-400 font-mono w-28 shrink-0">2020 — 2023</div>
|
|
<div>
|
|
<div class="font-medium text-sm">HTX - Technical Upper Secondary Education</div>
|
|
<div class="text-xs text-gray-500">Viden Gymnasier</div>
|
|
<div class="text-xs text-gray-400">Mathematics A, Biology B · Study project: Mathematics & Technology</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="opinion" class="mb-12">
|
|
<h2 class="text-2xl font-light border-b pb-2 mb-6">Opinion</h2>
|
|
<div class="flex gap-4">
|
|
<a class="border px-4 py-2 text-sm hover:bg-gray-50" href="/cinema">cinema</a>
|
|
<a class="border px-4 py-2 text-sm hover:bg-gray-50" href="/finance">finance</a>
|
|
<a class="border px-4 py-2 text-sm hover:bg-gray-50" href="/infra">infra</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="automation" class="mb-12">
|
|
<h2 class="text-2xl font-light border-b pb-2 mb-6">Technical Tools & Automation <span class="text-sm text-gray-400">engineering/programming</span></h2>
|
|
<p class="text-sm text-gray-600 leading-relaxed mb-6 max-w-prose">
|
|
The task here is simple: to reduce work, it's a simple investment. The choice of picking the correct
|
|
bottleneck is as important as the tool itself, as this gives it use. If it's never used, it never creates
|
|
value. The same goes for uptime, it's important that stability is almost perfect, as downtime undermines
|
|
the utility of having the tool. Remember that making and using a tool also creates debt for future
|
|
maintenance of the tool.
|
|
<br><br>
|
|
To adhere to this, I often choose Golang or Python as they are cheap to maintain. Golang has good
|
|
stability because it is easy to code and compile checks give early error detection. A word of caution on
|
|
AI generated tools: while they are cheap to make, the maintenance debt grows exponentially, as the code is
|
|
often poorly understood by the team and difficult to reason about over time.
|
|
</p>
|
|
<div class="grid grid-cols-1 gap-4">
|
|
<div class="border p-6">
|
|
<div class="font-medium mb-2">Portfolio Engine</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed mb-4">A lightweight portfolio and financial data backend written in Go. Tracks companies,
|
|
currencies, revenue reports, and trades across configurable time periods — replacing spreadsheets with a
|
|
proper database, REST API, and interactive shell.</p>
|
|
<div class="font-medium text-sm mb-2">Roadmap</div>
|
|
<ul class="list-disc pl-5 text-sm text-gray-600 space-y-1">
|
|
<li>Price update endpoint</li>
|
|
<li>Multi-currency conversion</li>
|
|
<li>Frontend dashboard</li>
|
|
<li>Shares outstanding history database table</li>
|
|
<li>Earnings per share (EPS) based on shares owned</li>
|
|
<li>First-In, First-Out (FIFO) realized gains</li>
|
|
<li>Dividends earned and related taxes</li>
|
|
<li>Total tax obligations</li>
|
|
</ul>
|
|
<a class="text-xs font-mono mt-4 inline-block" href="https://git.samantha42.xyz/samantha/Portfolio-Engine">// Git repo</a>
|
|
</div>
|
|
<div class="border p-6">
|
|
<div class="font-medium mb-2">Accounting Management</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed">A lightweight, SQL-backed, web-based CLI system designed to track assets and liabilities. The goal is to
|
|
provide a simple, fast, and scalable financial tracking tool that can grow from personal use to more
|
|
advanced scenarios.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="research" class="mb-12">
|
|
<h2 class="text-2xl font-light border-b pb-2 mb-6">Equity Research</h2>
|
|
<div class="border p-6 mb-4">
|
|
<div class="font-medium mb-2">Story vs Fundamental value</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed">
|
|
The truth I keep coming back to is simple: find value grounded in the fundamental numbers of a company.
|
|
<br><br>
|
|
My approach is rooted in fundamental analysis using SEC filings (10-K, 10-Q), earnings reports,
|
|
profitability, liquidity, risk factors, and long-term business sustainability. In low-transparency
|
|
situations I rely on structured cross-validation across sources.
|
|
<br><br>
|
|
A pattern I keep seeing is CEOs speaking just close enough to reality to generate a short-term price
|
|
boost, then moving the goalposts when reality catches up. What companies state in filings and what they
|
|
communicate to retail or even professional investors can be two very different stories.
|
|
</p>
|
|
</div>
|
|
<h3 class="text-lg font-light mb-4">Current stock analysis</h3>
|
|
<div class="border p-6 mb-4">
|
|
<div class="flex justify-between mb-2">
|
|
<span class="font-medium">MSTR: Strategy</span>
|
|
<span class="text-red-500 text-sm">Sell</span>
|
|
</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed">The company only owns btc by issuing debt and preferred stock offering.<br>
|
|
The company is a ponzi scheme at its best.</p>
|
|
<a class="text-xs font-mono mt-3 inline-block" href="/static/pdf/mstr.pdf" target="_blank">// Read file</a>
|
|
</div>
|
|
<div class="border p-6 mb-4">
|
|
<div class="flex justify-between mb-2">
|
|
<span class="font-medium">Novo.B/NVO: Novo Nordisk A/S</span>
|
|
<span class="text-green-600 text-sm">Buy</span>
|
|
</div>
|
|
<p class="text-sm text-gray-600 leading-relaxed">The product sales of weight loss drugs are high class, pipeline is undervalued.<br>
|
|
Pipeline and wegovy pill is not recognised correctly as high focus on expiration of current sold product. High pessimistic view of pipeline.</p>
|
|
<a class="text-xs font-mono mt-3 inline-block" href="/static/pdf/novo.pdf" target="_blank">// Read file</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="interests" class="mb-12">
|
|
<button onclick="toggleInterests()" class="w-full text-left flex items-center justify-between border-b pb-2 mb-6 group">
|
|
<h2 class="text-2xl font-light">Interests/Free Time</h2>
|
|
<span id="interests-chevron" class="text-gray-400 text-sm transition-transform duration-200">▼</span>
|
|
</button>
|
|
|
|
<div id="interests-body" class="hidden">
|
|
<div class="page-header">
|
|
<span class="hidden" id="matrix-hidden">
|
|
Boy: Do not try and bend the spoon. That's impossible. Instead... only try to realize the truth.
|
|
<br>Neo: What truth?<br>Boy: There is no spoon.
|
|
</span>
|
|
</div>
|
|
|
|
<div class="section-head"><h2>Lunix rice</h2></div>
|
|
<div class="flex flex-wrap gap-4">
|
|
<div class="flex self-center w-80 shrink-0 mx-auto">
|
|
<img src="/static/images/rice.png" class="w-full">
|
|
</div>
|
|
<p class="exp-body flex-1 min-w-64">I love my custom Linux setup. I use Hyprland, which automatically arranges app windows
|
|
on my screen so everything stays organized without dragging things around. I also use Quickshell, which
|
|
lets me customize menus, shortcuts, and system controls to work exactly how I want.
|
|
My system is based on Arch Linux or Manjaro Linux, which are versions of Linux that give you more
|
|
control and customization than a typical computer setup. The result is a clean, fast, and super
|
|
efficient desktop that's hard to go back from.
|
|
<a class="outlink" href="https://git.samantha42.xyz/samantha/dotfiles">Git repo</a>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="section-head"><h2>Movie/Show Top list</h2></div>
|
|
<span class="page-sub" id="interest-sub">Fav lists</span>
|
|
<div class="toplist-group">
|
|
<h3>Top 5 Movies</h3>
|
|
<div class="flex justify-center flex-wrap gap-3">
|
|
<div class="flex flex-col items-center w-24" onclick="bladerunnerClick()">
|
|
<img src="/static/posters/bladerunner2049.jpg" alt="Blade Runner 2049" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Blade Runner 2049</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24" onclick="cureClick()">
|
|
<img src="/static/posters/AcureForWellness.jpg" alt="A Cure of Wellness" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">A Cure of Wellness</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24" onclick="matrixClick()">
|
|
<img src="/static/posters/matrix.jpg" alt="matrix" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">The Matrix</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24" onclick="draculaClick()">
|
|
<img src="/static/posters/Dracula.webp" alt="Dracula: A Love Tale" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Dracula: A Love Tale</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24" onclick="dragonTypewriterClick()">
|
|
<img src="/static/posters/TheGirlwiththeDragonTattoo.webp" alt="Girl with a Dragon Tattoos" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Girl with a Dragon Tattoo</p>
|
|
</div>
|
|
</div>
|
|
|
|
<h3>Top 5 Shows</h3>
|
|
<div class="flex justify-center flex-wrap gap-3">
|
|
<div class="flex flex-col items-center w-24">
|
|
<img src="/static/posters/foundation.jpg" alt="foundation" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Foundation</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24">
|
|
<img src="/static/posters/Chernobyl.webp" alt="Chernobyl" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Chernobyl</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24">
|
|
<img src="/static/posters/Breaking Bad.webp" alt="Breaking Bad" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Breaking Bad</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24">
|
|
<img src="/static/posters/Avatar.webp" alt="Avatar: The Last Airbender" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Avatar: The Last Airbender</p>
|
|
</div>
|
|
<div class="flex flex-col items-center w-24">
|
|
<img src="/static/posters/Adolescence.webp" alt="Adolescence" class="w-24 h-36 object-cover rounded-lg">
|
|
<p class="text-xs text-center mt-1">Adolescence</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="section-head"><h2>programing</h2></div>
|
|
<div class="flex flex-wrap gap-4">
|
|
<div class="flex self-center w-50 shrink-0 mx-auto">
|
|
<img src="/static/images/program.png" class="w-full" alt="program">
|
|
</div>
|
|
<div class="flex-1 min-w-64">
|
|
<p class="exp-body">
|
|
Programming can be a task, but for me it's a source of joy. This is something I do as a hobby, and I
|
|
don't use AI much. It's about having fun and making a fool of yourself. It's not about how good it is,
|
|
in this case, I'd rather just listen to music and drink a cup of tea. I enjoy the struggle to debug,
|
|
the beauty in understanding why a bug is there to begin with.
|
|
</p>
|
|
<br>
|
|
<p class="exp-body">
|
|
The text editor I use most is VS Code, but I love the Neovim setup as it enables me to code on a
|
|
low-level system without a desktop environment being necessary. I do most of my coding on my own
|
|
desktop, synced with Git to other systems, like the server that hosts this website, which I have built
|
|
myself. The creation of this website is more of a fun dumb activity for me... go click on one of the
|
|
movie posters and see.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
<div class="section-head"><h2>Games</h2></div>
|
|
<p class="exp-body">Game i will play in my free time to wind down.</p>
|
|
<div hx-get="/static/components/games.html" hx-trigger="load" hx-swap="outerHTML"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer class="absolute flex items-center text-sm h-12 p-2 z-10 left-0 w-screen bg-white border-gray-200 border-t">
|
|
<a class="mr-auto text-blue-500 " href="mailto:me@samantha42.xyz">me@samantha42.xyz</a>
|
|
<p class="mx-auto text-gray-500" >Build by me ❤️</p>
|
|
<div class="ml-auto text-gray-400 " >© 2026 - all rights reserved</div>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
|
|
|
|
<script>
|
|
function InterestShow() {
|
|
const body = document.getElementById('interests-body');
|
|
const chevron = document.getElementById('interests-chevron');
|
|
chevron.classList.add("hidden")
|
|
body.classList.remove("hidden")
|
|
chevron.textContent = hidden ? '▶' : '▼';
|
|
}
|
|
|
|
function toggleInterests() {
|
|
const body = document.getElementById('interests-body');
|
|
const chevron = document.getElementById('interests-chevron');
|
|
const hidden = body.classList.toggle('hidden');
|
|
chevron.textContent = hidden ? '▶' : '▼';
|
|
}
|
|
|
|
const bg = document.getElementById('parallax-bg');
|
|
const scroller = document.getElementById('scroller');
|
|
const speed = 0.1;
|
|
|
|
scroller.addEventListener('scroll', () => {
|
|
const offset = scroller.scrollTop * speed;
|
|
bg.style.transform = `translateY(${offset}px)`;
|
|
}, { passive: true });
|
|
</script>
|
|
|
|
</body>
|
|
</html> |