# vivekpatil111/infogram architecture

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

- Interactive diagram: https://gitdiagram.com/vivekpatil111/infogram
- Repository: https://github.com/vivekpatil111/infogram

## Overview

Infogram is a social-content application: users authenticate, publish and browse posts, follow accounts, interact with activity, and message each other. The frontend App routes to the main experience pages and calls the API client; backend apps provide the corresponding domain capabilities. The excerpts substantiate feed-ranking, visibility filters, follow notifications, and presigned media uploads. Most route handlers and page implementations were not sampled, so several client-to-service links are shown as unverified rather than asserting specific backend dispatch.

Main entry points: [`frontend/src/App.jsx`](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/App.jsx) (App shell), [`frontend/src/api.js`](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/api.js) (API client), [`backend/discovery/views.py`](https://github.com/vivekpatil111/infogram/blob/main/backend/discovery/views.py) (Discovery endpoints), [`backend/safety/querysets.py`](https://github.com/vivekpatil111/infogram/blob/main/backend/safety/querysets.py) (Safety filters)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web client"]
  node_app["App shell<br/>[App.jsx]"]
  node_api["API client<br/>[api.js]"]
  node_profile_ui["Profile page<br/>[Profile.jsx]"]
  node_home_ui["Home page<br/>[Home.jsx]"]
  node_explore_ui["Explore page<br/>[Explore.jsx]"]
  node_reels_ui["Reels page<br/>[Reels.jsx]"]
  node_messages_ui["Messages page<br/>[Messages.jsx]"]
end

subgraph group_identity["Accounts and safety"]
  node_accounts[("Accounts and follows<br/>[models.py]")]
  node_account_service["Follow transitions<br/>[services.py]"]
  node_account_queries["Account visibility<br/>[querysets.py]"]
  node_safety[("Blocks and mutes<br/>[models.py]")]
  node_safety_queries["Safety filters<br/>[querysets.py]"]
  node_notifications[("Notifications<br/>[models.py]")]
  node_notification_service["Notification service<br/>[services.py]"]
end

subgraph group_content["Content and discovery"]
  node_posts[("Posts and engagement<br/>[models.py]")]
  node_post_queries["Post visibility queries<br/>[querysets.py]"]
  node_ranking["Feed ranking<br/>[ranking.py]"]
  node_feed_snapshot["Feed snapshots<br/>[feed_snapshot.py]"]
  node_discovery["Discovery endpoints<br/>[views.py]"]
end

subgraph group_communications["Messaging and media"]
  node_media_api["Media endpoints<br/>[views.py]"]
  node_storage["Object storage<br/>[storage.py]"]
  node_messaging["Messaging service<br/>[views.py]"]
  node_message_stream["Realtime messaging<br/>[consumers.py]"]
end

node_user(("User"))
node_object_store[("S3-compatible storage")]

node_user -->|"uses"| node_app
node_app -->|"calls"| node_api
node_app -->|"renders"| node_home_ui
node_app -->|"renders"| node_explore_ui
node_app -->|"renders"| node_reels_ui
node_app -->|"renders"| node_messages_ui
node_app -->|"renders"| node_profile_ui
node_api -.->|"requests"| node_accounts
node_api -.->|"requests"| node_discovery
node_api -.->|"requests"| node_media_api
node_api -.->|"requests"| node_messaging
node_api -.->|"connects"| node_message_stream
node_account_service -->|"creates or removes"| node_notification_service
node_account_service -->|"checks blocks"| node_safety_queries
node_notification_service -->|"checks blocks"| node_safety_queries
node_account_queries -->|"filters accounts"| node_safety_queries
node_post_queries -->|"applies visibility"| node_account_queries
node_post_queries -->|"filters blocked"| node_safety_queries
node_discovery -->|"uses"| node_account_queries
node_discovery -->|"uses"| node_post_queries
node_discovery -->|"uses"| node_ranking
node_discovery -->|"uses"| node_feed_snapshot
node_media_api -.->|"uses"| node_storage
node_storage -->|"signs uploads"| node_object_store

click node_app "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/App.jsx"
click node_api "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/api.js"
click node_profile_ui "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Profile.jsx"
click node_home_ui "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Home.jsx"
click node_explore_ui "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Explore.jsx"
click node_reels_ui "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Reels.jsx"
click node_messages_ui "https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Messages.jsx"
click node_accounts "https://github.com/vivekpatil111/infogram/blob/main/backend/accounts/models.py"
click node_account_service "https://github.com/vivekpatil111/infogram/blob/main/backend/accounts/services.py"
click node_account_queries "https://github.com/vivekpatil111/infogram/blob/main/backend/accounts/querysets.py"
click node_safety "https://github.com/vivekpatil111/infogram/blob/main/backend/safety/models.py"
click node_safety_queries "https://github.com/vivekpatil111/infogram/blob/main/backend/safety/querysets.py"
click node_notifications "https://github.com/vivekpatil111/infogram/blob/main/backend/notifications/models.py"
click node_notification_service "https://github.com/vivekpatil111/infogram/blob/main/backend/notifications/services.py"
click node_posts "https://github.com/vivekpatil111/infogram/blob/main/backend/posts/models.py"
click node_post_queries "https://github.com/vivekpatil111/infogram/blob/main/backend/posts/querysets.py"
click node_ranking "https://github.com/vivekpatil111/infogram/blob/main/backend/posts/ranking.py"
click node_feed_snapshot "https://github.com/vivekpatil111/infogram/blob/main/backend/posts/feed_snapshot.py"
click node_discovery "https://github.com/vivekpatil111/infogram/blob/main/backend/discovery/views.py"
click node_media_api "https://github.com/vivekpatil111/infogram/blob/main/backend/media_api/views.py"
click node_storage "https://github.com/vivekpatil111/infogram/blob/main/backend/media_api/storage.py"
click node_messaging "https://github.com/vivekpatil111/infogram/blob/main/backend/messaging/views.py"
click node_message_stream "https://github.com/vivekpatil111/infogram/blob/main/backend/messaging/consumers.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_api,node_profile_ui,node_home_ui,node_explore_ui,node_reels_ui,node_messages_ui,node_user toneBlue
class node_accounts,node_account_service,node_account_queries,node_safety,node_safety_queries,node_notifications,node_notification_service,node_object_store toneAmber
class node_posts,node_post_queries,node_ranking,node_feed_snapshot,node_discovery toneMint
class node_media_api,node_storage,node_messaging,node_message_stream toneRose
```

## Components

### Web client

- [App shell](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [API client](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/api.js): `frontend/src/api.js`
- [Profile page](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Profile.jsx): `frontend/src/pages/Profile.jsx`
- [Home page](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Home.jsx): `frontend/src/pages/Home.jsx`
- [Explore page](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Explore.jsx): `frontend/src/pages/Explore.jsx`
- [Reels page](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Reels.jsx): `frontend/src/pages/Reels.jsx`
- [Messages page](https://github.com/vivekpatil111/infogram/blob/main/frontend/src/pages/Messages.jsx): `frontend/src/pages/Messages.jsx`

### Accounts and safety

- [Accounts and follows](https://github.com/vivekpatil111/infogram/blob/main/backend/accounts/models.py): `backend/accounts/models.py`
- [Follow transitions](https://github.com/vivekpatil111/infogram/blob/main/backend/accounts/services.py): `backend/accounts/services.py`
- [Account visibility](https://github.com/vivekpatil111/infogram/blob/main/backend/accounts/querysets.py): `backend/accounts/querysets.py`
- [Blocks and mutes](https://github.com/vivekpatil111/infogram/blob/main/backend/safety/models.py): `backend/safety/models.py`
- [Safety filters](https://github.com/vivekpatil111/infogram/blob/main/backend/safety/querysets.py): `backend/safety/querysets.py`
- [Notifications](https://github.com/vivekpatil111/infogram/blob/main/backend/notifications/models.py): `backend/notifications/models.py`
- [Notification service](https://github.com/vivekpatil111/infogram/blob/main/backend/notifications/services.py): `backend/notifications/services.py`

### Content and discovery

- [Posts and engagement](https://github.com/vivekpatil111/infogram/blob/main/backend/posts/models.py): `backend/posts/models.py`
- [Post visibility queries](https://github.com/vivekpatil111/infogram/blob/main/backend/posts/querysets.py): `backend/posts/querysets.py`
- [Feed ranking](https://github.com/vivekpatil111/infogram/blob/main/backend/posts/ranking.py): `backend/posts/ranking.py`
- [Feed snapshots](https://github.com/vivekpatil111/infogram/blob/main/backend/posts/feed_snapshot.py): `backend/posts/feed_snapshot.py`
- [Discovery endpoints](https://github.com/vivekpatil111/infogram/blob/main/backend/discovery/views.py): `backend/discovery/views.py`

### Messaging and media

- [Media endpoints](https://github.com/vivekpatil111/infogram/blob/main/backend/media_api/views.py): `backend/media_api/views.py`
- [Object storage](https://github.com/vivekpatil111/infogram/blob/main/backend/media_api/storage.py): `backend/media_api/storage.py`
- [Messaging service](https://github.com/vivekpatil111/infogram/blob/main/backend/messaging/views.py): `backend/messaging/views.py`
- [Realtime messaging](https://github.com/vivekpatil111/infogram/blob/main/backend/messaging/consumers.py): `backend/messaging/consumers.py`

### Other components

- **User**
- **S3-compatible storage**

## Connections

- User → App shell: uses (evidence: `frontend/src/App.jsx`)
- App shell → API client: calls (evidence: `frontend/src/App.jsx`)
- App shell → Home page: renders (evidence: `frontend/src/App.jsx`)
- App shell → Explore page: renders (evidence: `frontend/src/App.jsx`)
- App shell → Reels page: renders (evidence: `frontend/src/App.jsx`)
- App shell → Messages page: renders (evidence: `frontend/src/App.jsx`)
- App shell → Profile page: renders (evidence: `frontend/src/App.jsx`)
- API client → Accounts and follows: requests
- API client → Discovery endpoints: requests
- API client → Media endpoints: requests
- API client → Messaging service: requests
- API client → Realtime messaging: connects
- Follow transitions → Notification service: creates or removes (evidence: `backend/accounts/services.py`)
- Follow transitions → Safety filters: checks blocks (evidence: `backend/accounts/services.py`)
- Notification service → Safety filters: checks blocks (evidence: `backend/notifications/services.py`)
- Account visibility → Safety filters: filters accounts (evidence: `backend/accounts/querysets.py`)
- Post visibility queries → Account visibility: applies visibility (evidence: `backend/posts/querysets.py`)
- Post visibility queries → Safety filters: filters blocked (evidence: `backend/posts/querysets.py`)
- Discovery endpoints → Account visibility: uses (evidence: `backend/discovery/views.py`)
- Discovery endpoints → Post visibility queries: uses (evidence: `backend/discovery/views.py`)
- Discovery endpoints → Feed ranking: uses (evidence: `backend/discovery/views.py`)
- Discovery endpoints → Feed snapshots: uses (evidence: `backend/discovery/views.py`)
- Media endpoints → Object storage: uses
- Object storage → S3-compatible storage: signs uploads (evidence: `backend/media_api/storage.py`)