How coditor-ops/smart-link-hub works
Purpose and Entry Points
Smart Link Hub is a MERN link-in-bio platform: users authenticate, create/manage link hubs, publish public profiles, and apply conditional link visibility. The React SPA starts at client/src/main.tsx and route/page composition is centered in client/src/App.tsx. The Express API starts in server/src/server.ts.
Client Application Shell
The Vite/React TypeScript client provides both marketing, authenticated management, and public-profile experiences. Shared visual structure and responsive UI reside in client/src/components/Layout.tsx and global styling in client/src/App.css. Primary screens are client/src/pages/Landing.tsx, client/src/pages/Dashboard.tsx, client/src/pages/HubManager.tsx, and client/src/pages/PublicProfile.tsx.
Client State, Authentication, and API Boundary
Authentication state is owned by React context in client/src/context/AuthContext.tsx; theme preference is separately scoped in client/src/context/ThemeContext.tsx. Browser-to-server communication is centralized in client/src/services/api.ts, forming the principal client/API boundary. Protected management flows originate from client/src/pages/Login.tsx, client/src/pages/Register.tsx, and the dashboard/hub-management pages.
Hub and Link Management
A hub is the principal owned publishing unit; links belong to and are managed within hubs. The editing workflow is composed from client/src/pages/HubManager.tsx, client/src/components/LinkEditor.tsx, and client/src/components/TargetLocationSelector.tsx. It supports link CRUD, link imagery, and rules based on time, device, or location. QR generation is represented in client/src/components/HubQRCode.tsx.
Public Delivery and Link Resolution
Public profiles render a hub’s visible identity and eligible links through client/src/pages/PublicProfile.tsx, client/src/components/ProfileHeader.tsx, and client/src/components/LinkCard.tsx. Server-side resolution logic in server/src/services/LinkResolver.ts is the important policy boundary for deciding which links are visible under contextual rules. Link shortening/redirect-related API behavior is handled by server/src/controllers/LinkShortenerController.ts.
Server API and Domain Layer
Express routes divide the API by concern: authentication in server/src/routes/authRoutes.ts, hub operations in server/src/routes/hubRoutes.ts, link operations in server/src/routes/linkRoutes.ts, and asset uploads in server/src/routes/uploadRoutes.ts. Controllers implement request orchestration, notably server/src/controllers/HubController.ts and server/src/controllers/LinkController.ts. JWT validation is an API boundary enforced by server/src/middleware/auth.ts.
Persistence, Assets, and Runtime Infrastructure
MongoDB is accessed through Mongoose configuration in server/src/config/database.ts. Core persisted entities are defined by server/src/models/User.ts, server/src/models/LinkHub.ts, and server/src/models/Link.ts. Uploaded link/profile assets are handled by the upload route and stored under server/uploads. Runtime requires Node.js, MongoDB/Atlas, and environment values including MONGO_URI, JWT_SECRET, and PORT as indicated by server/.env.example.
Main entry points: App.tsx App routes · hubRoutes.ts API routes · api.ts API client · HubManager.tsx Hub management
Components 18
React Client
- Client entry
client/src/main.tsx - App routes · Composes marketing, management, and public-profile routes.
client/src/App.tsx - Shared layout
client/src/components/Layout.tsx - Auth state
client/src/context/AuthContext.tsx - Theme state
client/src/context/ThemeContext.tsx - API client · Centralizes browser-to-server requests.
client/src/services/api.ts - Hub management · Creates hubs and manages links and conditional rules.
client/src/pages/HubManager.tsx - Link editor
client/src/components/LinkEditor.tsx - Public profile · Renders a hub's identity and eligible links.
client/src/pages/PublicProfile.tsx
Express API
- API server
server/src/server.ts - API routes · Auth, hub, link, and upload endpoints.
server/src/routes/hubRoutes.ts - JWT middleware
server/src/middleware/auth.ts - Hub controller
server/src/controllers/HubController.ts - Link controller
server/src/controllers/LinkController.ts - Link resolver · Applies time, device, and location eligibility rules.
server/src/services/LinkResolver.ts - Short-link redirect
server/src/controllers/LinkShortenerController.ts
Data & Assets
- MongoDB · Stores users, hubs, and links.
server/src/config/database.ts - Uploaded assets · Profile and link imagery.
server/uploads
Connections 22
- Client entry → App routes: mounts
- App routes → Shared layout: uses
- App routes → Auth state: consumes
- App routes → Theme state: consumes
- App routes → Hub management: management route
- App routes → Public profile: public route
- Hub management → Link editor: edits links
- Hub management → API client: hub and link CRUD
- Public profile → API client: loads visible hub
- Auth state → API client: auth requests/token
- API client → API server: HTTP
- API server → API routes: registers
- API routes → JWT middleware: protects management APIs
- JWT middleware → Hub controller: authorizes
- JWT middleware → Link controller: authorizes
- API routes → Short-link redirect: redirect endpoint
- Hub controller → MongoDB: hub persistence
- Link controller → MongoDB: link persistence
- Link controller → Uploaded assets: serves asset references
- API routes → Link resolver: public visibility lookup
- Link resolver → MongoDB: reads hubs and links
- API routes → Uploaded assets: upload endpoints