Redesign portfolio around systems case studies

This commit is contained in:
v7
2026-09-06 19:39:23 +02:00
parent bd3f260700
commit 384c8563de
29 changed files with 1198 additions and 841 deletions

93
src/app/features/cv/cv-page.component.ts Executable file → Normal file
View File

@@ -1,19 +1,104 @@
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
import { RouterLink } from '@angular/router';
import { PageShellComponent } from '../../core/layout/page-shell.component';
import { CvSectionComponent } from './cv-section.component';
import { SeoService } from '../../core/services/seo.service';
import { MAIN_NAVIGATION } from '../../shared/config/navigation.config';
@Component({
selector: 'app-cv-page',
standalone: true,
imports: [PageShellComponent, CvSectionComponent],
imports: [PageShellComponent, RouterLink],
changeDetection: ChangeDetectionStrategy.OnPush,
template: `
<app-page-shell [sections]="sections">
<app-cv-section />
<header class="cv-hero shell">
<nav class="breadcrumb mono" aria-label="Breadcrumb"><a routerLink="/">Home</a><span>/</span><span>CV</span></nav>
<div class="cv-heading">
<div><p class="eyebrow mono">Curriculum vitae / Amar Džanan</p><h1>Senior full-stack engineer with product judgment.</h1></div>
<div class="cv-contact">
<p>Sarajevo, Bosnia and Herzegovina<br>Available for senior engineering work across Europe.</p>
<a href="mailto:amar@dzanan.net">amar&#64;dzanan.net ↗</a>
<a href="https://www.linkedin.com/in/amardzanan/">LinkedIn ↗</a>
</div>
</div>
</header>
<section class="cv-section shell" aria-labelledby="summary-title">
<p class="case-index mono">01 / Summary</p>
<div><h2 id="summary-title">Profile</h2><p class="large-copy">I help teams understand and improve mature software. My work spans product decisions, Angular interfaces, .NET services, data, integrations, delivery, and production diagnostics—with recent focus on safe AI access to business systems.</p></div>
</section>
<section class="cv-section shell" aria-labelledby="cv-experience-title">
<p class="case-index mono">02 / Career</p>
<div><h2 id="cv-experience-title">Experience</h2>
<div class="cv-roles">
@for (role of roles; track role.period + role.title) {
<article><div class="cv-role-head"><time class="mono">{{ role.period }}</time><div><h3>{{ role.title }}</h3><p>{{ role.company }}</p></div></div><p>{{ role.description }}</p></article>
}
</div>
</div>
</section>
<section class="cv-section shell" aria-labelledby="skills-title">
<p class="case-index mono">03 / Practice</p>
<div><h2 id="skills-title">Capabilities & tools</h2>
<div class="cv-skill-grid">
@for (group of skillGroups; track group.title) { <article><h3>{{ group.title }}</h3><p>{{ group.items }}</p></article> }
</div>
</div>
</section>
<section class="cv-section shell" aria-labelledby="learning-title">
<p class="case-index mono">04 / Learning</p>
<div><h2 id="learning-title">Selected courses</h2>
<div class="course-list">
@for (course of courses; track course.title) {
<article data-testid="course"><time class="mono">{{ course.period }}</time><h3>{{ course.title }}</h3><p>{{ course.provider }}</p></article>
}
</div>
</div>
</section>
<section class="contact-block shell" aria-labelledby="cv-contact-title">
<p class="eyebrow mono">Contact / Direct</p>
<h2 id="cv-contact-title">Let’s talk about the system you need to move forward.</h2>
<div class="contact-actions"><a class="button button-light" href="mailto:amar@dzanan.net">amar&#64;dzanan.net ↗</a><a class="text-link light" routerLink="/">Selected work →</a></div>
</section>
</app-page-shell>
`
})
export class CvPageComponent {
readonly sections = MAIN_NAVIGATION;
readonly roles = [
{ period: '2025—Present', company: 'Unija Smart Accounting BiH', title: 'Senior Software Engineer', description: 'Modernize enterprise platforms and deliver full-stack workflows, operational automation, secure integration paths, and AI-assisted capabilities.' },
{ period: 'Aug 2023—Present', company: 'COMP-2000', title: 'Product Owner', description: 'Shape product direction, manage priorities and backlog, align stakeholders, run reviews and retrospectives, and turn user feedback into delivery decisions.' },
{ period: 'Nov 2020—Present', company: 'COMP-2000', title: 'Software Developer', description: 'Design, implement, test, and maintain applications across .NET, C#, Angular, Blazor, Ionic, Web API, SQL Server, and .NET MAUI.' },
{ period: 'Nov 2018—2020', company: 'COMP-2000', title: 'Junior Software Developer', description: 'Built core engineering experience in C#, object-oriented design, SQL, Angular, Xamarin Forms, WPF, Windows Forms, and application lifecycle practices.' }
];
readonly skillGroups = [
{ title: 'Backend & data', items: '.NET, C#, ASP.NET Core, Web API, Entity Framework Core, SQL Server, PostgreSQL, PostGIS' },
{ title: 'Frontend & mobile', items: 'Angular, TypeScript, RxJS, Blazor, Ionic, .NET MAUI, Xamarin Forms, OpenLayers' },
{ title: 'Architecture & integration', items: 'CQRS, multitenancy, SignalR, identity, SOAP and HTTP integrations, Model Context Protocol' },
{ title: 'Delivery & operations', items: 'Docker, CI/CD, IIS, TLS, diagnostics, automated testing, incremental modernization' },
{ title: 'Product practice', items: 'Product ownership, backlog shaping, stakeholder alignment, sprint reviews, retrospectives, user feedback' },
{ title: 'Working style', items: 'End-to-end ownership, clear boundaries, pragmatic design, production awareness, cross-functional communication' }
];
readonly courses = [
{ title: 'Learn Go Course', provider: 'Codecademy', period: 'Apr 2024' },
{ title: 'Reactive Angular RxJS (Angular 17)', provider: 'Udemy', period: 'Mar 2024' },
{ title: 'C# Advanced Topics: Prepare for Technical Interviews', provider: 'Udemy', period: 'Sep 2021' },
{ title: 'Learning Docker', provider: 'LinkedIn Learning', period: 'Sep 2021' },
{ title: 'Learning Entity Framework Core', provider: 'LinkedIn Learning', period: 'May 2021' },
{ title: 'Building Web APIs with ASP.NET Core', provider: 'LinkedIn Learning', period: 'Aug 2020' },
{ title: 'Software Architecture Foundations', provider: 'LinkedIn Learning', period: 'Jul 2020' },
{ title: 'Linux Command Line', provider: 'Udemy', period: 'Jul 2018' }
];
constructor() {
inject(SeoService).update({
title: 'CV — Amar Džanan, Senior Software Engineer',
description: 'Experience, capabilities, and selected learning from senior full-stack engineer and product owner Amar Džanan.',
path: '/cv'
});
}
}