# aramjonghu-site

![Homepage](./assets/homepage.png)

Personal website and central hub for my projects, systems, and self-hosted services.

This site is not just a portfolio — it acts as an entry point into a larger ecosystem of applications, infrastructure, and experiments.

## Overview

The site is divided into two conceptual layers:

### 1. Tabs (Home)

The homepage provides tabs for three sections:

- **Projects** — fetches and renders READMEs from self-hosted Forgejo repositories via raw URL
- **Current-activity** — language learning progress and active work
- **About** — personal background, philosophy, and Q&A

### 2. Header

The header serves as a navigation layer into my self-hosted infrastructure. Each entry links to a running instance.

- Nextcloud — file storage and synchronization
- Navidrome — personal music streaming
- Forgejo Git — Git hosting and development platform
- Stream — live media platform powered by MediaMTX (internal route)
- Omnisearch — privacy-focused search engine
- Gitea zach-dev — external development collaboration

## Stack

| Layer     | Choice                       | Notes                                     |
| --------- | ---------------------------- | ----------------------------------------- |
| Language  | TypeScript / React 19        | Vite 8 + rolldown                         |
| CSS       | TailwindCSS v4               | Catppuccin macchiato/latte                |
| Markdown  | react-markdown v10           | remark-gfm, rehype-raw, rehype-sanitize   |
| Syntax HL | Shiki v4                     | Catppuccin themes, CSS variable switching |
| Font      | Inter (self-hosted, 4 WOFF2) | no Google Fonts                           |
| Theme     | Catppuccin macchiato/latte   | JS toggle, persisted to localStorage      |
| Git host  | Forgejo (self-hosted)        | git.aramjonghu.dev                        |

## Philosophy

This site is intentionally minimal and system-oriented.

Instead of a traditional portfolio, it focuses on:

- self-hosted infrastructure
- modular services
- curated project visibility
- long-term experimentation

It evolves alongside my personal development and technical interests.

## Project layout

```
├── public/               favicon
├── src/
│   ├── assets/           images, fonts, logo
│   ├── components/       MdProcessor, Header, Layout, ProjectInfo, ...
│   ├── content/          about.md, current-activity.md, projects.json
│   ├── hooks/            useTheme
│   ├── pages/            Home
│   └── utils/            theme, highlighter
├── index.html
├── package.json
└── LICENSE
```

## License

BSD 3-Clause. See [LICENSE](https://git.aramjonghu.dev/AramJonghu/aramjonghu-site/src/branch/master/LICENSE).