# edwarddiou/edwarddiou.github.io architecture

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

- Interactive diagram: https://gitdiagram.com/edwarddiou/edwarddiou.github.io
- Repository: https://github.com/edwarddiou/edwarddiou.github.io

## Overview

This repository is a static personal portfolio: it presents a home page, experience and resume material, and individual project showcases. The only sampled runtime code handles English/Chinese language selection, persisting the choice and updating document language and title. HTML pages and styles are represented from the tree, but their contents were not sampled; navigation and page-to-script wiring are therefore not asserted.

Main entry points: [`lang.js`](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/lang.js) (Language switching)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_portfolio["Portfolio pages"]
  node_home["Home page<br/>[index.html]"]
  node_experience["Experience page<br/>[experience.html]"]
  node_projects["Projects page<br/>[projects.html]"]
  node_resume["Resume resource"]
end

subgraph group_showcases["Project showcases"]
  node_rag["G3 RAG showcase<br/>[index.html]"]
  node_simulator["Customer simulator<br/>[index.html]"]
  node_insurance["Insurance advisor<br/>[index.html]"]
  node_tenfold["Tenfold showcase<br/>[index.html]"]
end

subgraph group_shared["Shared behavior"]
  node_language["Language switching<br/>[lang.js]"]
  node_styles["Site styles<br/>[styles.css]"]
end

node_visitor(("Visitor"))
node_browser_storage[("Browser local storage")]
node_document_dom["Browser document"]

node_language -->|"reads choice"| node_browser_storage
node_language -->|"saves choice"| node_browser_storage
node_language -->|"updates language and title"| node_document_dom
node_language -->|"binds language controls"| node_document_dom

click node_home "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/index.html"
click node_experience "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/experience.html"
click node_projects "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects.html"
click node_resume "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/resume"
click node_rag "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/G3_rag/index.html"
click node_simulator "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/ai_customer_simulator/index.html"
click node_insurance "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/insurance-advisor/index.html"
click node_tenfold "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/tenfold/index.html"
click node_language "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/lang.js"
click node_styles "https://github.com/edwarddiou/edwarddiou.github.io/blob/main/styles.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_experience,node_projects,node_resume,node_document_dom toneBlue
class node_rag,node_simulator,node_insurance,node_tenfold,node_browser_storage toneAmber
class node_language,node_styles toneMint
class node_visitor toneIndigo
```

## Components

### Portfolio pages

- [Home page](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/index.html): `index.html`
- [Experience page](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/experience.html): `experience.html`
- [Projects page](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects.html): `projects.html`
- [Resume resource](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/resume): `resume`

### Project showcases

- [G3 RAG showcase](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/G3_rag/index.html): `projects/G3_rag/index.html`
- [Customer simulator](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/ai_customer_simulator/index.html): `projects/ai_customer_simulator/index.html`
- [Insurance advisor](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/insurance-advisor/index.html): `projects/insurance-advisor/index.html`
- [Tenfold showcase](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/projects/tenfold/index.html): `projects/tenfold/index.html`

### Shared behavior

- [Language switching](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/lang.js): `lang.js`
- [Site styles](https://github.com/edwarddiou/edwarddiou.github.io/blob/main/styles.css): `styles.css`

### Other components

- **Visitor**
- **Browser local storage**
- **Browser document**

## Connections

- Language switching → Browser local storage: reads choice (evidence: `lang.js`)
- Language switching → Browser local storage: saves choice (evidence: `lang.js`)
- Language switching → Browser document: updates language and title (evidence: `lang.js`)
- Language switching → Browser document: binds language controls (evidence: `lang.js`)