DEV Community

Cover image for Building a Nostalgic Windows XP Portfolio with Next.js 16 & Shadcn
Mahmudul Ahsan
Mahmudul Ahsan

Posted on

Building a Nostalgic Windows XP Portfolio with Next.js 16 & Shadcn

πŸ–₯️ Portfolio in Windows XP with Next.js 16

Remember the good old days of Windows XP? The iconic blue taskbar, the satisfying "Start" button click, and of course, everyone's favorite assistant - Clippy? Well, I decided to bring that nostalgia back by building my entire portfolio as a Windows XP desktop experience!

✨ Features

  • Authentic XP UI: Pixel-perfect recreation of Windows XP interface
  • Draggable Windows: Fully functional window management system
  • Clippy Assistant: AI Assistant that answers questions about my skills and experience implemented using gemini-2.0-flash.
  • Multiple "Applications":
    • πŸ“ My Projects - File explorer style project showcase
    • πŸ’Ό My Profile - Professional information viewer
    • 🌐 Internet Explorer - Blog reader
    • πŸ“ Notepad - README viewer
    • βš™οΈ System Properties - Fun system info
  • Theme Switcher: Classic Blue, Olive Green, and Silver themes
  • Fully Responsive: Works on mobile and desktop
  • SEO Optimized: Dynamic sitemaps, metadata, and Open Graph tags

πŸ› οΈ Tech Stack

  • Framework: Next.js 16
  • Language: TypeScript
  • Styling: Tailwind CSS v4
  • UI Components: Shadcn UI (Radix UI)
  • Icons: Lucide React
  • Interactions: react-draggable

πŸš€ Try It Yourself!

The project is open source and fully customizable:

  1. Clone the repo:
git clone https://github.com/yourusername/windows-xp-portfolio
cd windows-xp-portfolio
npm install
Enter fullscreen mode Exit fullscreen mode
  1. Update your data:
    Edit files in src/data/ folder with your information

  2. Run locally:

npm run dev
Enter fullscreen mode Exit fullscreen mode
  1. Deploy:
npm run build
Enter fullscreen mode Exit fullscreen mode

πŸ“š Resources & Credits

πŸ”— Links

If you enjoyed this, feel free to contribute β€” PRs are always welcome!


NextJS #React #TypeScript #TailwindCSS #Portfolio #Windows

Top comments (2)

Collapse
Β 
homayounmmdy profile image
Homayoun Mohammadi β€’

Beautiful work! Have you considered creating a Linux version for Fedora? Given the current popularity of Windows executables like this, a Fedora build could attract even more attention. If you're interested, I'd be happy to collaborate on building it together.

Collapse
Β 
mahmudulahsan profile image
Mahmudul Ahsan β€’

Thank you so much for the appreciation and interest. I'll definitely contact you if I am interested in the future.