# prag-18/skilloop architecture

> Architecture diagram of the GitHub repository prag-18/skilloop, 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/prag-18/skilloop
- Repository: https://github.com/prag-18/skilloop

## Overview

SkillLoop is a campus skill-exchange platform: students create accounts, list skills they teach or want to learn, add expertise evidence, find complementary peers, send learning requests, and earn skill credits. The React app routes users through those activities and calls a FastAPI API backed by SQLAlchemy models and a relational database. The README documents the broad feature set, but sampled backend implementation is limited mainly to startup and authentication; feature-router internals and their exact data flows are therefore represented cautiously.

Main entry points: [`backend/app/main.py`](https://github.com/prag-18/skilloop/blob/main/backend/app/main.py) (FastAPI application), [`src/routes/AppRoutes.jsx`](https://github.com/prag-18/skilloop/blob/main/src/routes/AppRoutes.jsx) (Page routing), [`src/services/api.js`](https://github.com/prag-18/skilloop/blob/main/src/services/api.js) (HTTP API client), [`src/App.jsx`](https://github.com/prag-18/skilloop/blob/main/src/App.jsx) (Application shell)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_web["Web application"]
  node_app["Application shell<br/>[App.jsx]"]
  node_routes["Page routing<br/>[AppRoutes.jsx]"]
  node_dashboard["Dashboard<br/>[Dashboard.jsx]"]
  node_api["HTTP API client<br/>[api.js]"]
end

subgraph group_identity["Identity and profiles"]
  node_authstate["Auth context<br/>[AuthContext.jsx]"]
  node_authpages["Login and register<br/>[Login.jsx]"]
  node_profile["Student profile<br/>[SkillProfile.jsx]"]
  node_authrouter["Authentication API<br/>[auth.py]"]
  node_authservice["Authentication service<br/>[auth_service.py]"]
end

subgraph group_skills["Skills and discovery"]
  node_skillpicker["Skill taxonomy picker<br/>[SkillPicker.jsx]"]
  node_evidence["Skill evidence"]
  node_discover["Peer discovery<br/>[Discover.jsx]"]
  node_skillrouter["Skills API<br/>[skills.py]"]
  node_evidencerouter["Evidence API<br/>[evidence.py]"]
  node_discoverrouter["Discovery API<br/>[discover.py]"]
  node_recommender["Recommendations<br/>[recommendation.py]"]
end

subgraph group_exchange["Learning exchange"]
  node_requestsui["Learning requests<br/>[Requests.jsx]"]
  node_requestrouter["Requests API<br/>[requests.py]"]
  node_exchangerouter["Exchanges API<br/>[exchanges.py]"]
end

subgraph group_platform["API and persistence"]
  node_server["FastAPI application<br/>[main.py]"]
  node_healthrouter["Health API<br/>[health.py]"]
  node_database[("SQLAlchemy database<br/>[database.py]")]
end

node_student(("Student"))

node_student -->|"uses"| node_app
node_app -->|"provides state"| node_authstate
node_app -->|"renders routes"| node_routes
node_routes -->|"routes to"| node_authpages
node_routes -->|"routes to"| node_profile
node_routes -->|"routes to"| node_dashboard
node_routes -->|"routes to"| node_discover
node_routes -->|"routes to"| node_requestsui
node_authstate -->|"calls auth API"| node_api
node_skillpicker -->|"requests taxonomy"| node_api
node_skillpicker -->|"submits skill"| node_api
node_server -->|"dispatches"| node_authrouter
node_server -->|"dispatches"| node_skillrouter
node_server -->|"dispatches"| node_evidencerouter
node_server -->|"dispatches"| node_discoverrouter
node_server -->|"dispatches"| node_requestrouter
node_server -->|"dispatches"| node_exchangerouter
node_server -->|"dispatches"| node_healthrouter
node_authrouter -->|"calls"| node_authservice
node_authservice -->|"queries and writes"| node_database
node_server -->|"creates tables"| node_database
node_api -->|"sends requests"| node_server
node_discoverrouter -->|"uses"| node_recommender

click node_app "https://github.com/prag-18/skilloop/blob/main/src/App.jsx"
click node_routes "https://github.com/prag-18/skilloop/blob/main/src/routes/AppRoutes.jsx"
click node_authstate "https://github.com/prag-18/skilloop/blob/main/src/context/AuthContext.jsx"
click node_authpages "https://github.com/prag-18/skilloop/blob/main/src/pages/Login.jsx"
click node_profile "https://github.com/prag-18/skilloop/blob/main/src/pages/SkillProfile.jsx"
click node_dashboard "https://github.com/prag-18/skilloop/blob/main/src/pages/Dashboard.jsx"
click node_skillpicker "https://github.com/prag-18/skilloop/blob/main/src/components/skills/SkillPicker.jsx"
click node_evidence "https://github.com/prag-18/skilloop/blob/main/src/components/skills/EvidenceUploader.jsx"
click node_discover "https://github.com/prag-18/skilloop/blob/main/src/pages/Discover.jsx"
click node_requestsui "https://github.com/prag-18/skilloop/blob/main/src/pages/Requests.jsx"
click node_api "https://github.com/prag-18/skilloop/blob/main/src/services/api.js"
click node_server "https://github.com/prag-18/skilloop/blob/main/backend/app/main.py"
click node_authrouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/auth.py"
click node_authservice "https://github.com/prag-18/skilloop/blob/main/backend/app/services/auth_service.py"
click node_skillrouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/skills.py"
click node_evidencerouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/evidence.py"
click node_discoverrouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/discover.py"
click node_recommender "https://github.com/prag-18/skilloop/blob/main/backend/app/services/recommendation.py"
click node_requestrouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/requests.py"
click node_exchangerouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/exchanges.py"
click node_healthrouter "https://github.com/prag-18/skilloop/blob/main/backend/app/routers/health.py"
click node_database "https://github.com/prag-18/skilloop/blob/main/backend/app/db/database.py"

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_routes,node_dashboard,node_api toneBlue
class node_authstate,node_authpages,node_profile,node_authrouter,node_authservice toneAmber
class node_skillpicker,node_evidence,node_discover,node_skillrouter,node_evidencerouter,node_discoverrouter,node_recommender toneMint
class node_requestsui,node_requestrouter,node_exchangerouter toneRose
class node_server,node_healthrouter,node_database,node_student toneIndigo
```

## Components

### Web application

- [Application shell](https://github.com/prag-18/skilloop/blob/main/src/App.jsx): `src/App.jsx`
- [Page routing](https://github.com/prag-18/skilloop/blob/main/src/routes/AppRoutes.jsx): `src/routes/AppRoutes.jsx`
- [Dashboard](https://github.com/prag-18/skilloop/blob/main/src/pages/Dashboard.jsx): `src/pages/Dashboard.jsx`
- [HTTP API client](https://github.com/prag-18/skilloop/blob/main/src/services/api.js): `src/services/api.js`

### Identity and profiles

- [Auth context](https://github.com/prag-18/skilloop/blob/main/src/context/AuthContext.jsx): `src/context/AuthContext.jsx`
- [Login and register](https://github.com/prag-18/skilloop/blob/main/src/pages/Login.jsx): `src/pages/Login.jsx`
- [Student profile](https://github.com/prag-18/skilloop/blob/main/src/pages/SkillProfile.jsx): `src/pages/SkillProfile.jsx`
- [Authentication API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/auth.py): `backend/app/routers/auth.py`
- [Authentication service](https://github.com/prag-18/skilloop/blob/main/backend/app/services/auth_service.py): `backend/app/services/auth_service.py`

### Skills and discovery

- [Skill taxonomy picker](https://github.com/prag-18/skilloop/blob/main/src/components/skills/SkillPicker.jsx): `src/components/skills/SkillPicker.jsx`
- [Skill evidence](https://github.com/prag-18/skilloop/blob/main/src/components/skills/EvidenceUploader.jsx): `src/components/skills/EvidenceUploader.jsx`
- [Peer discovery](https://github.com/prag-18/skilloop/blob/main/src/pages/Discover.jsx): `src/pages/Discover.jsx`
- [Skills API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/skills.py): `backend/app/routers/skills.py`
- [Evidence API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/evidence.py): `backend/app/routers/evidence.py`
- [Discovery API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/discover.py): `backend/app/routers/discover.py`
- [Recommendations](https://github.com/prag-18/skilloop/blob/main/backend/app/services/recommendation.py): `backend/app/services/recommendation.py`

### Learning exchange

- [Learning requests](https://github.com/prag-18/skilloop/blob/main/src/pages/Requests.jsx): `src/pages/Requests.jsx`
- [Requests API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/requests.py): `backend/app/routers/requests.py`
- [Exchanges API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/exchanges.py): `backend/app/routers/exchanges.py`

### API and persistence

- [FastAPI application](https://github.com/prag-18/skilloop/blob/main/backend/app/main.py): `backend/app/main.py`
- [Health API](https://github.com/prag-18/skilloop/blob/main/backend/app/routers/health.py): `backend/app/routers/health.py`
- [SQLAlchemy database](https://github.com/prag-18/skilloop/blob/main/backend/app/db/database.py): `backend/app/db/database.py`

### Other components

- **Student**

## Connections

- Student → Application shell: uses
- Application shell → Auth context: provides state
- Application shell → Page routing: renders routes
- Page routing → Login and register: routes to
- Page routing → Student profile: routes to
- Page routing → Dashboard: routes to
- Page routing → Peer discovery: routes to
- Page routing → Learning requests: routes to
- Auth context → HTTP API client: calls auth API
- Skill taxonomy picker → HTTP API client: requests taxonomy
- Skill taxonomy picker → HTTP API client: submits skill
- FastAPI application → Authentication API: dispatches
- FastAPI application → Skills API: dispatches
- FastAPI application → Evidence API: dispatches
- FastAPI application → Discovery API: dispatches
- FastAPI application → Requests API: dispatches
- FastAPI application → Exchanges API: dispatches
- FastAPI application → Health API: dispatches
- Authentication API → Authentication service: calls
- Authentication service → SQLAlchemy database: queries and writes
- FastAPI application → SQLAlchemy database: creates tables
- HTTP API client → FastAPI application: sends requests
- Discovery API → Recommendations: uses