Portfolio pribadi yang dibangun dengan Next.js 15 (App Router), TypeScript, Tailwind CSS, dan Framer Motion.
npm install
npm run dev
Buka http://localhost:3000
Atau lewat CLI:
npx vercel # preview
npx vercel --prod # production
Tidak ada environment variable yang dibutuhkan — kontak memakai link mailto: langsung.
app/
layout.tsx # metadata SEO, font, anti-flash theme script
page.tsx # merangkai semua section + JSON-LD Person
globals.css # design token (light/dark) + component layer
opengraph-image.tsx # kartu social 1200×630, di-render saat build
sitemap.ts # /sitemap.xml
robots.ts # /robots.txt
components/
Navigation.tsx # sidebar desktop, drawer mobile, scroll-spy, progress bar
Cursor.tsx # cursor kustom (pointer halus saja)
Reveal.tsx # wrapper animasi scroll-reveal
Counter.tsx # angka yang menghitung naik saat terlihat
Icons.tsx # ikon SVG inline (sun/moon)
sections/ # Hero, About, Education, Experience, Skills, Services, Works, Contact
data/
portfolio.ts # SEMUA konten ada di sini
lib/
site.ts # konstanta domain kanonik
public/images/ # foto profil, logo, 24 screenshot proyek
Semua teks, daftar proyek, pengalaman, dan pendidikan ada di satu file: data/portfolio.ts. Tidak perlu menyentuh komponen untuk memperbarui isi.
Menambah proyek baru: taruh screenshot di public/images/work-<n>.png (melanjutkan penomoran yang ada), lalu tambahkan entri di array works.
localStorage dan diterapkan sebelum paint pertama, jadi tidak ada kedipan light/dark.