# monish-kumar-a/pinvault architecture

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

- Interactive diagram: https://gitdiagram.com/monish-kumar-a/pinvault
- Repository: https://github.com/monish-kumar-a/pinvault

## Overview

PINVAULT is a Pinterest-inspired visual-content app. Users authenticate, discover and filter a paginated feed, open posts to interact, upload media, and manage profiles, liked posts, and saved posts. The frontend’s pages and reusable components call a shared API layer; Express routes dispatch to domain controllers, which operate on user and post records. The README documents additional discovery and engagement capabilities whose detailed wiring was not sampled, so those links are represented at the subsystem level. Backend source excerpts support the route/controller and persistence links shown.

Main entry points: [`frontend/src/lib/api.ts`](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/lib/api.ts) (API client), [`backend/src/server.js`](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/server.js) (Express server), [`backend/src/routes/postRoutes.js`](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/postRoutes.js) (Post routes), [`backend/src/middleware/auth.js`](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/middleware/auth.js) (JWT authorization)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Frontend experience"]
  node_feed["Feed and discovery<br/>[page.tsx]"]
  node_postdetail["Post details<br/>[page.tsx]"]
  node_uploadpage["Media upload<br/>[page.tsx]"]
  node_profilepage["User profile<br/>[page.tsx]"]
  node_collections["Liked and saved<br/>[page.tsx]"]
  node_authpages["Login and register<br/>[page.tsx]"]
  node_authform["Authentication form<br/>[AuthForm.tsx]"]
  node_feedui["Masonry feed UI<br/>[MasonryFeed.tsx]"]
  node_postcard["Post card UI<br/>[PostCard.tsx]"]
  node_authcontext["Session context<br/>[AuthContext.tsx]"]
  node_theme["Theme context<br/>[ThemeContext.tsx]"]
  node_apiclient["API client<br/>[api.ts]"]
end

subgraph group_backend["Backend API"]
  node_server["Express server<br/>[server.js]"]
  node_authroutes["Auth routes<br/>[authRoutes.js]"]
  node_postroutes["Post routes<br/>[postRoutes.js]"]
  node_userroutes["User routes<br/>[userRoutes.js]"]
  node_authmw["JWT authorization<br/>[auth.js]"]
  node_authctrl["Authentication logic<br/>[authController.js]"]
  node_postctrl["Post and comment logic<br/>[postController.js]"]
  node_userctrl["Profile collections logic<br/>[userController.js]"]
end

subgraph group_data["Persistence and media"]
  node_dbconfig["Database connection<br/>[db.js]"]
  node_users[("User records<br/>[User.js]")]
  node_posts[("Post records<br/>[Post.js]")]
  node_media[("Uploaded media files")]
end

node_visitor(("Visitor / user"))
node_mongodb[("MongoDB")]

node_visitor -->|"browses"| node_feed
node_visitor -->|"signs in"| node_authpages
node_authpages -->|"renders"| node_authform
node_authform -->|"submits credentials"| node_authcontext
node_authcontext -->|"requests session"| node_apiclient
node_feed -->|"renders feed"| node_feedui
node_feedui -->|"renders posts"| node_postcard
node_feed -->|"loads discovery"| node_apiclient
node_postdetail -->|"loads post"| node_apiclient
node_uploadpage -->|"submits media"| node_apiclient
node_profilepage -->|"loads profile"| node_apiclient
node_collections -->|"loads collections"| node_apiclient
node_visitor -->|"views and interacts"| node_postdetail
node_visitor -->|"uploads content"| node_uploadpage
node_visitor -->|"views profile"| node_profilepage
node_visitor -->|"manages posts"| node_collections
node_server -->|"mounts routes"| node_authroutes
node_server -->|"mounts routes"| node_postroutes
node_server -->|"mounts routes"| node_userroutes
node_server -->|"connects database"| node_dbconfig
node_server -->|"serves files"| node_media
node_apiclient -->|"sends API requests"| node_server
node_authroutes -->|"dispatches"| node_authctrl
node_authroutes -->|"protects session route"| node_authmw
node_postroutes -->|"dispatches"| node_postctrl
node_postroutes -->|"protects mutations"| node_authmw
node_postroutes -->|"stores uploaded files"| node_media
node_userroutes -->|"dispatches"| node_userctrl
node_userroutes -->|"protects user routes"| node_authmw
node_authmw -->|"loads account"| node_users
node_authctrl -->|"reads and writes"| node_users
node_postctrl -->|"reads and writes"| node_posts
node_postctrl -->|"reads and writes"| node_users
node_userctrl -->|"reads and writes"| node_users
node_userctrl -->|"reads posts"| node_posts
node_dbconfig -->|"connects"| node_mongodb
node_theme -->|"provides theme choice"| node_visitor

click node_feed "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/page.tsx"
click node_postdetail "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/post/%5Bid%5D/page.tsx"
click node_uploadpage "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/upload/page.tsx"
click node_profilepage "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/profile/%5Bid%5D/page.tsx"
click node_collections "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/liked/page.tsx"
click node_authpages "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/login/page.tsx"
click node_authform "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/components/AuthForm.tsx"
click node_feedui "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/components/MasonryFeed.tsx"
click node_postcard "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/components/PostCard.tsx"
click node_authcontext "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/context/AuthContext.tsx"
click node_theme "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/context/ThemeContext.tsx"
click node_apiclient "https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/lib/api.ts"
click node_server "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/server.js"
click node_authroutes "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/authRoutes.js"
click node_postroutes "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/postRoutes.js"
click node_userroutes "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/userRoutes.js"
click node_authmw "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/middleware/auth.js"
click node_authctrl "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/controllers/authController.js"
click node_postctrl "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/controllers/postController.js"
click node_userctrl "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/controllers/userController.js"
click node_dbconfig "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/config/db.js"
click node_users "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/models/User.js"
click node_posts "https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/models/Post.js"
click node_media "https://github.com/monish-kumar-a/pinvault/tree/main/backend/uploads"

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_feed,node_postdetail,node_uploadpage,node_profilepage,node_collections,node_authpages,node_authform,node_feedui,node_postcard,node_authcontext,node_theme,node_apiclient,node_visitor toneBlue
class node_server,node_authroutes,node_postroutes,node_userroutes,node_authmw,node_authctrl,node_postctrl,node_userctrl,node_mongodb toneAmber
class node_dbconfig,node_users,node_posts,node_media toneMint
```

## Components

### Frontend experience

- [Feed and discovery](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/page.tsx): `frontend/src/app/page.tsx`
- [Post details](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/post/%5Bid%5D/page.tsx): `frontend/src/app/post/[id]/page.tsx`
- [Media upload](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/upload/page.tsx): `frontend/src/app/upload/page.tsx`
- [User profile](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/profile/%5Bid%5D/page.tsx): `frontend/src/app/profile/[id]/page.tsx`
- [Liked and saved](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/liked/page.tsx): `frontend/src/app/liked/page.tsx`
- [Login and register](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/app/login/page.tsx): `frontend/src/app/login/page.tsx`
- [Authentication form](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/components/AuthForm.tsx): `frontend/src/components/AuthForm.tsx`
- [Masonry feed UI](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/components/MasonryFeed.tsx): `frontend/src/components/MasonryFeed.tsx`
- [Post card UI](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/components/PostCard.tsx): `frontend/src/components/PostCard.tsx`
- [Session context](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/context/AuthContext.tsx): `frontend/src/context/AuthContext.tsx`
- [Theme context](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/context/ThemeContext.tsx): `frontend/src/context/ThemeContext.tsx`
- [API client](https://github.com/monish-kumar-a/pinvault/blob/main/frontend/src/lib/api.ts): `frontend/src/lib/api.ts`

### Backend API

- [Express server](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/server.js): `backend/src/server.js`
- [Auth routes](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/authRoutes.js): `backend/src/routes/authRoutes.js`
- [Post routes](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/postRoutes.js): `backend/src/routes/postRoutes.js`
- [User routes](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/routes/userRoutes.js): `backend/src/routes/userRoutes.js`
- [JWT authorization](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/middleware/auth.js): `backend/src/middleware/auth.js`
- [Authentication logic](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/controllers/authController.js): `backend/src/controllers/authController.js`
- [Post and comment logic](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/controllers/postController.js): `backend/src/controllers/postController.js`
- [Profile collections logic](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/controllers/userController.js): `backend/src/controllers/userController.js`

### Persistence and media

- [Database connection](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/config/db.js): `backend/src/config/db.js`
- [User records](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/models/User.js): `backend/src/models/User.js`
- [Post records](https://github.com/monish-kumar-a/pinvault/blob/main/backend/src/models/Post.js): `backend/src/models/Post.js`
- [Uploaded media files](https://github.com/monish-kumar-a/pinvault/tree/main/backend/uploads): `backend/uploads`

### Other components

- **Visitor / user**
- **MongoDB**

## Connections

- Visitor / user → Feed and discovery: browses
- Visitor / user → Login and register: signs in
- Login and register → Authentication form: renders
- Authentication form → Session context: submits credentials
- Session context → API client: requests session
- Feed and discovery → Masonry feed UI: renders feed
- Masonry feed UI → Post card UI: renders posts
- Feed and discovery → API client: loads discovery
- Post details → API client: loads post
- Media upload → API client: submits media
- User profile → API client: loads profile
- Liked and saved → API client: loads collections
- Visitor / user → Post details: views and interacts
- Visitor / user → Media upload: uploads content
- Visitor / user → User profile: views profile
- Visitor / user → Liked and saved: manages posts
- Express server → Auth routes: mounts routes
- Express server → Post routes: mounts routes
- Express server → User routes: mounts routes
- Express server → Database connection: connects database
- Express server → Uploaded media files: serves files
- API client → Express server: sends API requests
- Auth routes → Authentication logic: dispatches
- Auth routes → JWT authorization: protects session route
- Post routes → Post and comment logic: dispatches
- Post routes → JWT authorization: protects mutations
- Post routes → Uploaded media files: stores uploaded files
- User routes → Profile collections logic: dispatches
- User routes → JWT authorization: protects user routes
- JWT authorization → User records: loads account
- Authentication logic → User records: reads and writes
- Post and comment logic → Post records: reads and writes
- Post and comment logic → User records: reads and writes
- Profile collections logic → User records: reads and writes
- Profile collections logic → Post records: reads posts
- Database connection → MongoDB: connects
- Theme context → Visitor / user: provides theme choice