Portfolio Website V2

#Project Overview

Portfolio Website V2 is the second version of my personal portfolio and blog website, built using Next.js, TailwindCSS, and Markdown. This project represents a major upgrade from Portfolio v1, both in terms of technology stack and development workflow.

In this version, my portfolio and blog began transitioning from a traditional web stack to a modern frontend stack, with a stronger focus on performance, deployment simplicity, and improved developer experience.

#Background & Motivation

After building Portfolio v1 using vanilla PHP, MySQL, and Bootstrap, I started to recognize several limitations of that approach, especially for long-term maintenance and scalability.

At the same time, the modern frontend ecosystem was rapidly evolving, and I wanted to:

• Improve the technical quality of my portfolio
• Learn modern frameworks such as Next.js
• Reduce unnecessary backend complexity
• Adopt a more modern and scalable development workflow

These motivations led to the creation of Portfolio Website V2.

#Transition from V1 to V2

Portfolio v2 can be seen as an important transition phase from a legacy approach to a modern one.

Some key changes from v1 to v2 include:

• Migration from PHP + MySQL to Next.js

• Removal of the database for blog content

  • In v1, Markdown content was stored in the database
  • In v2, blog content is written directly as Markdown files

• Migration from Bootstrap to TailwindCSS

• Modern deployment using Vercel

These changes significantly simplified the architecture while improving flexibility and maintainability.

#Architecture & Technology

In this version, I began adopting a static-first and content-based architecture.

Core technologies used:

• Next.js

  • Modern routing system
  • Static generation for blog pages

• TailwindCSS

  • Utility-first CSS approach
  • Faster and more consistent styling

• Markdown

  • Used for writing blog content
  • No database required

• Vercel

  • Automatic deployment
  • Built-in performance optimizations

#Features & Workflow

Some notable features and improvements introduced in Portfolio v2 include:

• Dark mode support

• Markdown-based content integration

• Analytics integrations:

  • Umami
  • Google Analytics
  • PostHog

• CI/CD pipeline using GitHub Actions

• Semantic Release for version management

• Containerization using Docker

From a workflow perspective, this version is significantly more modern compared to v1, especially in terms of deployment and automation.

#Limitations & Technical Notes

Despite being a major improvement over v1, Portfolio v2 still has several limitations, especially when viewed from today’s perspective:

• UI design is still relatively simple and not fully polished

• Code block features still rely on highlight.js

  • Lacks advanced features such as:

    • Line highlighting
    • Diff notation
    • Advanced code grouping

• The technical writing experience is not yet optimal

These limitations later became key learning points that directly influenced the development of Portfolio v3.

#What I Learned

Through the development of Portfolio Website V2, I gained valuable insights, including:

• Practical experience using Next.js
• Transitioning from backend-heavy architecture to content-based systems
• Applying TailwindCSS in a real-world project
• Modern deployment workflows with Vercel
• Implementing CI/CD and automation in personal projects
• The importance of tooling in developer experience

#Why This Project Matters

Portfolio Website V2 plays a crucial role as a bridge between early experimentation and a more mature implementation.

This project matters because it:

• Represents my first major step toward a modern tech stack
• Simplified architecture without sacrificing functionality
• Served as the technical foundation for Portfolio Website V3
• Demonstrates the evolution of how I design and build web applications

#Conclusion

Portfolio Website V2 represents a critical transition phase in my portfolio journey.

While the design and feature set were still relatively modest, this version successfully marked a shift from legacy approaches to modern web development practices. All the experiments, limitations, and lessons learned in v2 became the foundation for Portfolio Website V3, which delivers a far more refined design, architecture, and developer experience.

For implementation details and full source code, please refer directly to the project repository on GitHub.