Project
ProjectsDYNAMIC DEVELOPER PORTFOLIO
A MERN-shaped portfolio with a custom admin, Mongo-backed sections, and server-rendered pages.

Next.js · React · MongoDB · Mongoose · Tailwind
Most developer sites go stale the week after they launch. This one is built so the public site always reflects what I actually ship — roles, schools, credentials, and project write-ups live as documents, not hardcoded pages.
The problem
A static template looks finished until the next certificate, job, or case study. Then you are back in the repo. I wanted a portfolio that behaves like a small product: visitors get a fast public site, and I get a private place to own the content.
What I built
A full-stack personal site with two surfaces:
- A public, server-rendered portfolio — hero, experience, education, affiliations, certificates, trainings, projects, skills, and contact.
- A private content dashboard — authenticated, role-aware, with drag-and-drop ordering, publish/feature toggles, markdown case studies, and image uploads with crop. Custom sections can be added, labeled, reordered, or hidden without a deploy. System sections stay structured (dates, logos, stacks) so the public layout stays consistent.
Product decisions
Content is the product. Experience, education, and credentials are first-class records with logos, date ranges, and optional website links. Projects have a cover, a markdown case study, live/repo links, and a screenshot gallery. Media is treated as an asset, not a filename. Uploads go through crop before they land in Cloudinary. Replacing or removing an image also removes the old file from storage, including gallery shots when a project is deleted. The public UI has to feel designed, not generated. Ink and vermillion, glass navigation, scroll-linked motion, and a mobile section bar that stays usable even with a long list of sections. Company and school logos sit in padded frames so crests and circular marks are not clipped.
Architecture (high level)
- Next.js App Router and TypeScript for the application layer
- MongoDB + Mongoose for profiles, sections, and every collection
- Server-rendered public pages so search engines and first paint see real content
- A locked-down dashboard for CRUD, media, and section visibility
- Cloudinary (with a local fallback in development) for images I did not use a hosted CMS. The dashboard is part of the same codebase, so the data model and the public UI stay in lockstep.
What I would show in a review
- Adding a project with cover, gallery, stack, and markdown — then seeing it on the public site without a rebuild
- Reordering sections and hiding ones that are not ready
- Uploading a PNG logo with transparency and having it stay sharp on a white plate
- Removing a gallery image and confirming the file is gone from storage
Outcome
This site is both the portfolio and a working sample of how I ship: data models, auth-gated tools, media lifecycle, and a public interface that is meant to be operated, not abandoned after launch.
Gallery