# charansaigompa/devtinder-fullstack architecture

> Architecture diagram of the GitHub repository charansaigompa/devtinder-fullstack, 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/charansaigompa/devtinder-fullstack
- Repository: https://github.com/charansaigompa/devtinder-fullstack

## Overview

DevTinder is a developer networking web app. The main user journey is to authenticate, create or update a profile, discover developers, send or respond to connection requests, and chat with accepted contacts. The frontend provides routed screens and shared Redux state; the Express app mounts domain routers, connects MongoDB, and initializes Socket.IO. The README documents image uploads through Cloudinary. Several route and UI implementations were not sampled, so those feature links reflect documented capabilities rather than inspected call details.

Main entry points: [`backend/src/app.js`](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/app.js) (Express app), [`frontend/src/App.jsx`](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/App.jsx) (Routed app), [`backend/src/routes/user.js`](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/user.js) (Developer routes), [`backend/src/middleware/auth.js`](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/middleware/auth.js) (JWT authentication)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_frontend["Web application"]
  node_app["Routed app<br/>[App.jsx]"]
  node_login["Login and signup<br/>[Login.jsx]"]
  node_profileui["Profile editing<br/>[EditProfile.jsx]"]
  node_feed["Developer discovery<br/>[Feed.jsx]"]
  node_connectionsui["Connections<br/>[Connections.jsx]"]
  node_requestsui["Connection requests<br/>[Requests.jsx]"]
  node_chatui["Chat screen<br/>[Chat.jsx]"]
  node_state["Client state<br/>[appStore.js]"]
end

subgraph group_backend["API and domain"]
  node_api["Express app<br/>[app.js]"]
  node_authroutes["Authentication routes<br/>[auth.js]"]
  node_profileroutes["Profile routes<br/>[profile.js]"]
  node_userroutes["Developer routes<br/>[user.js]"]
  node_requestroutes["Request routes<br/>[request.js]"]
  node_chatroutes["Chat routes<br/>[chat.js]"]
  node_authmw["JWT authentication<br/>[auth.js]"]
  node_validation["Signup validation<br/>[validation.js]"]
end

subgraph group_persistence["Data and media"]
  node_users[("User records<br/>[user.js]")]
  node_requests[("Connection records")]
  node_chats[("Chat records<br/>[chat.js]")]
  node_mongodb[("MongoDB")]
  node_cloudinary[("Cloudinary")]
  node_cloudinaryutil["Image upload utility<br/>[cloudinary.js]"]
end

subgraph group_realtime["Real-time messaging"]
  node_socketclient["Socket client<br/>[socket.js]"]
  node_socketserver["Socket.IO server<br/>[socket.js]"]
end

node_developer(("Developer"))

node_developer -->|"uses"| node_app
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_profileui
node_app -->|"routes to"| node_feed
node_app -->|"routes to"| node_connectionsui
node_app -->|"routes to"| node_requestsui
node_app -->|"routes to"| node_chatui
node_login -->|"authenticates via"| node_api
node_profileui -->|"updates via"| node_profileroutes
node_feed -->|"discovers via"| node_userroutes
node_connectionsui -->|"loads via"| node_userroutes
node_requestsui -->|"manages via"| node_requestroutes
node_chatui -->|"uses"| node_socketclient
node_chatui -->|"loads history via"| node_chatroutes
node_login -->|"updates"| node_state
node_profileui -->|"updates"| node_state
node_api -->|"mounts"| node_authroutes
node_api -->|"mounts"| node_profileroutes
node_api -->|"mounts"| node_userroutes
node_api -->|"mounts"| node_requestroutes
node_api -->|"mounts"| node_chatroutes
node_api -->|"initializes"| node_socketserver
node_api -->|"connects"| node_mongodb
node_authroutes -->|"validates signup"| node_validation
node_authroutes -->|"reads and writes"| node_users
node_authmw -->|"loads user"| node_users
node_profileroutes -->|"protects profile"| node_authmw
node_requestroutes -->|"protects requests"| node_authmw
node_userroutes -->|"protects access"| node_authmw
node_chatroutes -->|"protects chat"| node_authmw
node_socketserver -->|"saves messages"| node_chats
node_socketclient -->|"exchanges events"| node_socketserver
node_profileroutes -.->|"uploads images"| node_cloudinaryutil
node_cloudinaryutil -.->|"stores images"| node_cloudinary
node_api -->|"persists through"| node_users
node_requestroutes -->|"manages records"| node_requests
node_userroutes -->|"reads profiles"| node_users

click node_app "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/App.jsx"
click node_login "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Login.jsx"
click node_profileui "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/EditProfile.jsx"
click node_feed "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Feed.jsx"
click node_connectionsui "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Connections.jsx"
click node_requestsui "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Requests.jsx"
click node_chatui "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Chat.jsx"
click node_state "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/utils/appStore.js"
click node_api "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/app.js"
click node_authroutes "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/auth.js"
click node_profileroutes "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/profile.js"
click node_userroutes "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/user.js"
click node_requestroutes "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/request.js"
click node_chatroutes "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/chat.js"
click node_authmw "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/middleware/auth.js"
click node_validation "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/utils/validation.js"
click node_users "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/models/user.js"
click node_requests "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/models/connectionRequest.js"
click node_chats "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/models/chat.js"
click node_cloudinaryutil "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/utils/cloudinary.js"
click node_socketclient "https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/utils/socket.js"
click node_socketserver "https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/utils/socket.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_login,node_profileui,node_feed,node_connectionsui,node_requestsui,node_chatui,node_state toneBlue
class node_api,node_authroutes,node_profileroutes,node_userroutes,node_requestroutes,node_chatroutes,node_authmw,node_validation toneAmber
class node_users,node_requests,node_chats,node_mongodb,node_cloudinary,node_cloudinaryutil toneMint
class node_socketclient,node_socketserver toneRose
class node_developer toneIndigo
```

## Components

### Web application

- [Routed app](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Login and signup](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Login.jsx): `frontend/src/components/Login.jsx`
- [Profile editing](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/EditProfile.jsx): `frontend/src/components/EditProfile.jsx`
- [Developer discovery](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Feed.jsx): `frontend/src/components/Feed.jsx`
- [Connections](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Connections.jsx): `frontend/src/components/Connections.jsx`
- [Connection requests](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Requests.jsx): `frontend/src/components/Requests.jsx`
- [Chat screen](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/components/Chat.jsx): `frontend/src/components/Chat.jsx`
- [Client state](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/utils/appStore.js): `frontend/src/utils/appStore.js`

### API and domain

- [Express app](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/app.js): `backend/src/app.js`
- [Authentication routes](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/auth.js): `backend/src/routes/auth.js`
- [Profile routes](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/profile.js): `backend/src/routes/profile.js`
- [Developer routes](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/user.js): `backend/src/routes/user.js`
- [Request routes](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/request.js): `backend/src/routes/request.js`
- [Chat routes](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/routes/chat.js): `backend/src/routes/chat.js`
- [JWT authentication](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/middleware/auth.js): `backend/src/middleware/auth.js`
- [Signup validation](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/utils/validation.js): `backend/src/utils/validation.js`

### Data and media

- [User records](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/models/user.js): `backend/src/models/user.js`
- [Connection records](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/models/connectionRequest.js): `backend/src/models/connectionRequest.js`
- [Chat records](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/models/chat.js): `backend/src/models/chat.js`
- **MongoDB**
- **Cloudinary**
- [Image upload utility](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/utils/cloudinary.js): `backend/src/utils/cloudinary.js`

### Real-time messaging

- [Socket client](https://github.com/charansaigompa/devtinder-fullstack/blob/main/frontend/src/utils/socket.js): `frontend/src/utils/socket.js`
- [Socket.IO server](https://github.com/charansaigompa/devtinder-fullstack/blob/main/backend/src/utils/socket.js): `backend/src/utils/socket.js`

### Other components

- **Developer**

## Connections

- Developer → Routed app: uses
- Routed app → Login and signup: routes to
- Routed app → Profile editing: routes to
- Routed app → Developer discovery: routes to
- Routed app → Connections: routes to
- Routed app → Connection requests: routes to
- Routed app → Chat screen: routes to
- Login and signup → Express app: authenticates via
- Profile editing → Profile routes: updates via
- Developer discovery → Developer routes: discovers via
- Connections → Developer routes: loads via
- Connection requests → Request routes: manages via
- Chat screen → Socket client: uses
- Chat screen → Chat routes: loads history via
- Login and signup → Client state: updates
- Profile editing → Client state: updates
- Express app → Authentication routes: mounts
- Express app → Profile routes: mounts
- Express app → Developer routes: mounts
- Express app → Request routes: mounts
- Express app → Chat routes: mounts
- Express app → Socket.IO server: initializes
- Express app → MongoDB: connects
- Authentication routes → Signup validation: validates signup
- Authentication routes → User records: reads and writes
- JWT authentication → User records: loads user
- Profile routes → JWT authentication: protects profile
- Request routes → JWT authentication: protects requests
- Developer routes → JWT authentication: protects access
- Chat routes → JWT authentication: protects chat
- Socket.IO server → Chat records: saves messages
- Socket client → Socket.IO server: exchanges events
- Profile routes → Image upload utility: uploads images
- Image upload utility → Cloudinary: stores images
- Express app → User records: persists through
- Request routes → Connection records: manages records
- Developer routes → User records: reads profiles