# actualbudget/docs architecture

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

- Interactive diagram: https://gitdiagram.com/actualbudget/docs
- Repository: https://github.com/actualbudget/docs

## Overview

This repository is the Actual Budget community documentation website, not the budgeting application itself. A reader visits the site to find guidance, follow setup or usage instructions, and learn about the project. The map emphasizes the documented product areas and the site’s content-rendering layer; README and sampled source support the site configuration and mention plugin, but not the internal implementation of Docusaurus or every documentation page.

Main entry points: [`docs`](https://github.com/actualbudget/docs/tree/master/docs) (Guides and reference), [`docusaurus.config.js`](https://github.com/actualbudget/docs/blob/master/docusaurus.config.js) (Site configuration), [`src/theme/MDXComponents.js`](https://github.com/actualbudget/docs/blob/master/src/theme/MDXComponents.js) (MDX components), [`docs-sidebar.js`](https://github.com/actualbudget/docs/blob/master/docs-sidebar.js) (Navigation structure)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_content["Documentation content"]
  node_docs["Guides and reference"]
  node_install["Installation and setup"]
  node_budgeting["Budgeting guidance"]
  node_accounts["Accounts and transactions"]
  node_transactions["Transaction guidance"]
  node_bank_sync["Bank synchronization"]
  node_reports["Reports guidance"]
  node_backup["Backup and restore"]
  node_api["API and ActualQL"]
  node_experimental["Experimental features"]
  node_blog["Release blog"]
end

subgraph group_site["Website experience"]
  node_docusaurus["Docusaurus site"]
  node_config["Site configuration"]
  node_home["Homepage<br/>[index.js]"]
  node_layout["Page layout<br/>[index.js]"]
  node_mdx["MDX components<br/>[MDXComponents.js]"]
  node_sidebar["Navigation structure<br/>[docs-sidebar.js]"]
end

subgraph group_extensions["Content extensions"]
  node_mentions["GitHub mentions<br/>[mentions.js]"]
  node_images["Responsive images<br/>[Image.jsx]"]
  node_shortcuts["Keyboard display<br/>[Key.jsx]"]
  node_search["Local search"]
end

node_reader(("Reader"))

node_reader -->|"browses"| node_docusaurus
node_docusaurus -->|"serves"| node_home
node_docusaurus -->|"renders"| node_docs
node_docusaurus -->|"renders"| node_blog
node_docusaurus -->|"uses"| node_layout
node_docusaurus -->|"configured by"| node_config
node_config -->|"loads"| node_sidebar
node_sidebar -->|"organizes"| node_docs
node_docs -->|"includes"| node_install
node_docs -->|"includes"| node_budgeting
node_docs -->|"includes"| node_accounts
node_docs -->|"includes"| node_transactions
node_docs -->|"includes"| node_bank_sync
node_docs -->|"includes"| node_reports
node_docs -->|"includes"| node_backup
node_docs -->|"includes"| node_api
node_docs -->|"includes"| node_experimental
node_config -->|"registers"| node_mentions
node_mdx -->|"uses"| node_images
node_mdx -->|"uses"| node_shortcuts
node_config -->|"enables"| node_search
node_docusaurus -->|"renders with"| node_mdx

click node_config "https://github.com/actualbudget/docs/blob/master/docusaurus.config.js"
click node_home "https://github.com/actualbudget/docs/blob/master/src/pages/index.js"
click node_layout "https://github.com/actualbudget/docs/blob/master/src/theme/Layout/index.js"
click node_mdx "https://github.com/actualbudget/docs/blob/master/src/theme/MDXComponents.js"
click node_docs "https://github.com/actualbudget/docs/tree/master/docs"
click node_install "https://github.com/actualbudget/docs/tree/master/docs/install"
click node_budgeting "https://github.com/actualbudget/docs/tree/master/docs/budgeting"
click node_accounts "https://github.com/actualbudget/docs/tree/master/docs/accounts"
click node_transactions "https://github.com/actualbudget/docs/tree/master/docs/transactions"
click node_bank_sync "https://github.com/actualbudget/docs/tree/master/docs/advanced/bank-sync"
click node_reports "https://github.com/actualbudget/docs/tree/master/docs/reports"
click node_backup "https://github.com/actualbudget/docs/tree/master/docs/backup-restore"
click node_api "https://github.com/actualbudget/docs/tree/master/docs/api"
click node_experimental "https://github.com/actualbudget/docs/tree/master/docs/experimental"
click node_blog "https://github.com/actualbudget/docs/tree/master/blog"
click node_sidebar "https://github.com/actualbudget/docs/blob/master/docs-sidebar.js"
click node_mentions "https://github.com/actualbudget/docs/blob/master/src/remark/mentions.js"
click node_images "https://github.com/actualbudget/docs/blob/master/src/components/Image.jsx"
click node_shortcuts "https://github.com/actualbudget/docs/blob/master/src/components/Key.jsx"

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_docs,node_install,node_budgeting,node_accounts,node_transactions,node_bank_sync,node_reports,node_backup,node_api,node_experimental,node_blog toneBlue
class node_docusaurus,node_config,node_home,node_layout,node_mdx,node_sidebar toneAmber
class node_mentions,node_images,node_shortcuts,node_search toneMint
class node_reader toneIndigo
```

## Components

### Documentation content

- [Guides and reference](https://github.com/actualbudget/docs/tree/master/docs): `docs`
- [Installation and setup](https://github.com/actualbudget/docs/tree/master/docs/install): `docs/install`
- [Budgeting guidance](https://github.com/actualbudget/docs/tree/master/docs/budgeting): `docs/budgeting`
- [Accounts and transactions](https://github.com/actualbudget/docs/tree/master/docs/accounts): `docs/accounts`
- [Transaction guidance](https://github.com/actualbudget/docs/tree/master/docs/transactions): `docs/transactions`
- [Bank synchronization](https://github.com/actualbudget/docs/tree/master/docs/advanced/bank-sync): `docs/advanced/bank-sync`
- [Reports guidance](https://github.com/actualbudget/docs/tree/master/docs/reports): `docs/reports`
- [Backup and restore](https://github.com/actualbudget/docs/tree/master/docs/backup-restore): `docs/backup-restore`
- [API and ActualQL](https://github.com/actualbudget/docs/tree/master/docs/api): `docs/api`
- [Experimental features](https://github.com/actualbudget/docs/tree/master/docs/experimental): `docs/experimental`
- [Release blog](https://github.com/actualbudget/docs/tree/master/blog): `blog`

### Website experience

- **Docusaurus site**
- [Site configuration](https://github.com/actualbudget/docs/blob/master/docusaurus.config.js): `docusaurus.config.js`
- [Homepage](https://github.com/actualbudget/docs/blob/master/src/pages/index.js): `src/pages/index.js`
- [Page layout](https://github.com/actualbudget/docs/blob/master/src/theme/Layout/index.js): `src/theme/Layout/index.js`
- [MDX components](https://github.com/actualbudget/docs/blob/master/src/theme/MDXComponents.js): `src/theme/MDXComponents.js`
- [Navigation structure](https://github.com/actualbudget/docs/blob/master/docs-sidebar.js): `docs-sidebar.js`

### Content extensions

- [GitHub mentions](https://github.com/actualbudget/docs/blob/master/src/remark/mentions.js): `src/remark/mentions.js`
- [Responsive images](https://github.com/actualbudget/docs/blob/master/src/components/Image.jsx): `src/components/Image.jsx`
- [Keyboard display](https://github.com/actualbudget/docs/blob/master/src/components/Key.jsx): `src/components/Key.jsx`
- **Local search**

### Other components

- **Reader**

## Connections

- Reader → Docusaurus site: browses
- Docusaurus site → Homepage: serves
- Docusaurus site → Guides and reference: renders
- Docusaurus site → Release blog: renders
- Docusaurus site → Page layout: uses
- Docusaurus site → Site configuration: configured by
- Site configuration → Navigation structure: loads
- Navigation structure → Guides and reference: organizes
- Guides and reference → Installation and setup: includes
- Guides and reference → Budgeting guidance: includes
- Guides and reference → Accounts and transactions: includes
- Guides and reference → Transaction guidance: includes
- Guides and reference → Bank synchronization: includes
- Guides and reference → Reports guidance: includes
- Guides and reference → Backup and restore: includes
- Guides and reference → API and ActualQL: includes
- Guides and reference → Experimental features: includes
- Site configuration → GitHub mentions: registers
- MDX components → Responsive images: uses
- MDX components → Keyboard display: uses
- Site configuration → Local search: enables
- Docusaurus site → MDX components: renders with