# jfeelgoodofficial/tbosw architecture

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

- Interactive diagram: https://gitdiagram.com/jfeelgoodofficial/tbosw
- Repository: https://github.com/jfeelgoodofficial/tbosw

## Overview

1. **Repository purpose**
   - This is a **static marketing microsite** for *The Book of Shadow Work* by J. Feelgood.
   - The architecture is intentionally simple: **one primary landing page**, one supporting “learn more” page, and a few site-level metadata files for hosting and discovery.

2. **Core runtime model**
   - There is **no backend, database, API layer, or build pipeline**.
   - The site runs entirely in the browser as **plain HTML/CSS/JavaScript**, making the deployment model a flat static host or CDN.

3. **Primary entry point**
   - `index.html` is the main product page and the center of the architecture.
   - It contains the full promotional experience: hero, book explanation, method preview, character sections, sample pages, disclaimer, and final call to action.
   - The page appears to be designed as a **single-scroll narrative** rather than a multi-page application.

4. **Supporting content page**
   - `TBOSW-Learn-More.html` is a separate extended page for the “Dream Therapy Method.”
   - This is a **secondary content boundary**: the main landing page drives attention and conversion, while the learn-more page gives deeper explanatory material.
   - The repo tree shows it as a standalone HTML file rather than a routed view, so navigation is likely plain link-based.

5. **Interactive presentation layer**
   - The landing page uses browser-side interactions for engagement:
     - a **7-step swipeable carousel** for the method section
     - **drag-scroll** for character cards
     - **lightbox-style previews** for sample pages
   - These are UI-only behaviors; they do not depend on server state or persistent storage.

6. **Content and conversion flow**
   - The main user journey is:
     - land on the hero
     - absorb summary/content sections
     - optionally open the learn-more page
     - click out to the **Amazon purchase link**
   - The external commerce boundary is important: the repo itself does not sell the book; it **routes users to Amazon** for the actual transaction.

7. **Visual assets and presentation strategy**
   - The README indicates the design relies heavily on **CSS-generated styling**, including a mock book cover.
   - There are also placeholders for optional image assets if the author later swaps in real cover art or character illustrations.
   - This suggests the repo is optimized for **zero-dependency visual presentation** rather than asset-heavy delivery.

8. **SEO and site hosting support**
   - `sitemap.xml` and `robots.txt` support search engine crawling and indexing.
   - `llms.txt` suggests the site also exposes content in a format intended for LLM consumption or discovery.
   - `CNAME` indicates the site is meant to be served under the custom domain **tbosw.jfeelgood.com**.

9. **Deployment boundary**
   - The project is explicitly designed for **static hosting** such as Netlify, Vercel, or GitHub Pages.
   - Because there is no server code, the deployment boundary is simply: **repository files → static host → browser**.

10. **Technology footprint**
   - The only required technologies are:
     - HTML for structure
     - CSS for layout and branding
     - JavaScript for small UI interactions
   - Google Fonts are loaded externally for typography, but otherwise the site has no material third-party runtime dependencies.

11. **Operational implications**
   - There is no persistence, authentication, analytics pipeline, CMS, or admin surface in the repository.
   - Content updates are likely handled by **editing static files directly** and redeploying.
   - The architecture is therefore low-complexity and low-risk, with most changes concentrated in `index.html`.

12. **How to diagram it**
   - A good architecture diagram would show:
     - **Browser client**
     - **Static host/CDN**
     - **Primary HTML landing page**
     - **Secondary learn-more HTML page**
     - **External Amazon destination**
     - **SEO/discovery files** (`robots.txt`, `sitemap.xml`, `llms.txt`)
   - The key relationship is that the site is a **static content funnel**: informational pages on the repo, outbound conversion to Amazon.

Main entry points: [`index.html`](https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html) (Index page), [`TBOSW-Learn-More.html`](https://github.com/jfeelgoodofficial/tbosw/blob/main/TBOSW-Learn-More.html) (Learn more), [`README.md`](https://github.com/jfeelgoodofficial/tbosw/blob/main/README.md) (README), [`sitemap.xml`](https://github.com/jfeelgoodofficial/tbosw/blob/main/sitemap.xml) (Sitemap)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_g1["Static site"]
  node_n3["Index page<br/>landing html<br/>[index.html]"]
  node_n4["Learn more<br/>content html"]
  node_n5{{"UI interactions<br/>browser js<br/>[index.html]"}}
  node_n6["Visual styling<br/>css presentation<br/>[index.html]"]
  node_n7["README<br/>project docs<br/>[README.md]"]
end

subgraph group_g2["Discovery files"]
  node_n8["Sitemap<br/>seo xml<br/>[sitemap.xml]"]
  node_n9["Robots<br/>seo txt<br/>[robots.txt]"]
  node_n10["LLMs text<br/>discovery txt<br/>[llms.txt]"]
end

subgraph group_g3["Deployment"]
  node_n1(("Browser<br/>client"))
  node_n2[("Static host<br/>cdn/host")]
  node_n11["Custom domain"]
end

subgraph group_g4["External destination"]
  node_n12(("Amazon<br/>commerce outbound"))
end

node_n1 -->|"requests"| node_n2
node_n2 -->|"serves"| node_n3
node_n2 -->|"serves"| node_n4
node_n3 -->|"uses"| node_n5
node_n3 -->|"styled by"| node_n6
node_n4 -->|"styled by"| node_n6
node_n3 -->|"links to"| node_n12
node_n4 -->|"links to"| node_n12
node_n2 -->|"hosts"| node_n8
node_n2 -->|"hosts"| node_n9
node_n2 -->|"hosts"| node_n10
node_n2 -->|"maps to"| node_n11
node_n7 -.->|"describes"| node_n3
node_n7 -.->|"describes"| node_n4

click node_n3 "https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html"
click node_n4 "https://github.com/jfeelgoodofficial/tbosw/blob/main/TBOSW-Learn-More.html"
click node_n5 "https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html"
click node_n6 "https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html"
click node_n7 "https://github.com/jfeelgoodofficial/tbosw/blob/main/README.md"
click node_n8 "https://github.com/jfeelgoodofficial/tbosw/blob/main/sitemap.xml"
click node_n9 "https://github.com/jfeelgoodofficial/tbosw/blob/main/robots.txt"
click node_n10 "https://github.com/jfeelgoodofficial/tbosw/blob/main/llms.txt"
click node_n11 "https://github.com/jfeelgoodofficial/tbosw/tree/main/CNAME"

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_n3,node_n4,node_n5,node_n6,node_n7 toneBlue
class node_n8,node_n9,node_n10 toneAmber
class node_n1,node_n2,node_n11 toneMint
class node_n12 toneRose
```

## Components

### Static site

Core browser-facing pages and presentation layer.

- [Index page](https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html): landing html · Primary single-scroll landing page with the main promotional narrative and interactive sections. · `index.html`
- [Learn more](https://github.com/jfeelgoodofficial/tbosw/blob/main/TBOSW-Learn-More.html): content html · Secondary standalone page for deeper explanation of the Dream Therapy Method. · `TBOSW-Learn-More.html`
- [UI interactions](https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html): browser js · Client-side behaviors such as the swipeable carousel, drag-scroll cards, and lightbox previews. · `index.html`
- [Visual styling](https://github.com/jfeelgoodofficial/tbosw/blob/main/index.html): css presentation · Page branding and layout, including the mock book-cover treatment and responsive presentation. · `index.html`
- [README](https://github.com/jfeelgoodofficial/tbosw/blob/main/README.md): project docs · Repository documentation that explains the static marketing site and its presentation approach. · `README.md`

### Discovery files

Files that support crawling, indexing, and machine-readable discovery.

- [Sitemap](https://github.com/jfeelgoodofficial/tbosw/blob/main/sitemap.xml): seo xml · Crawl and discovery metadata for search engines. · `sitemap.xml`
- [Robots](https://github.com/jfeelgoodofficial/tbosw/blob/main/robots.txt): seo txt · Crawler directives for search engines and bots. · `robots.txt`
- [LLMs text](https://github.com/jfeelgoodofficial/tbosw/blob/main/llms.txt): discovery txt · Machine-readable site discovery content intended for LLM consumption. · `llms.txt`

### Deployment

Static hosting and custom domain boundary.

- **Browser**: client · User-facing browser runtime that loads the static pages and runs UI interactions.
- **Static host**: cdn/host · Static deployment boundary for serving the repo as a flat site.
- [Custom domain](https://github.com/jfeelgoodofficial/tbosw/tree/main/CNAME): domain · Hosted under the custom domain tbosw.jfeelgood.com via the CNAME record. · `CNAME`

### External destination

Outbound commerce target for book purchase.

- **Amazon**: commerce outbound · External purchase destination for the book; transaction happens off-repo.

## Connections

- Browser → Static host: requests · The browser loads the site from the static host.
- Static host → Index page: serves · The host serves the primary landing page.
- Static host → Learn more: serves · The host serves the supporting learn-more page.
- Index page → UI interactions: uses · The landing page powers its interactive presentation behaviors with browser-side code.
- Index page → Visual styling: styled by · The landing page relies on CSS for branding and layout.
- Learn more → Visual styling: styled by · The learn-more page uses the same presentation layer.
- Index page → Amazon: links to · Primary conversion flow sends users to Amazon for purchase.
- Learn more → Amazon: links to · The extended page can also route readers toward the external purchase destination.
- Static host → Sitemap: hosts · Static hosting exposes sitemap metadata for indexing.
- Static host → Robots: hosts · Static hosting exposes crawler directives.
- Static host → LLMs text: hosts · Static hosting exposes LLM-friendly discovery content.
- Static host → Custom domain: maps to · The deployment is configured for the custom domain.
- README → Index page: describes · Documentation explains the main landing page and its content strategy.
- README → Learn more: describes · Documentation explains the supporting content page.