# ackzerman/learnr. architecture

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

- Interactive diagram: https://gitdiagram.com/ackzerman/learnr.
- Repository: https://github.com/ackzerman/learnr.

## Overview

learnr turns YouTube playlists or manually assembled video lists into personal learning courses, then tracks viewing, notes, goals, streaks, and analytics. The learner uses the React app to authenticate, browse or create courses, watch lessons, and review progress; the client calls the Express API, whose domain controllers coordinate persistence and external media services. The graph preserves the documented product branches. Some controller and client wiring is inferred from route declarations and README capabilities because those implementations were not sampled.

Main entry points: [`backend/server.js`](https://github.com/ackzerman/learnr./blob/main/backend/server.js) (Express server), [`frontend/src/api/index.js`](https://github.com/ackzerman/learnr./blob/main/frontend/src/api/index.js) (API client), [`backend/models`](https://github.com/ackzerman/learnr./tree/main/backend/models) (Learning records), [`backend/controllers/userController.js`](https://github.com/ackzerman/learnr./blob/main/backend/controllers/userController.js) (Profile analytics)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Learning client"]
  node_app["React app<br/>[App.jsx]"]
  node_authstate["Auth state<br/>[useAuth.jsx]"]
  node_coursepages["Course pages<br/>[Courses.jsx]"]
  node_watchpage["Lesson player<br/>[VideoPlayer.jsx]"]
  node_dashboardpage["Dashboard<br/>[Dashboard.jsx]"]
  node_goalpage["Day planner<br/>[PlanYourDay.jsx]"]
  node_profilepage["Profile<br/>[Profile.jsx]"]
  node_clientapi["API client<br/>[index.js]"]
end

subgraph group_api["API and identity"]
  node_server["Express server<br/>[server.js]"]
  node_authroutes["Auth routes<br/>[authRoutes.js]"]
  node_authctrl["Auth controller<br/>[authController.js]"]
end

subgraph group_learning["Courses and study"]
  node_courseroutes["Course routes<br/>[courseRoutes.js]"]
  node_coursectrl["Course engine"]
  node_progressctrl["Progress engine"]
  node_notesctrl["Notes service<br/>[notesController.js]"]
end

subgraph group_engagement["Goals and analytics"]
  node_goalctrl["Goal planner<br/>[goalController.js]"]
  node_dashboardctrl["Dashboard analytics"]
  node_userctrl["Profile analytics<br/>[userController.js]"]
  node_streakroutes["Streak routes<br/>[streakRoutes.js]"]
  node_useroutes["User routes<br/>[userRoutes.js]"]
end

subgraph group_integrations["Persistence and media"]
  node_models[("Learning records")]
  node_db[("MongoDB<br/>[db.js]")]
  node_youtube["YouTube API"]
  node_cloudinary["Cloudinary"]
end

node_learner(("Learner"))

node_learner -->|"uses"| node_app
node_app -->|"provides auth"| node_authstate
node_coursepages -->|"requests courses"| node_clientapi
node_watchpage -->|"records viewing"| node_clientapi
node_dashboardpage -->|"loads analytics"| node_clientapi
node_goalpage -->|"manages goals"| node_clientapi
node_profilepage -->|"loads profile"| node_clientapi
node_authstate -->|"verifies session"| node_clientapi
node_clientapi -->|"sends API requests"| node_server
node_server -->|"connects"| node_db
node_server -->|"dispatches"| node_authroutes
node_server -->|"dispatches"| node_courseroutes
node_server -->|"dispatches"| node_streakroutes
node_server -->|"dispatches"| node_useroutes
node_authroutes -->|"dispatches"| node_authctrl
node_authctrl -->|"reads/writes users"| node_models
node_courseroutes -->|"dispatches"| node_coursectrl
node_coursectrl -->|"manages courses"| node_models
node_coursectrl -.->|"imports playlist data"| node_youtube
node_server -->|"dispatches progress routes"| node_progressctrl
node_progressctrl -->|"updates viewing records"| node_models
node_server -->|"dispatches notes routes"| node_notesctrl
node_notesctrl -->|"reads/writes notes"| node_models
node_server -->|"dispatches goal routes"| node_goalctrl
node_goalctrl -->|"updates goals and streaks"| node_models
node_server -->|"dispatches dashboard routes"| node_dashboardctrl
node_dashboardctrl -->|"aggregates activity"| node_models
node_streakroutes -->|"dispatches activity streak"| node_userctrl
node_useroutes -->|"dispatches profile and analytics"| node_userctrl
node_userctrl -->|"reads/writes profile and activity"| node_models
node_userctrl -.->|"uploads avatar"| node_cloudinary

click node_app "https://github.com/ackzerman/learnr./blob/main/frontend/src/App.jsx"
click node_authstate "https://github.com/ackzerman/learnr./blob/main/frontend/src/hooks/useAuth.jsx"
click node_coursepages "https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/Courses.jsx"
click node_watchpage "https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/VideoPlayer.jsx"
click node_dashboardpage "https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/Dashboard.jsx"
click node_goalpage "https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/PlanYourDay.jsx"
click node_profilepage "https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/Profile.jsx"
click node_clientapi "https://github.com/ackzerman/learnr./blob/main/frontend/src/api/index.js"
click node_server "https://github.com/ackzerman/learnr./blob/main/backend/server.js"
click node_authroutes "https://github.com/ackzerman/learnr./blob/main/backend/routes/authRoutes.js"
click node_authctrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/authController.js"
click node_courseroutes "https://github.com/ackzerman/learnr./blob/main/backend/routes/courseRoutes.js"
click node_coursectrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/courseController.js"
click node_progressctrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/progressController.js"
click node_notesctrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/notesController.js"
click node_goalctrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/goalController.js"
click node_dashboardctrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/dashboardController.js"
click node_userctrl "https://github.com/ackzerman/learnr./blob/main/backend/controllers/userController.js"
click node_streakroutes "https://github.com/ackzerman/learnr./blob/main/backend/routes/streakRoutes.js"
click node_useroutes "https://github.com/ackzerman/learnr./blob/main/backend/routes/userRoutes.js"
click node_models "https://github.com/ackzerman/learnr./tree/main/backend/models"
click node_db "https://github.com/ackzerman/learnr./blob/main/backend/config/db.js"

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_app,node_authstate,node_coursepages,node_watchpage,node_dashboardpage,node_goalpage,node_profilepage,node_clientapi toneBlue
class node_server,node_authroutes,node_authctrl toneAmber
class node_courseroutes,node_coursectrl,node_progressctrl,node_notesctrl toneMint
class node_goalctrl,node_dashboardctrl,node_userctrl,node_streakroutes,node_useroutes toneRose
class node_models,node_db,node_youtube,node_cloudinary,node_learner toneIndigo
```

## Components

### Learning client

- [React app](https://github.com/ackzerman/learnr./blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Auth state](https://github.com/ackzerman/learnr./blob/main/frontend/src/hooks/useAuth.jsx): `frontend/src/hooks/useAuth.jsx`
- [Course pages](https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/Courses.jsx): `frontend/src/pages/Courses.jsx`
- [Lesson player](https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/VideoPlayer.jsx): `frontend/src/pages/VideoPlayer.jsx`
- [Dashboard](https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/Dashboard.jsx): `frontend/src/pages/Dashboard.jsx`
- [Day planner](https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/PlanYourDay.jsx): `frontend/src/pages/PlanYourDay.jsx`
- [Profile](https://github.com/ackzerman/learnr./blob/main/frontend/src/pages/Profile.jsx): `frontend/src/pages/Profile.jsx`
- [API client](https://github.com/ackzerman/learnr./blob/main/frontend/src/api/index.js): `frontend/src/api/index.js`

### API and identity

- [Express server](https://github.com/ackzerman/learnr./blob/main/backend/server.js): `backend/server.js`
- [Auth routes](https://github.com/ackzerman/learnr./blob/main/backend/routes/authRoutes.js): `backend/routes/authRoutes.js`
- [Auth controller](https://github.com/ackzerman/learnr./blob/main/backend/controllers/authController.js): `backend/controllers/authController.js`

### Courses and study

- [Course routes](https://github.com/ackzerman/learnr./blob/main/backend/routes/courseRoutes.js): `backend/routes/courseRoutes.js`
- [Course engine](https://github.com/ackzerman/learnr./blob/main/backend/controllers/courseController.js): `backend/controllers/courseController.js`
- [Progress engine](https://github.com/ackzerman/learnr./blob/main/backend/controllers/progressController.js): `backend/controllers/progressController.js`
- [Notes service](https://github.com/ackzerman/learnr./blob/main/backend/controllers/notesController.js): `backend/controllers/notesController.js`

### Goals and analytics

- [Goal planner](https://github.com/ackzerman/learnr./blob/main/backend/controllers/goalController.js): `backend/controllers/goalController.js`
- [Dashboard analytics](https://github.com/ackzerman/learnr./blob/main/backend/controllers/dashboardController.js): `backend/controllers/dashboardController.js`
- [Profile analytics](https://github.com/ackzerman/learnr./blob/main/backend/controllers/userController.js): `backend/controllers/userController.js`
- [Streak routes](https://github.com/ackzerman/learnr./blob/main/backend/routes/streakRoutes.js): `backend/routes/streakRoutes.js`
- [User routes](https://github.com/ackzerman/learnr./blob/main/backend/routes/userRoutes.js): `backend/routes/userRoutes.js`

### Persistence and media

- [Learning records](https://github.com/ackzerman/learnr./tree/main/backend/models): `backend/models`
- [MongoDB](https://github.com/ackzerman/learnr./blob/main/backend/config/db.js): `backend/config/db.js`
- **YouTube API**
- **Cloudinary**

### Other components

- **Learner**

## Connections

- Learner → React app: uses
- React app → Auth state: provides auth
- Course pages → API client: requests courses
- Lesson player → API client: records viewing
- Dashboard → API client: loads analytics
- Day planner → API client: manages goals
- Profile → API client: loads profile
- Auth state → API client: verifies session
- API client → Express server: sends API requests
- Express server → MongoDB: connects
- Express server → Auth routes: dispatches
- Express server → Course routes: dispatches
- Express server → Streak routes: dispatches
- Express server → User routes: dispatches
- Auth routes → Auth controller: dispatches
- Auth controller → Learning records: reads/writes users
- Course routes → Course engine: dispatches
- Course engine → Learning records: manages courses
- Course engine → YouTube API: imports playlist data
- Express server → Progress engine: dispatches progress routes
- Progress engine → Learning records: updates viewing records
- Express server → Notes service: dispatches notes routes
- Notes service → Learning records: reads/writes notes
- Express server → Goal planner: dispatches goal routes
- Goal planner → Learning records: updates goals and streaks
- Express server → Dashboard analytics: dispatches dashboard routes
- Dashboard analytics → Learning records: aggregates activity
- Streak routes → Profile analytics: dispatches activity streak
- User routes → Profile analytics: dispatches profile and analytics
- Profile analytics → Learning records: reads/writes profile and activity
- Profile analytics → Cloudinary: uploads avatar