# abmhts/module-javascript-fundamentals architecture

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

- Interactive diagram: https://gitdiagram.com/abmhts/module-javascript-fundamentals
- Repository: https://github.com/abmhts/module-javascript-fundamentals

## Overview

This repository is an onboarding and coursework module, not a runtime application. Its main workflow is for a learner to consult the onboarding guidance and curriculum prep, work through coursework from the backlog, then attend class, demo and review. Sprint 2 and Sprint 3 provide JavaScript exercises; separate HTML/CSS materials cover form controls and wireframing. The sampled source shows individual exercises, not an application connecting them, so those materials are represented as learning activities rather than a software pipeline.

Main entry points: [`readme.md`](https://github.com/abmhts/module-javascript-fundamentals/blob/main/readme.md) (Onboarding guide), [`git-collaboration`](https://github.com/abmhts/module-javascript-fundamentals/tree/main/git-collaboration) (Git collaboration), [`Sprint-2`](https://github.com/abmhts/module-javascript-fundamentals/tree/main/Sprint-2) (Practice and interpret), [`Sprint-3`](https://github.com/abmhts/module-javascript-fundamentals/tree/main/Sprint-3) (Debug and implement)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_onboarding["Onboarding and planning"]
  node_guide["Onboarding guide<br/>[readme.md]"]
  node_gitcollab["Git collaboration"]
end

subgraph group_sprint2["Sprint 2 JavaScript"]
  node_sprint2work["Practice and interpret"]
  node_sprint2guide["Sprint 2 guide<br/>[README.md]"]
end

subgraph group_sprint3["Sprint 3 JavaScript"]
  node_sprint3work["Debug and implement"]
  node_sprint3guide["Sprint 3 guide<br/>[README.md]"]
end

subgraph group_web["Web coursework"]
  node_formcontrols["Form controls"]
  node_wireframe["Wireframe"]
end

node_learner(("Learner"))
node_curriculum["Curriculum prep"]
node_backlog["Coursework backlog"]
node_planner["Coursework planner"]
node_class(("Class"))
node_demo(("Demo"))
node_review(("Review"))

node_learner -->|"reads"| node_guide
node_guide -->|"directs to prep"| node_curriculum
node_guide -->|"lists coursework"| node_backlog
node_backlog -->|"copy issues"| node_planner
node_learner -->|"works through"| node_sprint2work
node_learner -->|"works through"| node_sprint3work
node_learner -->|"practises with"| node_formcontrols
node_learner -->|"practises with"| node_wireframe
node_learner -->|"learns collaboration"| node_gitcollab
node_learner -->|"attends"| node_class
node_learner -->|"presents at"| node_demo
node_learner -->|"reviews work"| node_review
node_review -->|"repeats prep"| node_curriculum

click node_guide "https://github.com/abmhts/module-javascript-fundamentals/blob/main/readme.md"
click node_sprint2work "https://github.com/abmhts/module-javascript-fundamentals/tree/main/Sprint-2"
click node_sprint2guide "https://github.com/abmhts/module-javascript-fundamentals/blob/main/Sprint-2/README.md"
click node_sprint3work "https://github.com/abmhts/module-javascript-fundamentals/tree/main/Sprint-3"
click node_sprint3guide "https://github.com/abmhts/module-javascript-fundamentals/blob/main/Sprint-3/README.md"
click node_formcontrols "https://github.com/abmhts/module-javascript-fundamentals/tree/main/Form-Controls"
click node_wireframe "https://github.com/abmhts/module-javascript-fundamentals/tree/main/Wireframe"
click node_gitcollab "https://github.com/abmhts/module-javascript-fundamentals/tree/main/git-collaboration"

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_guide,node_gitcollab,node_review toneBlue
class node_sprint2work,node_sprint2guide toneAmber
class node_sprint3work,node_sprint3guide toneMint
class node_formcontrols,node_wireframe toneRose
class node_learner,node_curriculum,node_backlog,node_planner,node_class,node_demo toneIndigo
```

## Components

### Onboarding and planning

- [Onboarding guide](https://github.com/abmhts/module-javascript-fundamentals/blob/main/readme.md): `readme.md`
- [Git collaboration](https://github.com/abmhts/module-javascript-fundamentals/tree/main/git-collaboration): `git-collaboration`

### Sprint 2 JavaScript

- [Practice and interpret](https://github.com/abmhts/module-javascript-fundamentals/tree/main/Sprint-2): `Sprint-2`
- [Sprint 2 guide](https://github.com/abmhts/module-javascript-fundamentals/blob/main/Sprint-2/README.md): `Sprint-2/README.md`

### Sprint 3 JavaScript

- [Debug and implement](https://github.com/abmhts/module-javascript-fundamentals/tree/main/Sprint-3): `Sprint-3`
- [Sprint 3 guide](https://github.com/abmhts/module-javascript-fundamentals/blob/main/Sprint-3/README.md): `Sprint-3/README.md`

### Web coursework

- [Form controls](https://github.com/abmhts/module-javascript-fundamentals/tree/main/Form-Controls): `Form-Controls`
- [Wireframe](https://github.com/abmhts/module-javascript-fundamentals/tree/main/Wireframe): `Wireframe`

### Other components

- **Learner**
- **Curriculum prep**
- **Coursework backlog**
- **Coursework planner**
- **Class**
- **Demo**
- **Review**

## Connections

- Learner → Onboarding guide: reads
- Onboarding guide → Curriculum prep: directs to prep
- Onboarding guide → Coursework backlog: lists coursework
- Coursework backlog → Coursework planner: copy issues
- Learner → Practice and interpret: works through
- Learner → Debug and implement: works through
- Learner → Form controls: practises with
- Learner → Wireframe: practises with
- Learner → Git collaboration: learns collaboration
- Learner → Class: attends
- Learner → Demo: presents at
- Learner → Review: reviews work
- Review → Curriculum prep: repeats prep
