# ftnimran/linknest architecture

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

- Interactive diagram: https://gitdiagram.com/ftnimran/linknest
- Repository: https://github.com/ftnimran/linknest

## Overview

LinkNest lets people authenticate, create and share a public profile with ordered links and uploaded media, while account holders manage that profile from a protected dashboard. The main stages are OTP-backed registration or password recovery, authenticated profile editing, and public profile viewing/sharing; backend controllers persist profile and authentication state. README-described dashboard, PDF viewing, crop, and sharing capabilities are included where their source paths exist. Excerpts do not show all frontend request wiring, so uncertain calls are omitted.

Main entry points: [`backend/src/controllers/authController.js`](https://github.com/ftnimran/linknest/blob/main/backend/src/controllers/authController.js) (Authentication), [`frontend/src/App.jsx`](https://github.com/ftnimran/linknest/blob/main/frontend/src/App.jsx) (Route application), [`frontend/src/pages/ProfilePage.jsx`](https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/ProfilePage.jsx) (Public profile), [`backend/src/server.js`](https://github.com/ftnimran/linknest/blob/main/backend/src/server.js) (Express server)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web experience"]
  node_frontend_app["Route application<br/>[App.jsx]"]
  node_login_page["Login and OTP<br/>[LoginPage.jsx]"]
  node_auth_context["Auth state<br/>[AuthContext.jsx]"]
  node_dashboard["Profile editor<br/>[AdminDashboard.jsx]"]
  node_link_list["Sortable links"]
  node_public_profile["Public profile<br/>[ProfilePage.jsx]"]
  node_profile_header["Profile header<br/>[ProfileHeader.jsx]"]
  node_link_button["Profile links<br/>[LinkButton.jsx]"]
  node_resume_viewer["Resume viewer"]
  node_crop_tool["Image crop<br/>[ImageCropModal.jsx]"]
end

subgraph group_api["API and domain"]
  node_server["Express server<br/>[server.js]"]
  node_auth_routes["Auth routes<br/>[authRoutes.js]"]
  node_user_routes["Profile routes<br/>[userRoutes.js]"]
  node_auth_controller["Authentication<br/>[authController.js]"]
  node_user_controller["Profile management<br/>[userController.js]"]
  node_auth_middleware["Token protection<br/>[authMiddleware.js]"]
  node_upload_middleware["File upload"]
end

subgraph group_state["Persistence and messaging"]
  node_user_model[("User records<br/>[User.js]")]
  node_otp_model[("OTP records<br/>[Otp.js]")]
  node_db_config["Database connection<br/>[db.js]"]
  node_mailer["Email delivery<br/>[mailer.js]"]
  node_otp_generator["OTP generation<br/>[generateOTP.js]"]
end

node_visitor(("Profile visitor"))
node_account_holder(("Account holder"))
node_mongo[("MongoDB")]
node_email_service["Email service"]

node_visitor -->|"opens profile"| node_frontend_app
node_account_holder -->|"uses app"| node_frontend_app
node_frontend_app -->|"routes login"| node_login_page
node_frontend_app -->|"routes admin"| node_dashboard
node_frontend_app -->|"routes username"| node_public_profile
node_login_page -->|"establishes session"| node_auth_context
node_auth_context -->|"fetches own profile"| node_server
node_server -->|"mounts auth API"| node_auth_routes
node_server -->|"mounts profile API"| node_user_routes
node_auth_routes -->|"dispatches auth"| node_auth_controller
node_user_routes -->|"dispatches profile"| node_user_controller
node_user_routes -->|"protects edits"| node_auth_middleware
node_user_routes -->|"handles media"| node_upload_middleware
node_auth_controller -->|"reads and writes users"| node_user_model
node_auth_controller -->|"stores and verifies codes"| node_otp_model
node_auth_controller -->|"generates codes"| node_otp_generator
node_auth_controller -->|"sends OTP mail"| node_mailer
node_mailer -->|"delivers email"| node_email_service
node_user_controller -->|"reads and updates profiles"| node_user_model
node_server -->|"connects database"| node_db_config
node_db_config -->|"opens connection"| node_mongo
node_dashboard -->|"manages links"| node_link_list
node_dashboard -->|"edits avatar"| node_crop_tool
node_public_profile -->|"presents profile"| node_profile_header
node_public_profile -->|"renders links"| node_link_button
node_public_profile -->|"previews resume"| node_resume_viewer

click node_frontend_app "https://github.com/ftnimran/linknest/blob/main/frontend/src/App.jsx"
click node_login_page "https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/LoginPage.jsx"
click node_auth_context "https://github.com/ftnimran/linknest/blob/main/frontend/src/context/AuthContext.jsx"
click node_dashboard "https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/AdminDashboard.jsx"
click node_link_list "https://github.com/ftnimran/linknest/blob/main/frontend/src/components/Admin/DraggableLinkList.jsx"
click node_public_profile "https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/ProfilePage.jsx"
click node_profile_header "https://github.com/ftnimran/linknest/blob/main/frontend/src/components/ProfileHeader.jsx"
click node_link_button "https://github.com/ftnimran/linknest/blob/main/frontend/src/components/LinkButton.jsx"
click node_resume_viewer "https://github.com/ftnimran/linknest/blob/main/frontend/src/components/ResumeViewerModal.jsx"
click node_crop_tool "https://github.com/ftnimran/linknest/blob/main/frontend/src/components/Admin/ImageCropModal.jsx"
click node_server "https://github.com/ftnimran/linknest/blob/main/backend/src/server.js"
click node_auth_routes "https://github.com/ftnimran/linknest/blob/main/backend/src/routes/authRoutes.js"
click node_user_routes "https://github.com/ftnimran/linknest/blob/main/backend/src/routes/userRoutes.js"
click node_auth_controller "https://github.com/ftnimran/linknest/blob/main/backend/src/controllers/authController.js"
click node_user_controller "https://github.com/ftnimran/linknest/blob/main/backend/src/controllers/userController.js"
click node_auth_middleware "https://github.com/ftnimran/linknest/blob/main/backend/src/middlewares/authMiddleware.js"
click node_upload_middleware "https://github.com/ftnimran/linknest/blob/main/backend/src/middlewares/uploadMiddleware.js"
click node_user_model "https://github.com/ftnimran/linknest/blob/main/backend/src/models/User.js"
click node_otp_model "https://github.com/ftnimran/linknest/blob/main/backend/src/models/Otp.js"
click node_db_config "https://github.com/ftnimran/linknest/blob/main/backend/src/config/db.js"
click node_mailer "https://github.com/ftnimran/linknest/blob/main/backend/src/config/mailer.js"
click node_otp_generator "https://github.com/ftnimran/linknest/blob/main/backend/src/utils/generateOTP.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_frontend_app,node_login_page,node_auth_context,node_dashboard,node_link_list,node_public_profile,node_profile_header,node_link_button,node_resume_viewer,node_crop_tool toneBlue
class node_server,node_auth_routes,node_user_routes,node_auth_controller,node_user_controller,node_auth_middleware,node_upload_middleware,node_mongo toneAmber
class node_user_model,node_otp_model,node_db_config,node_mailer,node_otp_generator toneMint
class node_visitor,node_account_holder,node_email_service toneIndigo
```

## Components

### Web experience

- [Route application](https://github.com/ftnimran/linknest/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Login and OTP](https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/LoginPage.jsx): `frontend/src/pages/LoginPage.jsx`
- [Auth state](https://github.com/ftnimran/linknest/blob/main/frontend/src/context/AuthContext.jsx): `frontend/src/context/AuthContext.jsx`
- [Profile editor](https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/AdminDashboard.jsx): `frontend/src/pages/AdminDashboard.jsx`
- [Sortable links](https://github.com/ftnimran/linknest/blob/main/frontend/src/components/Admin/DraggableLinkList.jsx): `frontend/src/components/Admin/DraggableLinkList.jsx`
- [Public profile](https://github.com/ftnimran/linknest/blob/main/frontend/src/pages/ProfilePage.jsx): `frontend/src/pages/ProfilePage.jsx`
- [Profile header](https://github.com/ftnimran/linknest/blob/main/frontend/src/components/ProfileHeader.jsx): `frontend/src/components/ProfileHeader.jsx`
- [Profile links](https://github.com/ftnimran/linknest/blob/main/frontend/src/components/LinkButton.jsx): `frontend/src/components/LinkButton.jsx`
- [Resume viewer](https://github.com/ftnimran/linknest/blob/main/frontend/src/components/ResumeViewerModal.jsx): `frontend/src/components/ResumeViewerModal.jsx`
- [Image crop](https://github.com/ftnimran/linknest/blob/main/frontend/src/components/Admin/ImageCropModal.jsx): `frontend/src/components/Admin/ImageCropModal.jsx`

### API and domain

- [Express server](https://github.com/ftnimran/linknest/blob/main/backend/src/server.js): `backend/src/server.js`
- [Auth routes](https://github.com/ftnimran/linknest/blob/main/backend/src/routes/authRoutes.js): `backend/src/routes/authRoutes.js`
- [Profile routes](https://github.com/ftnimran/linknest/blob/main/backend/src/routes/userRoutes.js): `backend/src/routes/userRoutes.js`
- [Authentication](https://github.com/ftnimran/linknest/blob/main/backend/src/controllers/authController.js): `backend/src/controllers/authController.js`
- [Profile management](https://github.com/ftnimran/linknest/blob/main/backend/src/controllers/userController.js): `backend/src/controllers/userController.js`
- [Token protection](https://github.com/ftnimran/linknest/blob/main/backend/src/middlewares/authMiddleware.js): `backend/src/middlewares/authMiddleware.js`
- [File upload](https://github.com/ftnimran/linknest/blob/main/backend/src/middlewares/uploadMiddleware.js): `backend/src/middlewares/uploadMiddleware.js`

### Persistence and messaging

- [User records](https://github.com/ftnimran/linknest/blob/main/backend/src/models/User.js): `backend/src/models/User.js`
- [OTP records](https://github.com/ftnimran/linknest/blob/main/backend/src/models/Otp.js): `backend/src/models/Otp.js`
- [Database connection](https://github.com/ftnimran/linknest/blob/main/backend/src/config/db.js): `backend/src/config/db.js`
- [Email delivery](https://github.com/ftnimran/linknest/blob/main/backend/src/config/mailer.js): `backend/src/config/mailer.js`
- [OTP generation](https://github.com/ftnimran/linknest/blob/main/backend/src/utils/generateOTP.js): `backend/src/utils/generateOTP.js`

### Other components

- **Profile visitor**
- **Account holder**
- **MongoDB**
- **Email service**

## Connections

- Profile visitor → Route application: opens profile
- Account holder → Route application: uses app
- Route application → Login and OTP: routes login
- Route application → Profile editor: routes admin
- Route application → Public profile: routes username
- Login and OTP → Auth state: establishes session
- Auth state → Express server: fetches own profile
- Express server → Auth routes: mounts auth API
- Express server → Profile routes: mounts profile API
- Auth routes → Authentication: dispatches auth
- Profile routes → Profile management: dispatches profile
- Profile routes → Token protection: protects edits
- Profile routes → File upload: handles media
- Authentication → User records: reads and writes users
- Authentication → OTP records: stores and verifies codes
- Authentication → OTP generation: generates codes
- Authentication → Email delivery: sends OTP mail
- Email delivery → Email service: delivers email
- Profile management → User records: reads and updates profiles
- Express server → Database connection: connects database
- Database connection → MongoDB: opens connection
- Profile editor → Sortable links: manages links
- Profile editor → Image crop: edits avatar
- Public profile → Profile header: presents profile
- Public profile → Profile links: renders links
- Public profile → Resume viewer: previews resume