# tunsopheak/my-portfolio-tun-sopheak architecture

> Architecture diagram of the GitHub repository tunsopheak/my-portfolio-tun-sopheak, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-11). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/tunsopheak/my-portfolio-tun-sopheak
- Repository: https://github.com/tunsopheak/my-portfolio-tun-sopheak

## Overview

This repository is a personal developer portfolio: visitors browse the home page and its project, activity, and achievement content. Its documented capabilities include data-driven project details, an EmailJS contact form, persistent dark/light mode, and scroll-spy navigation. The graph shows those product branches and the content/configuration layer; several source files, including the page and component implementations, were not sampled, so their internal call relationships are not inferred.

Main entry points: [`src/pages/projects/index.astro`](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/projects/index.astro) (Project Listings), [`src/pages/projects/[id].astro`](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/projects/%5Bid%5D.astro) (Project Details), [`src/pages/activities/index.astro`](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/activities/index.astro) (Activity Listings), [`src/pages/activities/[id].astro`](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/activities/%5Bid%5D.astro) (Activity Details)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Visitor Experience"]
  node_home["Home Page<br/>[index.astro]"]
  node_project_list["Project Listings<br/>[index.astro]"]
  node_project_detail["Project Details<br/>[&#91;id&#93;.astro]"]
  node_activity_list["Activity Listings<br/>[index.astro]"]
  node_activity_detail["Activity Details<br/>[&#91;id&#93;.astro]"]
  node_achievement_list["Achievements<br/>[index.astro]"]
end

subgraph group_content["Portfolio Content"]
  node_project_data["Project Data<br/>[projects.js]"]
  node_activity_data["Activity Data<br/>[activities.js]"]
  node_achievement_data["Achievement Data<br/>[achievements.js]"]
  node_content_types["Content Types<br/>[types.ts]"]
  node_asset_config["Drive Asset URLs<br/>[assets.ts]"]
end

subgraph group_shared["Shared Presentation"]
  node_base_layout["Base Layout<br/>[BaseLayout.astro]"]
  node_header["Navigation<br/>[Header.astro]"]
  node_footer["Footer<br/>[Footer.astro]"]
  node_back_to_top["Back To Top<br/>[BackToTop.astro]"]
  node_global_styles["Theme Styles<br/>[global.css]"]
end

subgraph group_integrations["External Services"]
  node_emailjs{{"EmailJS"}}
end

node_visitor(("Visitor"))

node_visitor -->|"visits"| node_home
node_visitor -->|"browses"| node_project_list
node_visitor -->|"opens details"| node_project_detail
node_visitor -->|"browses"| node_activity_list
node_visitor -->|"opens details"| node_activity_detail
node_visitor -->|"views"| node_achievement_list
node_project_list -->|"renders from"| node_project_data
node_project_detail -->|"routes from"| node_project_data
node_activity_list -.->|"presents"| node_activity_data
node_activity_detail -.->|"presents"| node_activity_data
node_achievement_list -.->|"presents"| node_achievement_data
node_achievement_data -->|"gets PDF URL"| node_asset_config
node_visitor -->|"sends message"| node_emailjs
node_visitor -->|"uses theme toggle"| node_header
node_header -.->|"applies theme"| node_global_styles

click node_home "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/index.astro"
click node_project_list "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/projects/index.astro"
click node_project_detail "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/projects/%5Bid%5D.astro"
click node_activity_list "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/activities/index.astro"
click node_activity_detail "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/activities/%5Bid%5D.astro"
click node_achievement_list "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/achievements/index.astro"
click node_project_data "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/projects.js"
click node_activity_data "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/activities.js"
click node_achievement_data "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/achievements.js"
click node_content_types "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/types.ts"
click node_asset_config "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/config/assets.ts"
click node_base_layout "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/layouts/BaseLayout.astro"
click node_header "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/components/Header.astro"
click node_footer "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/components/Footer.astro"
click node_back_to_top "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/components/BackToTop.astro"
click node_global_styles "https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/styles/global.css"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_home,node_project_list,node_project_detail,node_activity_list,node_activity_detail,node_achievement_list toneBlue
class node_project_data,node_activity_data,node_achievement_data,node_content_types,node_asset_config toneAmber
class node_base_layout,node_header,node_footer,node_back_to_top,node_global_styles toneMint
class node_emailjs toneRose
class node_visitor toneIndigo
```

## Components

### Visitor Experience

- [Home Page](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/index.astro): `src/pages/index.astro`
- [Project Listings](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/projects/index.astro): `src/pages/projects/index.astro`
- [Project Details](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/projects/%5Bid%5D.astro): `src/pages/projects/[id].astro`
- [Activity Listings](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/activities/index.astro): `src/pages/activities/index.astro`
- [Activity Details](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/activities/%5Bid%5D.astro): `src/pages/activities/[id].astro`
- [Achievements](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/pages/achievements/index.astro): `src/pages/achievements/index.astro`

### Portfolio Content

- [Project Data](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/projects.js): `src/data/projects.js`
- [Activity Data](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/activities.js): `src/data/activities.js`
- [Achievement Data](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/achievements.js): `src/data/achievements.js`
- [Content Types](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/data/types.ts): `src/data/types.ts`
- [Drive Asset URLs](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/config/assets.ts): `src/config/assets.ts`

### Shared Presentation

- [Base Layout](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/layouts/BaseLayout.astro): `src/layouts/BaseLayout.astro`
- [Navigation](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/components/Header.astro): `src/components/Header.astro`
- [Footer](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/components/Footer.astro): `src/components/Footer.astro`
- [Back To Top](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/components/BackToTop.astro): `src/components/BackToTop.astro`
- [Theme Styles](https://github.com/tunsopheak/my-portfolio-tun-sopheak/blob/main/src/styles/global.css): `src/styles/global.css`

### External Services

- **EmailJS**

### Other components

- **Visitor**

## Connections

- Visitor → Home Page: visits (evidence: `README.md`)
- Visitor → Project Listings: browses (evidence: `README.md`)
- Visitor → Project Details: opens details (evidence: `README.md`)
- Visitor → Activity Listings: browses (evidence: `README.md`)
- Visitor → Activity Details: opens details (evidence: `README.md`)
- Visitor → Achievements: views (evidence: `README.md`)
- Project Listings → Project Data: renders from (evidence: `README.md`)
- Project Details → Project Data: routes from (evidence: `README.md`)
- Activity Listings → Activity Data: presents
- Activity Details → Activity Data: presents
- Achievements → Achievement Data: presents
- Achievement Data → Drive Asset URLs: gets PDF URL (evidence: `src/data/achievements.js`)
- Visitor → EmailJS: sends message (evidence: `README.md`)
- Visitor → Navigation: uses theme toggle (evidence: `README.md`)
- Navigation → Theme Styles: applies theme