Portfolio architecture

Angular 22.1.2, NgModule-based application, zone.js change detection. No backend: the site is static and prerendered.

Angular 22 is on Active support, not LTS: the long-term-support lines are 21 and 20.

Layout

src/app/
  core/         shared data and models (profile, career, tokens, documents)
  services/     application state (preferences, i18n, SEO, terminal, commands)
  shared/       translation pipes, panel and drawer directives
  component/    pages and IDE components
  i18n/         IT/EN dictionary

Single sources

Every public fact lives in exactly one place:

core/profile.ts — name, contacts, URLs, CV, availability
core/career.ts — experience, education, skills, languages
core/projects.ts — projects
i18n/translations.ts — interface strings

The code view does not copy this data, it regenerates it. Changing a field in profile.ts updates the interface, the displayed source, the terminal, the command palette and the structured data together. It used to not be so, and the email in the code view had drifted to an example address while the UI showed a different one.

The IDE interface

It is not decoration, it is the navigation system. Editor tabs are the pages, the explorer is the index, the command palette (Ctrl+K) is search, and the terminal takes real commands.

Every action exists in at least two places — button, command, palette entry — so understanding the metaphor is never a prerequisite for using the site.

Anyone who has never used an editor gets a six-step guided tour that highlights the tabs, the file tree, search, the two views and the status bar: it lives in the Help menu, in the palette and in the terminal (tour), and a notification offers it on the first visit, once. File names in the tree carry a tooltip saying what is behind them, and Markdown documents open as a formatted preview, with the source one click away.

Preferences

PreferencesService stores only what the user explicitly chose. Motion follows prefers-reduced-motion until someone chooses; the theme starts dark, on the first visit and after a reset, and light is a choice in the settings.

Storage is read with guarded parsing, per-key validation and migration: corrupted JSON, denied storage or wrong types do not stop the app from starting. Those cases are covered by services/preferences.service.spec.ts.

What is deliberately absent

no backend, no API
no analytics, no trackers, no cookies
no requests to third-party domains (fonts included)
no component library beyond Bootstrap's CSS