🚀 Next-Gen Full-Stack Developer Portfolio

A production-ready, full-stack personal portfolio and headless CMS — built entirely from scratch. No WordPress. No templates. Just pure code.

---

🆕 Recent Updates (March 2026)

• Added admin-managed Home Media controls: upload profile photo (Cloudinary), upload intro video, and toggle video visibility.
• Added Blog cover image upload support from admin, with rendering on blog list and blog detail pages.
• Enabled Skills icon rendering on home page using React Icons names (Fa*/Si*) or direct image URLs.
• Added daily message digest email and instant security log alert emails.
• Added admin Forgot Password flow with secure reset key validation.
• Upgraded Skills Manager: choosing Other now reveals a required details textarea.
• Fixed public Projects page loading issue caused by API response shape mismatch.
• Simplified Projects discovery UX: removed text search and kept focused filters by Tech Stack and Language.
• Expanded Home page with featured projects, latest writing, capabilities section, and stronger portfolio storytelling.
• Applied a full visual refresh with a new global color language, glass-surface cards, and updated shared components.
• Resume/Drive CV links are handled as external links and always open in a new browser tab.

---

🌟 What is this?

This is not just a static portfolio. It is a complete full-stack web application split into two main parts:

Part	Tech	Description
portfolio-frontend	Next.js 16 + React 19	A blazing-fast UI with an interactive hacker-mode terminal, custom cursor, magnetic buttons, and a hidden admin panel
portfolio-api	Node.js + Express	A secure REST API server with JWT auth, MongoDB storage, Cloudinary image hosting, and layered security middleware

---

🏗️ System Architecture & Internal Workflow

This application uses a modern decoupled architecture. The frontend and backend run as separate entities but communicate securely.

To protect the server from being exposed to the public internet, the Next.js frontend acts as a Reverse Proxy via next.config.mjs. All /api/* traffic is silently forwarded to the Express backend — the real server URL is never visible to the browser.

Data Flow Diagram

sequenceDiagram
    participant User as 💻 User (Browser)
    participant NextJS as 🌐 Next.js (Frontend)
    participant NextProxy as 🛡️ API Proxy (next.config.mjs)
    participant Express as ⚙️ Express (Backend API)
    participant DB as 🗄️ MongoDB / Cloudinary

    User->>NextJS: 1. Visits Portfolio / Clicks a Project
    NextJS->>NextProxy: 2. Fetches Data (/api/projects)
    Note over NextProxy: Real backend URL stays hidden
    NextProxy->>Express: 3. Forwards Request (http://localhost:5000)
    Express->>DB: 4. Queries Database / Storage
    DB-->>Express: 5. Returns Data / Image URL
    Express-->>NextProxy: 6. Sends JSON Response
    NextProxy-->>NextJS: 7. Relays to Frontend
    NextJS-->>User: 8. Renders UI

Loading

---

📂 Project Structure

📦 portfolio-2.0/
 ┣ 📂 portfolio-frontend/           👉 Next.js UI Application
 ┃  ┣ 📂 src/
 ┃  ┃  ┣ 📂 app/                    👉 Next.js App Router pages
 ┃  ┃  ┃  ┣ 📄 page.js              👉 Home — hero, skills matrix, education timeline
 ┃  ┃  ┃  ┣ 📄 layout.js            👉 Root layout (CustomCursor, HackerMode, Footer)
 ┃  ┃  ┃  ┣ 📂 projects/            👉 /projects — filterable project showcase
 ┃  ┃  ┃  ┣ 📂 blogs/               👉 /blogs — article listing
 ┃  ┃  ┃  ┃  ┗ 📂 [slug]/           👉 /blogs/:slug — individual blog post
 ┃  ┃  ┃  ┣ 📂 contact/             👉 /contact — guest message form
 ┃  ┃  ┃  ┣ 📂 diary/               👉 /diary — private diary entries
 ┃  ┃  ┃  ┗ 📂 admin/               👉 /admin — login gate
 ┃  ┃  ┃     ┗ 📂 dashboard/        👉 /admin/dashboard — full CMS
 ┃  ┃  ┗ 📂 components/
 ┃  ┃     ┣ 📄 navbar.js            👉 Top navigation bar
 ┃  ┃     ┣ 📄 Footer.js            👉 Site footer
 ┃  ┃     ┣ 📄 HackerMode.js        👉 Ctrl+\ terminal overlay
 ┃  ┃     ┣ 📄 CustomCursor.js      👉 Custom animated cursor
 ┃  ┃     ┣ 📄 MagneticButton.js    👉 Magnetic hover-effect button
 ┃  ┃     ┗ 📂 admin/               👉 CMS panel components
 ┃  ┃        ┣ 📄 BlogManager.js
 ┃  ┃        ┣ 📄 DiaryManager.js
 ┃  ┃        ┣ 📄 EducationManager.js
 ┃  ┃        ┣ 📄 MessageManager.js
 ┃  ┃        ┣ 📄 ProjectManager.js
 ┃  ┃        ┣ 📄 SecurityManager.js
 ┃  ┃        ┣ 📄 SettingsManager.js
 ┃  ┃        ┗ 📄 SkillManager.js
 ┃  ┣ 📜 next.config.mjs            👉 Reverse proxy rewrite rules
 ┃  ┗ 📜 .env                       👉 Frontend env variables (gitignored)
 ┃
 ┗ 📂 portfolio-api/                👉 Node.js / Express Backend
    ┣ 📂 config/                    👉 DB (Mongoose) & Cloudinary setup
    ┣ 📂 controllers/               👉 Business logic per resource
    ┣ 📂 middleware/
    ┃  ┣ 📄 authMiddleware.js        👉 JWT verification guard
    ┃  ┗ 📄 honeypot.js             👉 Bot trap & IP logger
    ┣ 📂 models/                    👉 Mongoose schemas
    ┃  ┣ 📄 Admin.js
    ┃  ┣ 📄 Blog.js
    ┃  ┣ 📄 Diary.js
    ┃  ┣ 📄 Education.js
    ┃  ┣ 📄 Message.js
    ┃  ┣ 📄 Project.js
    ┃  ┣ 📄 SecurityLog.js
    ┃  ┣ 📄 Setting.js
    ┃  ┗ 📄 Skill.js
    ┣ 📂 routes/                    👉 Express route definitions
    ┣ 📄 seedAdmin.js               👉 One-time admin account seeder
    ┗ 📄 server.js                  👉 App entry point & security middleware stack

---

🛡️ Core Features & Innovations

1. Built-in Admin CMS Dashboard

Accessible at /admin — protected behind JWT authentication. Once logged in, you get full CRUD control over every piece of content via dedicated manager panels:

Manager	What you can control
ProjectManager	Add / edit / delete portfolio projects with images, tech stack tags, GitHub & live links
BlogManager	Write Markdown blogs with AI-generated 3-point summaries, tags, read-time, and cover image uploads
DiaryManager	Create private diary entries (visibility-toggled)
EducationManager	Manage education timeline entries
SkillManager	Add skills with proficiency percentages and optional custom details for Other category
MessageManager	Read contact messages sent by visitors
SecurityManager	View the honeypot security log — trapped IPs & attempted endpoints
SettingsManager	Edit hero text, primary accent color, social links, resume URL, hiring status, profile image, and home video visibility

2. Advanced Security — The Honeypot 🍯

A custom honeypot.js middleware silently guards the server from automated scanners:

• Trap routes monitored: /wp-admin, /.env, /admin.php, /config.json, /db-backup.zip
• On hit: The attacker's IP, the attempted endpoint, and any request payload are saved to the SecurityLog collection in MongoDB, and a 403 response is returned.
• Logs are viewable in real time from the SecurityManager panel inside the admin dashboard.

3. Layered Security Middleware Stack

The Express server (server.js) applies 10 security layers before any route handler runs:

#	Middleware	Protection
1	helmet	Secure HTTP headers (XSS, clickjacking, MIME sniffing, etc.)
2	cors	Strict allow-list — only your frontend origins can call the API
3	express.json({ limit: '10kb' })	Payload size cap — prevents oversized body attacks
4	express-mongo-sanitize	Strips $ operators — blocks NoSQL injection
5	xss-clean	Sanitises HTML in input — blocks Cross-Site Scripting
6	hpp	Strips duplicate query params — blocks HTTP Parameter Pollution
7	Global rate limiter	20 requests / 15 min per IP across all /api/ routes
8	Contact rate limiter	5 messages / hour per IP on /api/messages
9	Auth rate limiter	10 login attempts / 15 min per IP on /api/auth
10	Custom Honeypot	Traps & logs bots scanning for known vulnerability paths

4. Reverse Proxy & URL Obfuscation

next.config.mjs rewrites every /api/* request to the Express server at INTERNAL_BACKEND_URL. The real backend address is never exposed to the browser.

5. Immersive UI — Hacker Mode Terminal

Press Ctrl + \ anywhere on the site to open a full Linux-style terminal overlay (HackerMode.js). Supported commands:

help            Show available commands
ls              List virtual directories (projects/, skills/, education/)
cat <dir>       Fetch live data from the API and print it
sudo login      Redirect to the /admin login portal
game / hack     Launch an in-terminal cybersecurity mini-game
clear           Clear terminal output
exit            Close the terminal

6. Additional UI Highlights

• Custom Cursor (CustomCursor.js) — replaces the default browser cursor with a styled animated dot.
• Magnetic Buttons (MagneticButton.js) — interactive Framer Motion buttons that follow the cursor on hover.
• Skills Matrix — live-fetched proficiency bars rendered on the home page.
• Skills Icons — rendered from React Icons names (Fa*/Si*) or direct image URLs stored in admin.
• Education Timeline — chronological timeline built from the Education collection.
• Blog Posts — Markdown-rendered articles with slug-based routing (/blogs/:slug), tags, read time, AI-generated TL;DR summaries, and cover images.
• Project Cards — filterable by tech stack and language, grayscale-to-color image reveal on hover, and links to GitHub / live demo.
• Home Experience — richer hero storytelling, project and skill highlights, admin-managed profile image, optional intro video, and explicit public notice of the private admin portal.

---

🧰 Tech Stack

Frontend

Technology	Version	Role
Next.js	16.2.1	Framework — App Router, SSR, API rewrites
React	19.2.4	UI library
React Icons	^5.6	Skill icon rendering from icon names
Tailwind CSS	v4	Utility-first styling
Framer Motion	v12	Animations & magnetic button interactions

Backend

Technology	Version	Role
Node.js	v18+	Runtime environment
Express	^4.22	REST API framework
Mongoose	^9.3	MongoDB ODM
bcrypt	^6.0	Password hashing
jsonwebtoken	^9.0	JWT authentication
Cloudinary	^1.41	Image upload & hosting
Multer + multer-storage-cloudinary	^2.1	Multipart file handling
Helmet	^8.1	Secure HTTP headers
express-rate-limit	^8.3	API rate limiting
express-mongo-sanitize	^2.2	NoSQL injection prevention
xss-clean	^0.1	XSS input sanitisation
hpp	^0.2	HTTP Parameter Pollution prevention
express-validator	^7.3	Input validation
nodemailer	^8.0	SMTP mail delivery (digest + alerts)
node-cron	^4.2	Daily scheduler for message digest
dotenv	^17.3	Environment variable loading
cors	^2.8	Cross-Origin Resource Sharing

---

Skills Icon Name Reference (Admin)

In the Skills Manager, the Icon field stores a string value (example: FaReact) or a direct image URL.

Current behavior:

• Icon values are saved in the database.
• Public skills cards render icons from React Icons names or image URLs.
• This reference helps you enter consistent icon names now, so you can render them later without cleanup.

Common icon names for technologies and tools

Use these names in the Icon field.

Frontend

• FaReact
• SiNextdotjs
• SiJavascript
• SiTypescript
• SiHtml5
• SiCss3
• SiTailwindcss
• SiRedux
• SiFramer
• SiVite

Backend

• FaNodeJs
• SiExpress
• SiNestjs
• SiDjango
• SiFlask
• FaJava
• SiSpring
• SiDotnet
• SiGraphql
• SiSocketdotio

Database

• SiMongodb
• SiPostgresql
• SiMysql
• SiRedis
• SiFirebase
• SiSupabase
• SiSqlite
• SiPrisma
• SiMongoose

Cloud and DevOps

• FaDocker
• SiKubernetes
• FaAws
• SiGooglecloud
• SiVercel
• SiNetlify
• SiRender
• SiGithubactions
• SiNginx
• SiCloudinary

Tools

• FaGitAlt
• FaGithub
• SiPostman
• SiInsomnia
• SiJest
• SiCypress
• SiWebpack
• SiBabel
• SiEslint
• SiPrettier
• SiFigma
• SiNotion
• SiSlack
• SiLinux

How to find icon names in future

1. Open the React Icons website:

• https://react-icons.github.io/react-icons/

2. Search your technology name (example: Docker, PostgreSQL, Tailwind).
3. Copy the exact component name shown by the website (example: FaDocker, SiPostgresql).
4. Paste that exact name into Admin -> Skills -> Icon field.

Notes:

• Prefix guide: Fa = Font Awesome, Si = Simple Icons, Io = Ionicons, Tb = Tabler, etc.
• Names are case-sensitive.
• If you cannot find a good icon, you can paste a direct image URL instead.
• If multiple icons exist, prefer the official brand icon from the Si set.

Optional quick validation workflow (before saving many skills)

1. Pick one skill.
2. Enter icon name from React Icons.
3. Save and verify in admin data.
4. Repeat for other skills.

If you want, I can also add a live icon preview in the Skills Manager so you can test icon names instantly while typing.

---

📘 Easy Full-App Explanation (Beginner Friendly)

This section explains the whole app in simple language, from user click to database response.

Is there an ARCHITECTURE.md file?

No separate ARCHITECTURE.md file is currently used.

All architecture and internal behavior documentation is maintained in this README.md (this section + deep-dive section below), so you can find everything in one place.

What this app actually is

Think of this project as two apps working together:

1. Frontend app (portfolio-frontend): what users see in the browser.
2. Backend app (portfolio-api): where data, auth, security checks, and business logic run.

Simple request flow (one example)

When someone opens Projects page:

1. Browser asks frontend page to load.
2. Frontend requests project data from API endpoint.
3. Backend receives request and runs security middleware first.
4. Backend controller reads projects from MongoDB.
5. JSON response goes back to frontend.
6. Frontend renders cards on screen.

How admin panel works (simple)

1. Admin logs in with username/password.
2. Backend verifies credentials and issues secure auth token cookie.
3. Admin dashboard loads manager components (projects/blogs/skills/etc.).
4. Each manager can create, edit, delete records via protected API routes.

How contact and security work

Contact form is protected by multiple layers:

1. Honeypot bot trap field.
2. Captcha verification.
3. Rate limiting.
4. Input validation and sanitization.
5. Security event logging.

If suspicious activity is detected, security log entries are created and alert flows can notify admin.

How media upload works

1. Admin selects image/video in dashboard.
2. File is uploaded through backend upload route.
3. Backend stores file in Cloudinary.
4. Cloudinary URL is saved in MongoDB.
5. Frontend uses stored URL for rendering.

Security-safe documentation note

This README intentionally explains architecture and security strategy but does not include real secrets.

Never place real values for:

1. JWT secret
2. DB credentials
3. SMTP password
4. reset/admin private keys

Use .env placeholders only.

---

🔬 Deep-Dive Documentation (Component-by-Component)

This section is intentionally detailed so you can understand exactly how each part behaves, how data moves, and where security is enforced.

1. End-to-End Runtime Flow

When a user opens a page:

1. Next.js renders the route (server or client side depending on page).
2. UI components call API endpoints (through /api/* path from browser).
3. Next.js rewrites/proxies those requests to Express backend.
4. Express middleware stack executes first (security, parsers, sanitizers, rate limits, honeypot).
5. Route handler runs controller logic.
6. Controller reads/writes MongoDB through Mongoose models.
7. Response comes back as JSON and components render data.

Important: security controls are not in one place only. They are distributed in middleware, controllers, model hooks, validators, and route-level protections.

---

2. Frontend Internals (How each major piece works)

2.1 App Router pages

• src/app/page.js (Home):

  • Fetches settings, skills, education, projects, blogs.
  • Builds hero section, feature cards, skill matrix, and education timeline.
  • Uses server-side fetching for fast first render.

• src/app/projects/page.js:

  • Fetches project list.
  • Supports filter by tech stack and language.
  • Splits output into ongoing and completed groups using project.status first and fallback logic if old records exist.

• src/app/blogs/page.js:

  • Lists blogs with card metadata and tags.
  • Includes social share actions (X, LinkedIn, WhatsApp, Facebook) and copy-link with visible feedback state.

• src/app/blogs/[slug]/page.js:

  • Fetches one blog by slug.
  • Renders markdown using react-markdown + remark-gfm.
  • Provides GitHub-style content styling and share actions.
  • Shows AI Summary block if present.

• src/app/contact/page.js:

  • Handles visitor message submission.
  • Requests captcha payload first, then posts message + captcha verification fields.
  • Works with honeypot protection and backend validation.

• src/app/diary/page.js:

  • Shows diary entries with timeline/date-time format.

• src/app/admin/*:

  • Admin login and dashboard.
  • Dashboard loads manager modules for all content collections.

2.2 Shared UI components

• navbar.js and Footer.js:

  • Fetch settings to show dynamic status/social links/colors.
  • Includes robust API URL normalization to avoid wrong endpoint shape.

• HackerMode.js:

  • Terminal-like command overlay.
  • Provides interactive command simulation and admin shortcut.

• CustomCursor.js:

  • Custom pointer effect for stronger visual identity.

• MagneticButton.js:

  • Motion-based hover attraction effect for CTA elements.

2.3 Admin manager components

Each manager implements a similar pattern:

1. Fetch list on mount.
2. Provide form state for create/edit.
3. On submit, call POST for create or PUT for update.
4. Use credentials: include on protected routes.
5. Refresh list after changes.

Manager-specific responsibilities:

• ProjectManager: ordering, visibility, status (ongoing/completed), image upload, tech parsing.
• BlogManager: markdown content, tags, slug, read-time, cover image.
• DiaryManager: dev logs with status and visibility.
• EducationManager: timeline + extended metadata fields.
• SkillManager: percentage/category/details/icon.
• SettingsManager: site text/colors/social/profile media/home video.
• MessageManager: inbox viewer for contact messages.
• SecurityManager: security event log viewer.

---

3. Backend Internals (Route -> Controller -> Model)

3.1 Route architecture

Routes in portfolio-api/routes are thin and map endpoints to controller functions. Protected mutations (POST/PUT/DELETE) are guarded by protect middleware where needed.

3.2 Controller responsibilities

• authController: login/logout/session check + forgot/reset password operations.
• projectController: public/admin project read and admin CRUD with normalized status + custom ordering.
• blogController: blog CRUD and slug-based fetch.
• diaryController: diary CRUD.
• educationController: education CRUD.
• skillController: skills CRUD.
• settingController: singleton-style site settings document read/update.
• messageController: contact intake, captcha endpoint/verification, logging and message persistence.
• securityController: read security logs.

Controllers do business rules and response shaping. Models define schema constraints and data lifecycle hooks.

3.3 Data model summary

• Admin: credentials and auth-related fields.
• Project: title/description/status/order/visibility/tech links/media.
• Blog: markdown content, slug, tags, cover image, aiSummary, publish state.
• Diary: timeline entries and visibility.
• Education: institution, degree, dates + extra metadata (location, specialization, boardOrUniversity, score, activities).
• Skill: name/category/percentage/icon/details.
• Setting: global site-level configurable values.
• Message: contact submissions.
• SecurityLog: detected suspicious actions/events.

---

4. Security Architecture (Detailed)

Security is intentionally layered so one bypass does not compromise the entire app.

4.1 Request hardening chain

Before controller logic, Express applies:

1. Header hardening with helmet.
2. CORS allow-list checks.
3. JSON body size limits.
4. NoSQL injection sanitization.
5. XSS cleaning.
6. HTTP parameter pollution mitigation.
7. Global rate limiter.
8. Route-specific limiters for auth/messages/captcha-sensitive flows.
9. Honeypot detection for suspicious scanner routes.

4.2 Authentication security

• Admin login uses hashed password verification.
• Protected routes require auth middleware.
• Session/token validation occurs before protected controller execution.
• Auth rate limits reduce brute-force risk.

4.3 Contact form security

• Honeypot field traps bot submissions.
• Captcha verification includes expiry and anti-replay behavior.
• Input validation + escaping runs server-side.
• Message submission rate limiting prevents abuse/spam bursts.

4.4 Security logging + alerting

• Security events are written to SecurityLog.
• Alert emails can be triggered for critical/suspicious events.
• Daily digest summarizes contact events.
• Security manager in admin provides visibility for incident review.

4.5 Operational safety notes

• Never commit .env files.
• Use strong JWT_SECRET and rotate if exposed.
• Use app passwords for SMTP providers.
• Restrict allowed CORS origins to your frontend domain.
• Run backend behind HTTPS in production.

---

5. How key complex features work internally

5.1 Project status + ordering

• status is stored as ongoing or completed.
• order determines rendered sequence.
• Admin can reorder items and set status explicitly.
• Public projects page uses status-first grouping with backward-compatible fallback for old records.

5.2 Blog markdown rendering

• Blog content is stored as raw markdown in DB.
• Detail page renders markdown using react-markdown with remark-gfm.
• Custom render components style headings, tables, code blocks, links, lists, and blockquotes.

5.3 Social sharing

• Share links are generated per blog URL.
• Each platform uses its official URL-based share endpoint.
• Copy-link action uses clipboard API and temporary UI confirmation.

5.4 Media upload flow

1. Admin selects file in manager form.
2. Frontend uploads file to upload endpoint as FormData.
3. Backend uploads to Cloudinary.
4. Cloudinary URL is returned.
5. URL is saved in relevant document (project/blog/settings).

---

6. Debugging playbook for common issues

• Status not changing:

  • Confirm backend restarted after controller/model changes.
  • Verify admin PUT /api/projects/:id payload includes status.

• Settings not loading in navbar/footer:

  • Verify NEXT_PUBLIC_API_URL shape (/api vs full host).
  • Confirm settings endpoint returns JSON, not HTML.

• Email not delivered:

  • Verify SMTP env values and app password.
  • Check backend logs for transporter/auth/network errors.

• Share links not opening:

  • Ensure direct anchor-based share links are used.
  • Confirm window.location.origin or site URL resolves correctly.

---

7. Security-first mental model to remember

When you modify this project, always think in this order:

1. Input safety (validation/sanitization).
2. Access control (is this route protected?).
3. Abuse control (rate limit/honeypot/captcha).
4. Data integrity (schema validation/defaults).
5. Audit visibility (security logs/alerts).
6. User feedback (clear but non-sensitive errors).

If you follow this order, you can add features without weakening the system.

---

🚀 How to Run the Project Locally

Prerequisites

• Node.js v18 or higher
• A MongoDB URI (local or MongoDB Atlas)
• A Cloudinary account for image hosting

Step 1 — Clone & Install

Open two terminal windows — one for the backend, one for the frontend.

Terminal 1 — Backend:

cd portfolio-api
npm install

Terminal 2 — Frontend:

cd portfolio-frontend
npm install

Step 2 — Configure Environment Variables

portfolio-api/.env

PORT=5000
MONGO_URI=your_mongodb_connection_string
JWT_SECRET=your_super_secret_key
ADMIN_RESET_KEY=your_private_admin_reset_key
CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_API_KEY=your_api_key
CLOUDINARY_API_SECRET=your_api_secret
FRONTEND_URL=http://localhost:3000

# Alert destination email
ALERT_EMAIL_TO=your_alert_email@example.com

# SMTP settings (example shown for Gmail)
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_SECURE=false
SMTP_USER=your_gmail_address@gmail.com
SMTP_PASS=your_gmail_app_password
SMTP_FROM=your_gmail_address@gmail.com

# SMTP network reliability options (recommended for servers with IPv6 issues)
SMTP_FORCE_IPV4=true
SMTP_DNS_RESULT_ORDER=ipv4first
SMTP_CONNECTION_TIMEOUT_MS=20000
SMTP_GREETING_TIMEOUT_MS=15000
SMTP_SOCKET_TIMEOUT_MS=30000

# Daily message digest schedule (11:55 PM every day, before 12:00 AM)
DAILY_MESSAGE_DIGEST_CRON=55 23 * * *
DAILY_MESSAGE_DIGEST_TIMEZONE=Asia/Kolkata

portfolio-frontend/.env

# Internal URL the Next.js server uses to call the backend directly
INTERNAL_BACKEND_URL=http://localhost:5000

# Public base path used by client-side fetches (triggers the proxy)
NEXT_PUBLIC_API_URL=/api

Step 2.1 — Enable Mail Alerts (Important)

Follow this once to make sure daily digest + instant security emails work:

1. Use a real SMTP account in portfolio-api/.env.
2. If you use Gmail, enable 2-Step Verification.
3. Generate a Gmail App Password and use it as SMTP_PASS.
4. Keep ALERT_EMAIL_TO=narayanpaulnitdgp@gmail.com.
5. Restart backend after env updates.

What gets emailed:

• Daily digest before midnight if new contact messages arrived that day.
• Instant alert whenever a new security log is created.

Step 2.2 — Cron Value Guide

DAILY_MESSAGE_DIGEST_CRON uses 5 fields:

minute hour day-of-month month day-of-week

Examples:

• 55 23 * * * → Every day at 11:55 PM
• 50 23 * * * → Every day at 11:50 PM
• 0 0 * * * → Every day at 12:00 AM

Recommended value for your requirement (before 12:00 AM):

DAILY_MESSAGE_DIGEST_CRON=55 23 * * *

Timezone is controlled by:

DAILY_MESSAGE_DIGEST_TIMEZONE=Asia/Kolkata

Step 3 — Seed the Admin Account (First Run Only)

cd portfolio-api
node seedAdmin.js

This creates the initial admin user in MongoDB.

Step 4 — Start the Servers

Start the Backend:

cd portfolio-api
node server.js
# Expected: "Secure Server locked and loaded on port 5000"

Start the Frontend:

cd portfolio-frontend
npm run dev
# Expected: "ready on http://localhost:3000"

🎉 Open http://localhost:3000 in your browser. To access the admin dashboard, navigate to /admin or press Ctrl + \ and type sudo login.

---

📖 API Endpoints Reference

All endpoints are prefixed with /api — via the Next.js proxy, or directly on port 5000. 🔒 = Requires Authorization: Bearer <token> header.

Authentication

Method	Endpoint	Description
POST	/api/auth/login	Authenticate admin and set secure session cookie
POST	/api/auth/logout	Clear secure admin session cookie
GET	/api/auth/session	🔒 Verify active admin session
POST	/api/auth/forgot-password/request-token	Request one-time reset token using username + server reset key
POST	/api/auth/forgot-password/reset	Reset password using username + one-time token + new password

Projects

Method	Endpoint	Description
GET	/api/projects	Fetch all visible projects
POST	/api/projects	🔒 Create a new project
PUT	/api/projects/:id	🔒 Update a project
DELETE	/api/projects/:id	🔒 Delete a project

Blogs

Method	Endpoint	Description
GET	/api/blogs	Fetch all published blogs
GET	/api/blogs/:slug	Fetch a single blog by slug
POST	/api/blogs	🔒 Create a blog post
PUT	/api/blogs/:id	🔒 Update a blog post
DELETE	/api/blogs/:id	🔒 Delete a blog post

Diary

Method	Endpoint	Description
GET	/api/diary	🔒 Fetch all diary entries
POST	/api/diary	🔒 Create a diary entry
PUT	/api/diary/:id	🔒 Update a diary entry
DELETE	/api/diary/:id	🔒 Delete a diary entry

Messages (Contact Form)

Method	Endpoint	Description
POST	/api/messages	Submit a contact message (rate-limited: 5/hr)
GET	/api/messages	🔒 Read all inbox messages
DELETE	/api/messages/:id	🔒 Delete a message

Skills

Method	Endpoint	Description
GET	/api/skills	Fetch all skills
POST	/api/skills	🔒 Add a skill
PUT	/api/skills/:id	🔒 Update a skill
DELETE	/api/skills/:id	🔒 Delete a skill

Education

Method	Endpoint	Description
GET	/api/education	Fetch all education entries
POST	/api/education	🔒 Add an education entry
PUT	/api/education/:id	🔒 Update an entry
DELETE	/api/education/:id	🔒 Delete an entry

Settings

Method	Endpoint	Description
GET	/api/settings	Fetch global site settings
PUT	/api/settings	🔒 Update site settings

File Upload

Method	Endpoint	Description
POST	/api/upload	🔒 Upload an image to Cloudinary
POST	/api/upload/video	🔒 Upload a video to Cloudinary

Security

Method	Endpoint	Description
GET	/api/security/logs	🔒 View all honeypot-captured bot logs

---

🤝 Contributing

Pull requests are welcome! For major changes, please open an issue first to discuss what you would like to change.

---

Built with ❤️ to showcase Full-Stack Architecture, Security Engineering, and UI Design.