Overview
Modern Portfolio is a personal web application designed to showcase professional work and technical capabilities through a contemporary user interface. Influenced by a layout concept from JS Mastery(opens in a new tab), the design features a dark-themed aesthetic, accompanied by directional lighting effects to enhance visual depth and interactivity.
The application replaced a previous portfolio version and was developed with an emphasis on performance, accessibility, and clean UI structure. A notable technical challenge involved managing font weight variants with Google Fonts in Next.js v13, which I addressed in a Stack Overflow post(opens in a new tab) that was widely referenced by the developer community.
Demo
Demo access is available through this link Modern Portfolio(opens in a new tab) or by interacting with the embedded version below.
Role
UI Designer & Full Stack Web Developer
Core Stack
The most popular NoSQL database.
A project for easily building, deploying, and maintaining open source project websites.
v2.2.0The collaborative interface design tool.
Technologies Used
- TypeScript - A statically typed superset of JavaScript that improves development scalability and tooling.
- Next.js - A React framework offering hybrid rendering, optimized routing, and API integration.
- Tailwind CSS - A utility-first CSS framework that promotes rapid, consistent, and scalable UI development.
- MongoDB - A flexible NoSQL database used to store and manage structured content.
- Prisma - A modern ORM enabling type-safe database operations and schema migration support.
- Figma - Utilized for interface design and layout prototyping.
- Docusaurus - Employed to generate structured documentation for the project.
Period
Initial Development: August 27, 2022 (first commit)
