Project
Personal Portfolio
A modern, animated portfolio website built with Next.js, Tailwind CSS, and Framer Motion featuring a unique cosmic theme and full mobile responsiveness.
Overview
This is the site you are reading, and it is where I keep my work and experience as a software developer. The theme is cosmic. The background is an animated black hole with a starfield behind it.
Features
- A unique dark theme with an animated starfield and the black hole effect.
- The layout looks great on all devices.
- Framer Motion drives the page transitions and the scroll effects.
- Posts and projects are markdown files, which keeps content management out of the code.
- Meta tags and OpenGraph support are built in.
- Pages are statically generated, so they load fast.
Technical highlights
Animated background
The black hole is drawn on an HTML5 canvas. A star field twinkles behind it, an accretion disk rotates around the event horizon, and there is a subtle gravitational lensing simulation over the top.
Content system
Blog posts and projects are markdown files with frontmatter for the metadata. All the content is version controlled with git, it is written in a format I already know, and new content goes up without touching code.
Lessons learned
Building this portfolio taught me a lot: canvas animations and performance optimization, Framer Motion's scroll-based animations, custom theming in Tailwind CSS, and Next.js static site generation.