This Portfolio
A docs-style personal site with live visit stats, a contact form, and GitHub dashboards.
I built this site as a way to present my work and learn Next.js at the same time. It tracks page views and appreciation clicks in MongoDB, shows a GitHub-style activity heatmap, pulls live GitHub stats, and has a working contact form. The whole thing is deployed on Vercel.
Tech Stack
Next.js 15React 19TypeScriptTailwind CSS 4shadcn/uiMongoDBResendVercel
Features
- Live page-view counter and appreciation button backed by MongoDB.
- GitHub-style activity heatmap showing visits and likes over time.
- Working contact form that sends emails via Resend.
- Dark/light mode, responsive layout, command palette (Cmd+K).
- Sequential page navigation so visitors can read through everything.
Challenges
- Keeping pages fast even though every visit triggers database writes.
- Making the activity heatmap render correctly across theme changes.
- Building a contact form that works even if the email service is misconfigured.
Learnings
- Next.js server actions are a clean way to handle database writes without API routes.
- Building something for yourself is the best way to learn a framework.
- Simple analytics (view counter + heatmap) are more fun than a Google Analytics dashboard.
Feedback
For feedback or suggestions, contact me at: afloresep01@gmail.com