🌌 Deep Dey — Portfolio & System Architecture

Software Architect · AI Prompt Engineer · JEE Advanced 2027 Aspirant

"100% effort + extra 1% = Dream Achieved."

🌐 Live Site · 📬 Contact · 🔗 Links Hub · 📖 Journal

📖 Overview

This repository is the complete source code of Deep Dey's personal portfolio platform — a production-grade, high-fidelity web application built with a cinematic Dark-Amber design language (zinc-950 backgrounds · amber-500 glowing accents).

It is not just a portfolio site. It is a system-architecture-themed personal brand platform that combines:

3+ years of self-taught full-stack experience
A live Build Journal (markdown CMS with MongoDB backend)
A Content Dashboard for managing journals, images, and categories
A YouTube Live Stream hub with tab filters and pagination
A Smart Contact Router that auto-maps inquiry types to correct email channels
Max-level Technical SEO with JSON-LD structured data

All while the author simultaneously prepares for JEE Advanced 2027 targeting IIT KGP CSE.

🎯 Feature Highlights

🔭 Global Command Palette Search

Full-stack search engine at /search with typewriter-animated suggestions, trending query tracking, localStorage history, and a TF-IDF ML fallback. Searches journals, projects, FAQs, social links, live status, plus community users and comment permalinks. Fully indexed in the sitemap.

📡 Real-Time System Status Monitor

Live status page at /status probes all website-critical API routes every 60 s (heavy endpoints every 5 min) and displays latency, HTTP status, and connection quality. Monitored endpoints include auth, journal listing/search/top feeds, user profile/activity/community APIs, categories, projects, timeline, links, FAQs, YouTube live feed, contact (GET + POST), sitemap, and upload proxy route metadata. Includes a Server Health panel with a highlighted System Specifications card showing RAM, storage, CPU model/cores/speed, OS type and kernel, architecture, runtime version, server region, and hostname. A rate-limited "Refresh Now" button (global 20/min · per-IP 2/min) triggers a full health snapshot stored in MongoDB for historical tracking.

🎬 Cinematic Loading Engine

A system-parsing intro screen with a live progress bar and 50-quote rotating archive. Masks lazy-loaded asset hydration with an AAA-grade first impression.

🎞️ Kinetic 3D PDF Portfolio Viewer

Custom react-pdf viewer wrapped in a Motion 3D physics engine (rotateY). Includes A4 aspect-ratio lock, zoom controls, and an external-URL fallback chain.

📬 Smart Contact Routing Matrix

Backend-less intelligent intake. Routes 15 inquiry categories to the right email node with pre-filled mailto tickets and auto-generated ticket IDs.

📓 Journal CMS with Embed Support

Full markdown/HTML journal system backed by MongoDB. Features per-visit view counting, one-like-per-session enforcement, native share API, image galleries, and embeddable iframe output (/journal/embed/:id). Rich text renders headings, lists, bold, blockquotes, and media with premium typography.

📺 YouTube Live Hub

Auto-loads the current live stream. Sidebar shows all channel content filtered by All / Stream / Video / Shorts tabs with newest-first sorting, views count, and Prev/Next pagination (20 per page).

🖼️ CDN Image Upload & Media CMS (Dashboard)

Owner-only dashboard uploads images to static.qlynk.me via /api/upload-image proxy. Supports file picker, drag-and-drop, clipboard paste, and URL links. Rich text editor includes one-click embed buttons for Images, YouTube/MP4 Videos, and Audio — no manual HTML required.

🌐 Data-Driven Link-in-Bio Engine

A JSON-driven hub mapping 30+ internal/external nodes with dynamic inline SVG icons that auto-adapt to the Dark-Amber theme.

⏱️ Self-Aware Timeline

The milestone timeline uses new Date().getFullYear() to auto-highlight the current active phase with a glowing amber radar pulse (extends to 2035).

🔍 Max-Level SEO

react-helmet-async drives per-route metadata injection: Canonical URLs, OpenGraph/Twitter cards, and Schema.org JSON-LD (Person, FAQPage, SoftwareApplication). All routes including /search, /user, and /journal/comment are included in the XML sitemap.

🌍 12-Language i18n

Full UI translated across EN · BN · HI · ES · FR · DE · AR · RU · PT · JA · KO · ZH via a custom React Context provider.

💬 Journal Comment System

Readers can leave comments on any journal post using Google Sign-In — no password needed. Supports threaded replies, likes, and direct comment permalinks (/journal/view/:id/comment/:commentId). A full comment thread view (/journal/view/:id/comments) shows all comments with sort (top/new/old) and pagination. A step-by-step /journal/comment guide explains the rules and how to participate.

👥 Community User Profiles

Every reader who signs in gets a public profile at /user/:userId. Profiles show a customizable title, bio, social links (GitHub, Twitter, LinkedIn, Instagram, YouTube, Website, Custom with Google Favicon auto-detection), a 52-week contribution heatmap, and tabbed views for Overview, Comments, and Activity Log. The /user page lists all contributors with the owner card pinned at the top — styled with a glowing gradient-border frame, myphoto.png avatar with an amber halo, and a 👑 Owner badge for a visually distinct king-vibe presence. Verified tick and crown badges are now rendered as frontend vector icons (not public image files) for a cleaner professional UI. The owner's /user/owner profile page carries the same premium styling.

🗺️ Dynamic XML Sitemap with RAM Cache

/api/sitemap auto-generates a valid XML sitemap scoped exclusively to deepdey.vercel.app. It covers all static routes (excluding /dashboard and /journal/embed), dynamically fetches published journals and emits slug-based journal URLs, comment-thread pages, comment permalink routes, and user profile URLs from MongoDB. Results are stored in-memory and refreshed every 6 hours (Cache-Control: s-maxage=21600). Subsequent requests within the TTL window are served instantly from RAM (X-Sitemap-Cache: HIT).

🚀 Key Features of New Dashboard

Advanced Project Ecosystem: Manage portfolio projects through a custom dashboard. Switch seamlessly between static data files and a dynamic MongoDB database.
Overpowered Screenshot Bot: A custom 3-Layer backend architecture that automatically captures live website screenshots.
- Uses Google's PageSpeed API, Global Geo-Proxies, and rotating Human-Agent headers to completely bypass bot protection (Cloudflare, CAPTCHAs) and Vercel's strict serverless timeout limits.
Smart UI Previews: Auto-crops and formats dynamic Base64 images directly on the client side to maintain perfect aspect ratios without overloading the backend.
Media Embeds: Insert images, YouTube iframes, MP4 videos, and audio tracks directly into journal posts via toolbar prompt buttons.
Owner User Monitoring: The Dashboard Users tab lists all registered commenters. Clicking a user reveals a detail panel with their full metadata including account creation datetime + IP + country, last activity datetime + IP + country, comment history with abuse flags, quick-block controls, and a link to their public profile.

🛠️ Technology Stack

Layer	Technology	Version	Purpose
UI Framework	React	`19.x`	Component-driven UI with concurrent rendering
Language	TypeScript	`5.x`	Static typing across all components and data
Build Tool	Vite	`6.x`	Sub-second HMR, tree-shaking, chunked bundles
Styling	Tailwind CSS	`4.x`	Utility-first Dark-Amber glassmorphism system
Animation	Motion	`12.x`	Physics-based transitions, 3D flips, scroll reveals
Routing	React Router DOM	`7.x`	Lazy-loaded SPA with wildcard 404 handling
PDF Renderer	react-pdf	`9.x`	Client-side A4 portfolio document renderer
SEO	react-helmet-async	`2.x`	Async head tag injection for rich snippets
Database	MongoDB Atlas	—	Journal, category, status, health snapshot, and rate-limit persistence
CDN / Storage	static.qlynk.me	—	Proxied secure image upload and hosting
Hosting	Vercel	—	Global edge CDN, CI/CD, SPA rewrites

📂 Project Structure

📦 My-Portfolio
 ┣ 📜 README.md                  # You are here
 ┣ 📜 LICENSE                    # Custom Restricted (View-Only) license
 ┣ 📜 SECURITY.md                # Vulnerability reporting policy
 ┣ 📜 CONTRIBUTING.md            # Contribution guidelines
 ┣ 📜 CONTRIBUTOR.md             # Contributor acknowledgements
 ┣ 📜 CODE_OF_CONDUCT.md         # Community behavior standards
 ┣ 📜 SUPPORT.md                 # Support channels
 ┣ 📜 package.json               # Scripts and dependency manifest
 ┣ 📜 tsconfig.json              # TypeScript compiler configuration
 ┣ 📜 tailwind.config.js         # Tailwind theme customization
 ┣ 📜 vite.config.ts             # Vite build and dev configuration
 ┣ 📜 vercel.json                # Vercel routing rules and redirects
 ┣ 📜 metadata.json              # Repository metadata
 ┣ 📜 index.html                 # Vite HTML entry point
 ┣ 📂 api                        # Vercel serverless API routes
 ┃ ┣ 📜 auth.js                  # Session authentication handler
 ┃ ┣ 📜 categories.js            # Journal category CRUD
 ┃ ┣ 📜 contact.js               # Contact form handler
 ┃ ┣ 📜 faqs.js                  # FAQ data endpoint
 ┃ ┣ 📜 journal.js               # Journal CRUD · health · rate-limited refresh
 ┃ ┣ 📜 links.js                 # Links data endpoint
 ┃ ┣ 📜 live.js                  # YouTube RSS feed parser
 ┃ ┣ 📜 projects.js              # Projects CRUD endpoint
 ┃ ┣ 📜 sitemap.js               # Dynamic XML sitemap generator
 ┃ ┣ 📜 timeline.js              # Timeline milestones endpoint
 ┃ ┗ 📜 upload-image.js          # CDN image upload proxy
 ┣ 📂 public                     # Static assets (served as-is)
 ┃ ┣ 📂 assets/docs              # Portfolio PDF documents
 ┃ ┣ 📂 assets/images            # Static image files
 ┃ ┣ 📜 robots.txt               # Crawl directives
 ┃ ┗ 📜 sitemap.xml              # XML sitemap
 ┣ 📂 src
 ┃ ┣ 📂 components               # Reusable UI components
 ┃ ┃ ┣ 📜 Footer.tsx             # Global footer with legal links
 ┃ ┃ ┣ 📜 Header.tsx             # Responsive navigation header
 ┃ ┃ ┣ 📜 JourneyMarquee.tsx     # GPU-accelerated timeline marquee
 ┃ ┃ ┣ 📜 Layout.tsx             # Page layout wrapper (skips for embeds)
 ┃ ┃ ┣ 📜 LoadingScreen.tsx      # Cinematic intro loading screen
 ┃ ┃ ┣ 📜 ScrollToTop.tsx        # Scroll-to-top floating button
 ┃ ┃ ┣ 📜 SEO.tsx                # JSON-LD + OpenGraph meta manager
 ┃ ┃ ┣ 📜 SocialProof.tsx        # Social proof / testimonials component
 ┃ ┃ ┣ 📜 StatusWidget.tsx       # Floating live-status popup widget
 ┃ ┃ ┗ 📜 TechGalaxy.tsx         # Animated tech stack visual
 ┃ ┣ 📂 context
 ┃ ┃ ┗ 📜 LanguageContext.tsx    # 12-language i18n context provider
 ┃ ┣ 📂 data                     # Static typed data models
 ┃ ┃ ┣ 📜 faqData.ts             # FAQ questions and answers
 ┃ ┃ ┣ 📜 linksData.ts           # Link hub node definitions
 ┃ ┃ ┣ 📜 projectsData.ts        # Project cards and detail data
 ┃ ┃ ┗ 📜 timelineData.ts        # Life milestone timeline data
 ┃ ┣ 📂 pages                    # Route-level page components
 ┃ ┃ ┣ 📜 About.tsx              # About / philosophy page
 ┃ ┃ ┣ 📜 AllUsers.tsx           # Community user listing (/user)
 ┃ ┃ ┣ 📜 CommentGuide.tsx       # Step-by-step comment instructions (/journal/comment)
 ┃ ┃ ┣ 📜 CommentPermalink.tsx   # Standalone comment permalink view
 ┃ ┃ ┣ 📜 Contact.tsx            # Smart contact routing page
 ┃ ┃ ┣ 📜 Copyright.tsx          # Copyright information
 ┃ ┃ ┣ 📜 Dashboard.tsx          # Owner-only CMS dashboard
 ┃ ┃ ┣ 📜 DMCA.tsx               # DMCA takedown policy
 ┃ ┃ ┣ 📜 FAQ.tsx                # Searchable FAQ with accordion
 ┃ ┃ ┣ 📜 Home.tsx               # Hero / landing page
 ┃ ┃ ┣ 📜 Journal.tsx            # Journal listing page
 ┃ ┃ ┣ 📜 JournalAllComments.tsx # Full comment thread for a post (/journal/view/:id/comments)
 ┃ ┃ ┣ 📜 JournalEmbed.tsx       # Embeddable journal (no chrome)
 ┃ ┃ ┣ 📜 JournalView.tsx        # Full journal detail page
 ┃ ┃ ┣ 📜 LegalHub.tsx           # Legal hub index
 ┃ ┃ ┣ 📜 Links.tsx              # Link-in-bio hub
 ┃ ┃ ┣ 📜 Live.tsx               # YouTube Live & video hub
 ┃ ┃ ┣ 📜 Me.tsx                 # Personal / creative profile
 ┃ ┃ ┣ 📜 NotFound.tsx           # 404 fallback page
 ┃ ┃ ┣ 📜 Now.tsx                # "What I'm doing now" page
 ┃ ┃ ┣ 📜 Portfolio.tsx          # 3D PDF portfolio viewer
 ┃ ┃ ┣ 📜 Privacy.tsx            # Privacy policy
 ┃ ┃ ┣ 📜 Projects.tsx           # Projects listing
 ┃ ┃ ┣ 📜 ProjectDetail.tsx      # Individual project deep-dive
 ┃ ┃ ┣ 📜 Proof.tsx              # Proof of work page
 ┃ ┃ ┣ 📜 SearchResults.tsx      # Global search results page
 ┃ ┃ ┣ 📜 Status.tsx             # Real-time system status & server health
 ┃ ┃ ┣ 📜 Terms.tsx              # Terms of service
 ┃ ┃ ┗ 📜 UserProfile.tsx        # Public user profile with heatmap & social links (/user/:userId)
 ┃ ┣ 📜 App.tsx                  # Root router + animated routes
 ┃ ┣ 📜 index.css                # Global CSS + Tailwind directives
 ┃ ┗ 📜 main.tsx                 # React application entry point
 ┣ 📂 .github
 ┃ ┣ 📂 ISSUE_TEMPLATE           # Structured GitHub issue templates
 ┃ ┃ ┣ 📜 bug_report.yml         # Bug report form
 ┃ ┃ ┣ 📜 feature_request.yml    # Feature request form
 ┃ ┃ ┣ 📜 documentation.yml      # Documentation improvement form
 ┃ ┃ ┣ 📜 question.yml           # Question / discussion form
 ┃ ┃ ┗ 📜 config.yml             # Issue template chooser + contact links
 ┃ ┣ 📂 workflows
 ┃ ┃ ┗ 📜 ci.yml                 # GitHub Actions CI (type-check + build)
 ┃ ┣ 📜 CODEOWNERS               # Code ownership declarations
 ┃ ┣ 📜 FUNDING.yml              # Sponsorship links
 ┃ ┣ 📜 dependabot.yml           # Automated dependency updates
 ┃ ┗ 📜 pull_request_template.md # Standardized PR template
 ┗ 📂 dist                       # Production build output (git-ignored)

🧭 Routes Reference

Route	Description
`/`	Hero landing page with timeline, journal spotlight, community section, and CTA
`/about`	Background, philosophy, and approach
`/me`	Personal creative profile and current status
`/now`	What I'm working on right now
`/projects`	Full project listing grid
`/projects/:id`	Individual project deep-dive detail
`/portfolio`	3D PDF architectural blueprint viewer
`/proof`	Proof of work and achievements
`/links`	Link-in-bio ecosystem hub (30+ nodes)
`/contact`	Smart 15-category contact routing form
`/journal`	Journal listing with metadata (likes, views, read time)
`/journal/view/:id`	Full journal article with engagement actions
`/journal/view/:id/comments`	Full paginated comment thread for a post
`/journal/view/:id/comment/:commentId`	Standalone comment permalink
`/journal/comment`	Step-by-step guide for commenting and community rules
`/journal/embed/:id`	Embeddable iframe view (no header/footer)
`/user`	Community user listing — owner pinned at top, contributors below
`/user/:userId`	Public user profile with bio, social links, contribution heatmap, and activity tabs
`/live`	YouTube live stream + All/Stream/Video/Shorts hub
`/search`	Full-stack global search with trending queries and easter eggs
`/status`	Real-time API status, server health, and system specifications
`/faq`	Searchable FAQ with accordion interface
`/dashboard`	Owner-only content management dashboard
`/legal`	Legal hub index
`/privacy`	Privacy policy
`/terms`	Terms of service
`/dmca`	DMCA takedown policy
`/copyright`	Copyright information

📋 Changelog

See CHANGELOG.md for a full version history and release notes.

🚀 Local Development

Prerequisites

Node.js ≥ 18.x
npm ≥ 9.x

Setup

# 1. Clone the repository
git clone https://github.com/deepdeyiitgn/My-Portfolio.git
cd My-Portfolio

# 2. Install dependencies
npm install

# 3. Start the development server
npm run dev

Available Scripts

Script	Command	Description
`dev`	`vite`	Start local dev server with HMR
`build`	`vite build`	Production build to `./dist`
`preview`	`vite preview`	Preview production build locally
`lint`	`tsc --noEmit`	TypeScript type-check (no emit)

Environment Variables

Set the following in your Vercel project settings (or a .env.local for local development — never commit this file):

# MongoDB connection string for Journal + Category storage
MONGODB_URI=mongodb+srv://<user>:<password>@cluster.mongodb.net/portfolio

# CDN upload password for the static.qlynk.me proxy
SPACE_PASSWORD=your_space_password_here

Note: The app runs in read-only mode without these variables. Journal CRUD and image upload require valid credentials.

🔐 Security

Security issues must not be reported via public GitHub issues. See SECURITY.md for the full responsible disclosure policy and response timeline.

Email a@qlynk.me or team.deepdey@gmail.com
Subject: [SECURITY REPORT] <Brief Description>
Critical patches deployed within 24 hours of triage

🤝 Contributing

Contributions are welcome! Please read CONTRIBUTING.md before opening a pull request.

Quick rules:

Fork → branch → PR (small, focused changes only)
Run npm run lint and npm run build before submitting
Maintain visual consistency with the Dark-Amber design system
No secrets or private credentials in any commit

⏸️ Academic Hiatus Notice

Effective: April 9, 2026

All major external software projects (DEQLYNK, QuickLink, Transparent Clock) are on strict hiatus. Bandwidth is 100% reallocated to JEE Advanced 2027 preparation targeting IIT KGP CSE. Routine feature updates resume post-examination.

Bug fixes, security patches, and documentation improvements remain active.

This repository is published under a Custom Restricted (View-Only) License. See LICENSE for full terms.

For collaboration or architectural consultation, use the Contact Hub.

Name		Name	Last commit message	Last commit date
Latest commit History 193 Commits
.github		.github
api		api
dist		dist
public		public
src		src
.env.example		.env.example
.gitignore		.gitignore
CHANGELOG.md		CHANGELOG.md
CODE_OF_CONDUCT.md		CODE_OF_CONDUCT.md
CONTRIBUTING.md		CONTRIBUTING.md
CONTRIBUTOR.md		CONTRIBUTOR.md
LICENSE		LICENSE
README.md		README.md
SECURITY.md		SECURITY.md
SUPPORT.md		SUPPORT.md
index.html		index.html
metadata.json		metadata.json
package-lock.json		package-lock.json
package.json		package.json
tailwind.config.js		tailwind.config.js
tsconfig.json		tsconfig.json
vercel.json		vercel.json
vite.config.ts		vite.config.ts

Folders and files

Latest commit

History

Repository files navigation

🌌 Deep Dey — Portfolio & System Architecture

📖 Overview

🎯 Feature Highlights

🔭 Global Command Palette Search

📡 Real-Time System Status Monitor

🎬 Cinematic Loading Engine

🎞️ Kinetic 3D PDF Portfolio Viewer

📬 Smart Contact Routing Matrix

📓 Journal CMS with Embed Support

📺 YouTube Live Hub

🖼️ CDN Image Upload & Media CMS (Dashboard)

🌐 Data-Driven Link-in-Bio Engine

⏱️ Self-Aware Timeline

🔍 Max-Level SEO

🌍 12-Language i18n

💬 Journal Comment System

👥 Community User Profiles

🗺️ Dynamic XML Sitemap with RAM Cache

🚀 Key Features of New Dashboard

🛠️ Technology Stack

📂 Project Structure

🧭 Routes Reference

📋 Changelog

🚀 Local Development

Prerequisites

Setup

Available Scripts

Environment Variables

🔐 Security

🤝 Contributing

⏸️ Academic Hiatus Notice

©️ License & Copyright

About

Topics

Resources

License

Code of conduct

Contributing

Security policy

Uh oh!

Stars

Watchers

Forks

Releases

Contributors

Uh oh!

Languages