Premium, server-rendered personal portfolio built with Next.js 16, React 19, and TypeScript. Token-driven theming, MDX content collections, full SEO, and PWA support.
Live: stareezy.tech
# Install Vercel CLI
npm i -g vercel
# From the next-gen-portfolio directory
cd next-gen-portfolio
vercelFollow the prompts:
- Framework: Next.js (auto-detected)
- Root directory:
next-gen-portfolio(if deploying from workspace root) - Build command:
npm run build - Output directory:
.next
Copy .env.example to .env.local and fill in values:
| Variable | Purpose |
|---|---|
NEXT_PUBLIC_GA_MEASUREMENT_ID |
Google Analytics 4 |
NEXT_PUBLIC_CLARITY_PROJECT_ID |
Microsoft Clarity |
NEXT_PUBLIC_OPENPANEL_CLIENT_ID |
OpenPanel analytics |
RESEND_API_KEY |
Contact form email delivery |
CONTACT_TO_EMAIL |
Email that receives contact submissions |
GITHUB_PORTFOLIO_TOKEN |
Server-only public GitHub contribution feed |
The core app works without these values. Analytics silently no-ops, the contact
form falls back gracefully, and the open-source page displays an unavailable
state until GITHUB_PORTFOLIO_TOKEN is configured. Keep that token server-only;
it does not need write permissions.
cd next-gen-portfolio
npm install
npm run dev # http://localhost:3000
npm run build # production build
npm run test # property-based tests (vitest --run)
npm run typecheck # tsc --noEmit- Framework: Next.js 16 App Router, React 19, TypeScript 5
- Styling: CSS custom properties from
@stareezy-ui/tokens - Content: MDX + Zod schemas (content collections)
- Testing: Vitest + fast-check (47 property-based tests)
- SEO: sitemap, robots, RSS, JSON-LD, OG image, PWA manifest
- Analytics: Google Analytics 4, Microsoft Clarity, OpenPanel