# ever-purple/dreamcore-portfolio architecture

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

- Interactive diagram: https://gitdiagram.com/ever-purple/dreamcore-portfolio
- Repository: https://github.com/ever-purple/dreamcore-portfolio

## Overview

Dreamcore Portfolio is a personal portfolio site whose main visitor journey runs from a timed loader through a scroll-driven, frame-animated home page into an interactive studio. The studio opens an About desktop, an editable internship diary, works and media showcases, and other portfolio areas. In author mode, the inspiration collection supports link and media entry, editing, and persistence through a content API or browser storage. The graph follows documented capabilities and shown module references; some detailed runtime wiring is unsampled, so uncertain relationships are omitted.

Main entry points: [`src/App.tsx`](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/App.tsx) (App flow), [`src/components/ObjectZone.tsx`](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/ObjectZone.tsx) (Studio hotspots), [`src/sections/StudioSection.tsx`](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/sections/StudioSection.tsx) (Studio scene), [`src/lib/contentApi.ts`](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/contentApi.ts) (Content API)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Visitor Experience"]
  node_app["App flow<br/>[App.tsx]"]
  node_loader["Loading screen<br/>[LoadingScreen.tsx]"]
  node_home["Scroll home<br/>[HomeSection.tsx]"]
end

subgraph group_studio["Studio Destinations"]
  node_studio["Studio scene<br/>[StudioSection.tsx]"]
  node_studio_objects["Studio hotspots<br/>[ObjectZone.tsx]"]
  node_studio_menu["Studio menu<br/>[StudioMenu.tsx]"]
  node_diary["Internship diary"]
  node_diary_editor["Diary editor<br/>[DiaryCanvas.tsx]"]
  node_diary_state["Diary state<br/>[context.tsx]"]
  node_diary_storage[("Diary persistence<br/>[storage.ts]")]
  node_works["Works showcase<br/>[WorksCarousel.tsx]"]
  node_media["Creative media"]
  node_copy_projects["Copy projects"]
end

subgraph group_about["About Desktop"]
  node_greenos["Green OS desktop<br/>[GreenOs.tsx]"]
  node_about_overlay["About sections<br/>[AboutOverlay.tsx]"]
end

subgraph group_authoring["Authoring"]
  node_inspiration["Inspiration editor"]
  node_admin["Author mode<br/>[AdminContext.tsx]"]
end

subgraph group_services["Content Services"]
  node_content_api["Content API<br/>[contentApi.ts]"]
  node_blob_store[("Browser media store<br/>[blobStore.ts]")]
  node_link_meta["Link metadata service<br/>[link-meta.ts]"]
  node_visitor_log["Visit logging<br/>[visitLog.ts]"]
end

node_visitor(("Site visitor"))
node_remote_content["Configured content backend"]
node_platforms["Music and link platforms"]

node_visitor -->|"opens site"| node_app
node_app -->|"shows loading"| node_loader
node_app -->|"renders"| node_home
node_app -->|"renders"| node_studio
node_loader -->|"hands off"| node_home
node_home -->|"opens studio"| node_studio
node_studio -->|"renders hotspots"| node_studio_objects
node_studio -->|"renders menu"| node_studio_menu
node_studio_objects -->|"opens About"| node_about_overlay
node_studio_objects -->|"opens diary"| node_diary
node_studio_objects -->|"opens Works"| node_works
node_studio_objects -->|"opens Creative Lab"| node_media
node_studio -->|"renders destination"| node_copy_projects
node_diary -->|"hosts editor"| node_diary_editor
node_diary_editor -->|"edits state"| node_diary_state
node_diary_state -->|"loads and saves"| node_diary_storage
node_about_overlay -->|"renders desktop"| node_greenos
node_about_overlay -->|"renders section"| node_inspiration
node_admin -->|"migrates content"| node_content_api
node_inspiration -->|"reads and edits"| node_content_api
node_content_api -->|"uses local media"| node_blob_store
node_content_api -.->|"uses configured backend"| node_remote_content
node_inspiration -->|"requests metadata"| node_link_meta
node_link_meta -->|"identifies links"| node_platforms
node_app -->|"records visits"| node_visitor_log

click node_app "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/App.tsx"
click node_loader "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/LoadingScreen.tsx"
click node_home "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/sections/HomeSection.tsx"
click node_studio "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/sections/StudioSection.tsx"
click node_studio_objects "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/ObjectZone.tsx"
click node_studio_menu "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/StudioMenu.tsx"
click node_diary "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/NotebookOverlay.tsx"
click node_diary_editor "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/diary-editor/DiaryCanvas.tsx"
click node_diary_state "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/diary-editor/context.tsx"
click node_diary_storage "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/diary-editor/storage.ts"
click node_works "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/WorksCarousel.tsx"
click node_media "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/MediaGalleryPage.tsx"
click node_copy_projects "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/CopyProjectPage.tsx"
click node_greenos "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/GreenOs.tsx"
click node_about_overlay "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/AboutOverlay.tsx"
click node_inspiration "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/AboutInspiration.tsx"
click node_admin "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/context/AdminContext.tsx"
click node_content_api "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/contentApi.ts"
click node_blob_store "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/blobStore.ts"
click node_link_meta "https://github.com/ever-purple/dreamcore-portfolio/blob/main/link-meta.ts"
click node_visitor_log "https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/visitLog.ts"

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_app,node_loader,node_home toneBlue
class node_studio,node_studio_objects,node_studio_menu,node_diary,node_diary_editor,node_diary_state,node_diary_storage,node_works,node_media,node_copy_projects toneAmber
class node_greenos,node_about_overlay toneMint
class node_inspiration,node_admin toneRose
class node_content_api,node_blob_store,node_link_meta,node_visitor_log,node_visitor,node_remote_content,node_platforms toneIndigo
```

## Components

### Visitor Experience

- [App flow](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/App.tsx): `src/App.tsx`
- [Loading screen](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/LoadingScreen.tsx): `src/components/LoadingScreen.tsx`
- [Scroll home](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/sections/HomeSection.tsx): `src/sections/HomeSection.tsx`

### Studio Destinations

- [Studio scene](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/sections/StudioSection.tsx): `src/sections/StudioSection.tsx`
- [Studio hotspots](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/ObjectZone.tsx): `src/components/ObjectZone.tsx`
- [Studio menu](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/StudioMenu.tsx): `src/components/StudioMenu.tsx`
- [Internship diary](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/NotebookOverlay.tsx): `src/components/NotebookOverlay.tsx`
- [Diary editor](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/diary-editor/DiaryCanvas.tsx): `src/components/diary-editor/DiaryCanvas.tsx`
- [Diary state](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/diary-editor/context.tsx): `src/lib/diary-editor/context.tsx`
- [Diary persistence](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/diary-editor/storage.ts): `src/lib/diary-editor/storage.ts`
- [Works showcase](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/WorksCarousel.tsx): `src/components/WorksCarousel.tsx`
- [Creative media](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/MediaGalleryPage.tsx): `src/components/MediaGalleryPage.tsx`
- [Copy projects](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/CopyProjectPage.tsx): `src/components/CopyProjectPage.tsx`

### About Desktop

- [Green OS desktop](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/GreenOs.tsx): `src/components/GreenOs.tsx`
- [About sections](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/AboutOverlay.tsx): `src/components/AboutOverlay.tsx`

### Authoring

- [Inspiration editor](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/components/AboutInspiration.tsx): `src/components/AboutInspiration.tsx`
- [Author mode](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/context/AdminContext.tsx): `src/context/AdminContext.tsx`

### Content Services

- [Content API](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/contentApi.ts): `src/lib/contentApi.ts`
- [Browser media store](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/blobStore.ts): `src/lib/blobStore.ts`
- [Link metadata service](https://github.com/ever-purple/dreamcore-portfolio/blob/main/link-meta.ts): `link-meta.ts`
- [Visit logging](https://github.com/ever-purple/dreamcore-portfolio/blob/main/src/lib/visitLog.ts): `src/lib/visitLog.ts`

### Other components

- **Site visitor**
- **Configured content backend**
- **Music and link platforms**

## Connections

- Site visitor → App flow: opens site (evidence: `README.md`)
- App flow → Loading screen: shows loading (evidence: `src/App.tsx`)
- App flow → Scroll home: renders (evidence: `src/App.tsx`)
- App flow → Studio scene: renders (evidence: `src/App.tsx`)
- Loading screen → Scroll home: hands off (evidence: `README.md`)
- Scroll home → Studio scene: opens studio (evidence: `README.md`)
- Studio scene → Studio hotspots: renders hotspots (evidence: `src/sections/StudioSection.tsx`)
- Studio scene → Studio menu: renders menu (evidence: `src/sections/StudioSection.tsx`)
- Studio hotspots → About sections: opens About (evidence: `README.md`)
- Studio hotspots → Internship diary: opens diary (evidence: `README.md`)
- Studio hotspots → Works showcase: opens Works (evidence: `README.md`)
- Studio hotspots → Creative media: opens Creative Lab (evidence: `README.md`)
- Studio scene → Copy projects: renders destination (evidence: `src/sections/StudioSection.tsx`)
- Internship diary → Diary editor: hosts editor (evidence: `src/components/NotebookOverlay.tsx`)
- Diary editor → Diary state: edits state (evidence: `src/components/diary-editor/DiaryCanvas.tsx`)
- Diary state → Diary persistence: loads and saves (evidence: `src/lib/diary-editor/context.tsx`)
- About sections → Green OS desktop: renders desktop (evidence: `src/components/AboutOverlay.tsx`)
- About sections → Inspiration editor: renders section (evidence: `src/components/AboutOverlay.tsx`)
- Author mode → Content API: migrates content (evidence: `src/context/AdminContext.tsx`)
- Inspiration editor → Content API: reads and edits (evidence: `src/components/AboutInspiration.tsx`)
- Content API → Browser media store: uses local media (evidence: `src/lib/contentApi.ts`)
- Content API → Configured content backend: uses configured backend (evidence: `README.md`)
- Inspiration editor → Link metadata service: requests metadata (evidence: `src/components/AboutInspiration.tsx`)
- Link metadata service → Music and link platforms: identifies links (evidence: `README.md`)
- App flow → Visit logging: records visits (evidence: `src/App.tsx`)