# hubenchang0515/primers architecture

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

- Interactive diagram: https://gitdiagram.com/hubenchang0515/primers
- Repository: https://github.com/hubenchang0515/primers

## Overview

Primers is a multilingual documentation website. Readers browse language, category, and document pages; pages load Markdown and Git-derived document state, then render content and navigation. Search builds a document-heading tree on the server and filters it in the search interface. The tree also shows diagram, terminal, discussion, install, and sitemap capabilities, though their internal wiring was not sampled. Edges below reflect the supplied route and search source; uncertain component internals are omitted.

Main entry points: [`src/app/document/[lang]/page.tsx`](https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/page.tsx) (Language page), [`src/app/document/page.tsx`](https://github.com/hubenchang0515/primers/blob/master/src/app/document/page.tsx) (Document landing), [`src/app/document/[lang]/[category]/page.tsx`](https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/%5Bcategory%5D/page.tsx) (Category page), [`src/utils/document.ts`](https://github.com/hubenchang0515/primers/blob/master/src/utils/document.ts) (Document catalog)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_routes["Page routes"]
  node_document_root["Document landing<br/>[page.tsx]"]
  node_language_page["Language page<br/>[page.tsx]"]
  node_category_page["Category page<br/>[page.tsx]"]
  node_search_page["Search page<br/>[page.tsx]"]
  node_not_found_page["Not-found page<br/>[page.tsx]"]
  node_sitemap["Sitemap route<br/>[sitemap.ts]"]
  node_install_page["Install page<br/>[page.tsx]"]
end

subgraph group_content["Document data"]
  node_document_data["Document catalog<br/>[document.ts]"]
  node_git_state["Document history<br/>[git.ts]"]
  node_search_tree["Search tree<br/>[search.ts]"]
end

subgraph group_interface["Reader interface"]
  node_content_view["Content renderer<br/>[Content.tsx]"]
  node_main_page["Page shell<br/>[MainPage.tsx]"]
  node_navigation["Navigation<br/>[Navigation.tsx]"]
  node_catalog["Catalog<br/>[Catalog.tsx]"]
  node_search_ui["Search interface<br/>[Search.tsx]"]
  node_search_box["Search form<br/>[SearchBox.tsx]"]
end

subgraph group_features["Site features"]
  node_markdown["Markdown rendering<br/>[Markdown.tsx]"]
  node_diagrams["Diagram rendering<br/>[Mermaid.tsx]"]
  node_graphviz["Graphviz rendering<br/>[Graphviz.tsx]"]
  node_terminal["Terminal UI<br/>[Terminal.tsx]"]
  node_discussion["Discussion UI<br/>[Discussion.tsx]"]
  node_install_ui["PWA install UI<br/>[Install.tsx]"]
end

node_reader(("Reader"))
node_external_search["Web search services"]

node_reader -->|"opens docs"| node_document_root
node_reader -->|"browses language"| node_language_page
node_reader -->|"browses category"| node_category_page
node_reader -->|"searches docs"| node_search_page
node_reader -->|"opens install"| node_install_page
node_document_root -->|"loads content"| node_document_data
node_document_root -->|"loads state"| node_git_state
node_document_root -->|"renders content"| node_content_view
node_document_root -->|"renders shell"| node_main_page
node_document_root -->|"renders languages"| node_navigation
node_language_page -->|"loads content"| node_document_data
node_language_page -->|"loads state"| node_git_state
node_language_page -->|"renders content"| node_content_view
node_language_page -->|"renders shell"| node_main_page
node_language_page -->|"renders categories"| node_navigation
node_language_page -->|"renders search"| node_search_box
node_category_page -->|"loads catalog"| node_document_data
node_category_page -->|"loads state"| node_git_state
node_category_page -->|"renders content"| node_content_view
node_category_page -->|"renders shell"| node_main_page
node_category_page -->|"renders catalog"| node_catalog
node_search_page -->|"builds tree"| node_search_tree
node_search_page -->|"loads categories"| node_document_data
node_search_page -->|"renders shell"| node_main_page
node_search_page -->|"renders search"| node_search_ui
node_search_tree -->|"reads documents"| node_document_data
node_search_ui -->|"renders form"| node_search_box
node_search_ui -.->|"offers web search"| node_external_search
node_not_found_page -->|"builds tree"| node_search_tree
node_sitemap -->|"lists documents"| node_document_data
node_sitemap -->|"reads update times"| node_git_state
node_install_page -->|"renders install"| node_install_ui

click node_document_root "https://github.com/hubenchang0515/primers/blob/master/src/app/document/page.tsx"
click node_language_page "https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/page.tsx"
click node_category_page "https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/%5Bcategory%5D/page.tsx"
click node_search_page "https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/search/page.tsx"
click node_not_found_page "https://github.com/hubenchang0515/primers/blob/master/src/app/empty/page.tsx"
click node_sitemap "https://github.com/hubenchang0515/primers/blob/master/src/app/sitemap.ts"
click node_install_page "https://github.com/hubenchang0515/primers/blob/master/src/app/install/page.tsx"
click node_document_data "https://github.com/hubenchang0515/primers/blob/master/src/utils/document.ts"
click node_git_state "https://github.com/hubenchang0515/primers/blob/master/src/utils/git.ts"
click node_search_tree "https://github.com/hubenchang0515/primers/blob/master/src/utils/search.ts"
click node_content_view "https://github.com/hubenchang0515/primers/blob/master/src/components/Content.tsx"
click node_main_page "https://github.com/hubenchang0515/primers/blob/master/src/components/MainPage.tsx"
click node_navigation "https://github.com/hubenchang0515/primers/blob/master/src/components/Navigation.tsx"
click node_catalog "https://github.com/hubenchang0515/primers/blob/master/src/components/Catalog.tsx"
click node_search_ui "https://github.com/hubenchang0515/primers/blob/master/src/components/Search.tsx"
click node_search_box "https://github.com/hubenchang0515/primers/blob/master/src/components/SearchBox.tsx"
click node_markdown "https://github.com/hubenchang0515/primers/blob/master/src/components/Markdown.tsx"
click node_diagrams "https://github.com/hubenchang0515/primers/blob/master/src/components/Mermaid.tsx"
click node_graphviz "https://github.com/hubenchang0515/primers/blob/master/src/components/Graphviz.tsx"
click node_terminal "https://github.com/hubenchang0515/primers/blob/master/src/components/Terminal.tsx"
click node_discussion "https://github.com/hubenchang0515/primers/blob/master/src/components/Discussion.tsx"
click node_install_ui "https://github.com/hubenchang0515/primers/blob/master/src/components/Install.tsx"

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_document_root,node_language_page,node_category_page,node_search_page,node_not_found_page,node_sitemap,node_install_page toneBlue
class node_document_data,node_git_state,node_search_tree toneAmber
class node_content_view,node_main_page,node_navigation,node_catalog,node_search_ui,node_search_box toneMint
class node_markdown,node_diagrams,node_graphviz,node_terminal,node_discussion,node_install_ui toneRose
class node_reader,node_external_search toneIndigo
```

## Components

### Page routes

- [Document landing](https://github.com/hubenchang0515/primers/blob/master/src/app/document/page.tsx): `src/app/document/page.tsx`
- [Language page](https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/page.tsx): `src/app/document/[lang]/page.tsx`
- [Category page](https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/%5Bcategory%5D/page.tsx): `src/app/document/[lang]/[category]/page.tsx`
- [Search page](https://github.com/hubenchang0515/primers/blob/master/src/app/document/%5Blang%5D/search/page.tsx): `src/app/document/[lang]/search/page.tsx`
- [Not-found page](https://github.com/hubenchang0515/primers/blob/master/src/app/empty/page.tsx): `src/app/empty/page.tsx`
- [Sitemap route](https://github.com/hubenchang0515/primers/blob/master/src/app/sitemap.ts): `src/app/sitemap.ts`
- [Install page](https://github.com/hubenchang0515/primers/blob/master/src/app/install/page.tsx): `src/app/install/page.tsx`

### Document data

- [Document catalog](https://github.com/hubenchang0515/primers/blob/master/src/utils/document.ts): `src/utils/document.ts`
- [Document history](https://github.com/hubenchang0515/primers/blob/master/src/utils/git.ts): `src/utils/git.ts`
- [Search tree](https://github.com/hubenchang0515/primers/blob/master/src/utils/search.ts): `src/utils/search.ts`

### Reader interface

- [Content renderer](https://github.com/hubenchang0515/primers/blob/master/src/components/Content.tsx): `src/components/Content.tsx`
- [Page shell](https://github.com/hubenchang0515/primers/blob/master/src/components/MainPage.tsx): `src/components/MainPage.tsx`
- [Navigation](https://github.com/hubenchang0515/primers/blob/master/src/components/Navigation.tsx): `src/components/Navigation.tsx`
- [Catalog](https://github.com/hubenchang0515/primers/blob/master/src/components/Catalog.tsx): `src/components/Catalog.tsx`
- [Search interface](https://github.com/hubenchang0515/primers/blob/master/src/components/Search.tsx): `src/components/Search.tsx`
- [Search form](https://github.com/hubenchang0515/primers/blob/master/src/components/SearchBox.tsx): `src/components/SearchBox.tsx`

### Site features

- [Markdown rendering](https://github.com/hubenchang0515/primers/blob/master/src/components/Markdown.tsx): `src/components/Markdown.tsx`
- [Diagram rendering](https://github.com/hubenchang0515/primers/blob/master/src/components/Mermaid.tsx): `src/components/Mermaid.tsx`
- [Graphviz rendering](https://github.com/hubenchang0515/primers/blob/master/src/components/Graphviz.tsx): `src/components/Graphviz.tsx`
- [Terminal UI](https://github.com/hubenchang0515/primers/blob/master/src/components/Terminal.tsx): `src/components/Terminal.tsx`
- [Discussion UI](https://github.com/hubenchang0515/primers/blob/master/src/components/Discussion.tsx): `src/components/Discussion.tsx`
- [PWA install UI](https://github.com/hubenchang0515/primers/blob/master/src/components/Install.tsx): `src/components/Install.tsx`

### Other components

- **Reader**
- **Web search services**

## Connections

- Reader → Document landing: opens docs
- Reader → Language page: browses language
- Reader → Category page: browses category
- Reader → Search page: searches docs
- Reader → Install page: opens install
- Document landing → Document catalog: loads content
- Document landing → Document history: loads state
- Document landing → Content renderer: renders content
- Document landing → Page shell: renders shell
- Document landing → Navigation: renders languages
- Language page → Document catalog: loads content
- Language page → Document history: loads state
- Language page → Content renderer: renders content
- Language page → Page shell: renders shell
- Language page → Navigation: renders categories
- Language page → Search form: renders search
- Category page → Document catalog: loads catalog
- Category page → Document history: loads state
- Category page → Content renderer: renders content
- Category page → Page shell: renders shell
- Category page → Catalog: renders catalog
- Search page → Search tree: builds tree
- Search page → Document catalog: loads categories
- Search page → Page shell: renders shell
- Search page → Search interface: renders search
- Search tree → Document catalog: reads documents
- Search interface → Search form: renders form
- Search interface → Web search services: offers web search
- Not-found page → Search tree: builds tree
- Sitemap route → Document catalog: lists documents
- Sitemap route → Document history: reads update times
- Install page → PWA install UI: renders install