# oedesign/wdd231 architecture

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

- Interactive diagram: https://gitdiagram.com/oedesign/wdd231
- Repository: https://github.com/oedesign/wdd231

## Overview

This repository is a BYU–Idaho web-development coursework collection: a course portfolio plus separate Chamber of Commerce, Feed the Nation, and service-directory sites. Visitors browse course information, chamber listings and discovery content, or service listings and details; the chamber site also supports a membership form and confirmation page. The service site loads JSON listings, renders/filter cards, and offers favorites, saved video links, lazy images, and modal details. Several capabilities are documented in source comments but their wiring was not sampled, so those are shown without speculative connections.

Main entry points: [`chamber/scripts/home.js`](https://github.com/oedesign/wdd231/blob/main/chamber/scripts/home.js) (Weather and forecast), [`finalproject/scripts/main.js`](https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/main.js) (Browse and manage listings), [`finalproject/scripts/data.js`](https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/data.js) (Service data fetcher), [`chamber/data/members.json`](https://github.com/oedesign/wdd231/blob/main/chamber/data/members.json) (Member records)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_portfolio["Course portfolio"]
  node_portfolio_site["Course portfolio<br/>[index.html]"]
  node_course_catalog["Course catalog<br/>[scripts.js]"]
end

subgraph group_chamber["Chamber site"]
  node_chamber_home["Chamber home<br/>[index.html]"]
  node_member_directory["Member directory<br/>[main.js]"]
  node_member_records[("Member records<br/>[members.json]")]
  node_chamber_weather["Weather and forecast<br/>[home.js]"]
  node_discover_page["Discover places<br/>[discover.js]"]
  node_place_catalog["Place catalog<br/>[items.mjs]"]
  node_join_form["Membership form<br/>[join.js]"]
  node_confirmation["Form confirmation<br/>[thankyou.js]"]
  node_chamber_directory_page["Directory page<br/>[directory.html]"]
end

subgraph group_feed["Feed the Nation"]
  node_feed_site["Feed the Nation<br/>[index.html]"]
  node_feed_navigation["Mobile navigation<br/>[main.js]"]
end

subgraph group_services["Service directory"]
  node_service_site["Service browsing site<br/>[index.html]"]
  node_service_controller["Browse and manage listings<br/>[main.js]"]
  node_service_fetcher["Service data fetcher<br/>[data.js]"]
  node_service_records[("Service listings<br/>[services.json]")]
  node_service_modal["Details modal<br/>[modal.js]"]
  node_service_resources["Resources page<br/>[resources.html]"]
  node_service_about["About page<br/>[about.html]"]
  node_service_form["Form action page<br/>[form-action.html]"]
end

node_visitor(("Site visitor"))
node_weather_service["Weather service<br/>external service"]

node_member_directory -->|"fetches"| node_member_records
node_chamber_weather -->|"fetches spotlights"| node_member_records
node_chamber_weather -->|"requests weather"| node_weather_service
node_discover_page -->|"renders places"| node_place_catalog
node_join_form -->|"submits to"| node_confirmation
node_service_controller -->|"loads services"| node_service_fetcher
node_service_fetcher -->|"fetches JSON"| node_service_records
node_service_controller -->|"opens details"| node_service_modal

click node_portfolio_site "https://github.com/oedesign/wdd231/blob/main/index.html"
click node_course_catalog "https://github.com/oedesign/wdd231/blob/main/scripts/scripts.js"
click node_chamber_home "https://github.com/oedesign/wdd231/blob/main/chamber/index.html"
click node_member_directory "https://github.com/oedesign/wdd231/blob/main/chamber/scripts/main.js"
click node_member_records "https://github.com/oedesign/wdd231/blob/main/chamber/data/members.json"
click node_chamber_weather "https://github.com/oedesign/wdd231/blob/main/chamber/scripts/home.js"
click node_discover_page "https://github.com/oedesign/wdd231/blob/main/chamber/scripts/discover.js"
click node_place_catalog "https://github.com/oedesign/wdd231/blob/main/chamber/data/items.mjs"
click node_join_form "https://github.com/oedesign/wdd231/blob/main/chamber/scripts/join.js"
click node_confirmation "https://github.com/oedesign/wdd231/blob/main/chamber/scripts/thankyou.js"
click node_chamber_directory_page "https://github.com/oedesign/wdd231/blob/main/chamber/directory.html"
click node_feed_site "https://github.com/oedesign/wdd231/blob/main/feed%20the%20nation/index.html"
click node_feed_navigation "https://github.com/oedesign/wdd231/blob/main/feed%20the%20nation/scripts/main.js"
click node_service_site "https://github.com/oedesign/wdd231/blob/main/finalproject/index.html"
click node_service_controller "https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/main.js"
click node_service_fetcher "https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/data.js"
click node_service_records "https://github.com/oedesign/wdd231/blob/main/finalproject/data/services.json"
click node_service_modal "https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/modal.js"
click node_service_resources "https://github.com/oedesign/wdd231/blob/main/finalproject/resources.html"
click node_service_about "https://github.com/oedesign/wdd231/blob/main/finalproject/about.html"
click node_service_form "https://github.com/oedesign/wdd231/blob/main/finalproject/form-action.html"

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_portfolio_site,node_course_catalog toneBlue
class node_chamber_home,node_member_directory,node_member_records,node_chamber_weather,node_discover_page,node_place_catalog,node_join_form,node_confirmation,node_chamber_directory_page toneAmber
class node_feed_site,node_feed_navigation toneMint
class node_service_site,node_service_controller,node_service_fetcher,node_service_records,node_service_modal,node_service_resources,node_service_about,node_service_form toneRose
class node_visitor,node_weather_service toneIndigo
```

## Components

### Course portfolio

- [Course portfolio](https://github.com/oedesign/wdd231/blob/main/index.html): `index.html`
- [Course catalog](https://github.com/oedesign/wdd231/blob/main/scripts/scripts.js): `scripts/scripts.js`

### Chamber site

- [Chamber home](https://github.com/oedesign/wdd231/blob/main/chamber/index.html): `chamber/index.html`
- [Member directory](https://github.com/oedesign/wdd231/blob/main/chamber/scripts/main.js): `chamber/scripts/main.js`
- [Member records](https://github.com/oedesign/wdd231/blob/main/chamber/data/members.json): `chamber/data/members.json`
- [Weather and forecast](https://github.com/oedesign/wdd231/blob/main/chamber/scripts/home.js): `chamber/scripts/home.js`
- [Discover places](https://github.com/oedesign/wdd231/blob/main/chamber/scripts/discover.js): `chamber/scripts/discover.js`
- [Place catalog](https://github.com/oedesign/wdd231/blob/main/chamber/data/items.mjs): `chamber/data/items.mjs`
- [Membership form](https://github.com/oedesign/wdd231/blob/main/chamber/scripts/join.js): `chamber/scripts/join.js`
- [Form confirmation](https://github.com/oedesign/wdd231/blob/main/chamber/scripts/thankyou.js): `chamber/scripts/thankyou.js`
- [Directory page](https://github.com/oedesign/wdd231/blob/main/chamber/directory.html): `chamber/directory.html`

### Feed the Nation

- [Feed the Nation](https://github.com/oedesign/wdd231/blob/main/feed%20the%20nation/index.html): `feed the nation/index.html`
- [Mobile navigation](https://github.com/oedesign/wdd231/blob/main/feed%20the%20nation/scripts/main.js): `feed the nation/scripts/main.js`

### Service directory

- [Service browsing site](https://github.com/oedesign/wdd231/blob/main/finalproject/index.html): `finalproject/index.html`
- [Browse and manage listings](https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/main.js): `finalproject/scripts/main.js`
- [Service data fetcher](https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/data.js): `finalproject/scripts/data.js`
- [Service listings](https://github.com/oedesign/wdd231/blob/main/finalproject/data/services.json): `finalproject/data/services.json`
- [Details modal](https://github.com/oedesign/wdd231/blob/main/finalproject/scripts/modal.js): `finalproject/scripts/modal.js`
- [Resources page](https://github.com/oedesign/wdd231/blob/main/finalproject/resources.html): `finalproject/resources.html`
- [About page](https://github.com/oedesign/wdd231/blob/main/finalproject/about.html): `finalproject/about.html`
- [Form action page](https://github.com/oedesign/wdd231/blob/main/finalproject/form-action.html): `finalproject/form-action.html`

### Other components

- **Site visitor**
- **Weather service**: external service

## Connections

- Member directory → Member records: fetches (evidence: `chamber/scripts/main.js`)
- Weather and forecast → Member records: fetches spotlights (evidence: `chamber/scripts/home.js`)
- Weather and forecast → Weather service: requests weather (evidence: `chamber/scripts/home.js`)
- Discover places → Place catalog: renders places (evidence: `chamber/scripts/discover.js`)
- Membership form → Form confirmation: submits to (evidence: `chamber/scripts/join.js`)
- Browse and manage listings → Service data fetcher: loads services (evidence: `finalproject/scripts/main.js`)
- Service data fetcher → Service listings: fetches JSON (evidence: `finalproject/scripts/data.js`)
- Browse and manage listings → Details modal: opens details (evidence: `finalproject/scripts/main.js`)