# mouredev/code-history-day-web architecture

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

- Interactive diagram: https://gitdiagram.com/mouredev/code-history-day-web
- Repository: https://github.com/mouredev/code-history-day-web

## Overview

Code History Day is a daily programming-and-technology history web app. A visitor opens the terminal-style page; it gets the visitor’s local date, requests that date’s ephemeris through the Next.js API, and displays a formatted event that can be shared on X. The API reads persistent records from Supabase. Separately, the documented daily generation process uses OpenAI and writes generated entries to Supabase. Source excerpts support the display/API flow; the generator’s integrations are documented in the README, not verified from its implementation here.

Main entry points: [`app/page.tsx`](https://github.com/mouredev/code-history-day-web/blob/main/app/page.tsx) (Terminal page), [`scripts/generate-daily-ephemeris.js`](https://github.com/mouredev/code-history-day-web/blob/main/scripts/generate-daily-ephemeris.js) (Daily generator), [`components/ui/sidebar.tsx`](https://github.com/mouredev/code-history-day-web/blob/main/components/ui/sidebar.tsx) (Responsive sidebar), [`lib/ephemerides.ts`](https://github.com/mouredev/code-history-day-web/blob/main/lib/ephemerides.ts) (Date and display logic)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Daily experience"]
  node_daily_page["Terminal page<br/>[page.tsx]"]
  node_x_service["X sharing"]
  node_browser_utils["Browser utilities<br/>[browser-utils.ts]"]
end

subgraph group_content["Ephemeris service"]
  node_display_logic["Date and display logic<br/>[ephemerides.ts]"]
  node_ephemeris_api["Ephemeris API<br/>[route.ts]"]
  node_supabase[("Supabase records")]
end

subgraph group_automation["Content generation"]
  node_generator["Daily generator"]
  node_openai["OpenAI"]
end

subgraph group_interface["UI foundations"]
  node_ui_components["Reusable UI components"]
  node_sidebar["Responsive sidebar<br/>[sidebar.tsx]"]
  node_mobile_hook["Mobile detection<br/>[use-mobile.tsx]"]
  node_toast_state["Toast state<br/>[use-toast.ts]"]
  node_toast_view["Toast presentation<br/>[toast.tsx]"]
  node_theme_provider["Theme provider<br/>[theme-provider.tsx]"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_daily_page
node_daily_page -->|"requests date"| node_display_logic
node_display_logic -->|"fetches date"| node_ephemeris_api
node_ephemeris_api -->|"reads records"| node_supabase
node_daily_page -->|"shares event"| node_x_service
node_generator -.->|"generates content"| node_openai
node_generator -.->|"stores entries"| node_supabase
node_daily_page -->|"gets OS info"| node_browser_utils
node_sidebar -->|"detects device"| node_mobile_hook
node_sidebar -->|"uses sheet and tooltip"| node_ui_components
node_toast_state -->|"uses toast types"| node_toast_view
node_daily_page -.->|"renders interface"| node_ui_components

click node_daily_page "https://github.com/mouredev/code-history-day-web/blob/main/app/page.tsx"
click node_display_logic "https://github.com/mouredev/code-history-day-web/blob/main/lib/ephemerides.ts"
click node_ephemeris_api "https://github.com/mouredev/code-history-day-web/blob/main/app/api/ephemerides/route.ts"
click node_generator "https://github.com/mouredev/code-history-day-web/blob/main/scripts/generate-daily-ephemeris.js"
click node_ui_components "https://github.com/mouredev/code-history-day-web/tree/main/components/ui"
click node_sidebar "https://github.com/mouredev/code-history-day-web/blob/main/components/ui/sidebar.tsx"
click node_mobile_hook "https://github.com/mouredev/code-history-day-web/blob/main/hooks/use-mobile.tsx"
click node_toast_state "https://github.com/mouredev/code-history-day-web/blob/main/hooks/use-toast.ts"
click node_toast_view "https://github.com/mouredev/code-history-day-web/blob/main/components/ui/toast.tsx"
click node_browser_utils "https://github.com/mouredev/code-history-day-web/blob/main/lib/browser-utils.ts"
click node_theme_provider "https://github.com/mouredev/code-history-day-web/blob/main/components/theme-provider.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_daily_page,node_x_service,node_browser_utils toneBlue
class node_display_logic,node_ephemeris_api,node_supabase toneAmber
class node_generator,node_openai toneMint
class node_ui_components,node_sidebar,node_mobile_hook,node_toast_state,node_toast_view,node_theme_provider toneRose
class node_visitor toneIndigo
```

## Components

### Daily experience

- [Terminal page](https://github.com/mouredev/code-history-day-web/blob/main/app/page.tsx): `app/page.tsx`
- **X sharing**
- [Browser utilities](https://github.com/mouredev/code-history-day-web/blob/main/lib/browser-utils.ts): `lib/browser-utils.ts`

### Ephemeris service

- [Date and display logic](https://github.com/mouredev/code-history-day-web/blob/main/lib/ephemerides.ts): `lib/ephemerides.ts`
- [Ephemeris API](https://github.com/mouredev/code-history-day-web/blob/main/app/api/ephemerides/route.ts): `app/api/ephemerides/route.ts`
- **Supabase records**

### Content generation

- [Daily generator](https://github.com/mouredev/code-history-day-web/blob/main/scripts/generate-daily-ephemeris.js): `scripts/generate-daily-ephemeris.js`
- **OpenAI**

### UI foundations

- [Reusable UI components](https://github.com/mouredev/code-history-day-web/tree/main/components/ui): `components/ui`
- [Responsive sidebar](https://github.com/mouredev/code-history-day-web/blob/main/components/ui/sidebar.tsx): `components/ui/sidebar.tsx`
- [Mobile detection](https://github.com/mouredev/code-history-day-web/blob/main/hooks/use-mobile.tsx): `hooks/use-mobile.tsx`
- [Toast state](https://github.com/mouredev/code-history-day-web/blob/main/hooks/use-toast.ts): `hooks/use-toast.ts`
- [Toast presentation](https://github.com/mouredev/code-history-day-web/blob/main/components/ui/toast.tsx): `components/ui/toast.tsx`
- [Theme provider](https://github.com/mouredev/code-history-day-web/blob/main/components/theme-provider.tsx): `components/theme-provider.tsx`

### Other components

- **Visitor**

## Connections

- Visitor → Terminal page: opens
- Terminal page → Date and display logic: requests date (evidence: `app/page.tsx`)
- Date and display logic → Ephemeris API: fetches date (evidence: `lib/ephemerides.ts`)
- Ephemeris API → Supabase records: reads records (evidence: `app/api/ephemerides/route.ts`)
- Terminal page → X sharing: shares event (evidence: `app/page.tsx`)
- Daily generator → OpenAI: generates content
- Daily generator → Supabase records: stores entries
- Terminal page → Browser utilities: gets OS info (evidence: `app/page.tsx`)
- Responsive sidebar → Mobile detection: detects device (evidence: `components/ui/sidebar.tsx`)
- Responsive sidebar → Reusable UI components: uses sheet and tooltip (evidence: `components/ui/sidebar.tsx`)
- Toast state → Toast presentation: uses toast types (evidence: `hooks/use-toast.ts`)
- Terminal page → Reusable UI components: renders interface (evidence: `app/page.tsx`)