Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

177 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Modern Tech Portfolio

A premium, modern developer portfolio built with a focus on visual aesthetics, smooth animations, and high performance. The application is completely static (SSG) and loads project/experience data from local JSON structures.

Deployed on Vercel Built with v0


Key Features

  • 100% Static & Fast (SSG): Replaced external database queries with local JSON data storage, ensuring sub-second load times and zero dependency on live databases.
  • Dynamic Accent Themes Switcher: Interactive customizer allowing visitors to toggle between Slate & Teal, Cobalt, Emerald, Coral, Violet, and Amber themes. Full dark and light mode compatibility.
  • Aurora Glow & Glassmorphism UI: Harmonious color palettes using backdrop-filters, custom glowing ambiance spots, and clean card-based layouts.
  • Snappier Scroll Animations: Optimally tuned CSS reveal transitions and scaled-down stagger delays for sections so the portfolio feels responsive and alive.
  • Interactive Timeline Accordion: Refactored work experience section using inline collapsible content, minimizing interaction cost for recruiters.
  • Full Localization (i18n): Multi-language support for English (EN), Vietnamese (VI), and Traditional Chinese (ZH-TW) via next-intl.

Tech Stack

  • Framework: Next.js 16 (App Router)
  • Library: React 19
  • Styling: Tailwind CSS v4 (incorporating @tailwindcss/postcss and CSS @theme declarations)
  • Animations: Motion (formerly Framer Motion) + GSAP (GreenSock Animation Platform)
  • Scrolling: Lenis (Smooth Scrolling)
  • Localization: next-intl

Project Structure & Data

All projects and experiences are loaded statically from the data/ directory:

  • data/projects.json: Lists your showcased builds including titles, localized descriptions, images, tags, and URLs.
  • data/experiences.json: Lists your work experience history with positions, company names, periods, descriptions, and core skills.

To update your portfolio projects or experiences, simply edit these JSON files directly and push to deployment.


Local Development

Ensure you have Bun installed locally.

1. Install dependencies

bun install

2. Run the development server

bun run dev

Open http://localhost:3000 with your browser to see the result.

3. Build for Production

To compile and verify the optimized static output:

bun run build

About

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages