#Project Overview
Portfolio Website V2 adalah versi kedua dari website portofolio dan blog pribadi saya, yang dibangun menggunakan Next.js, TailwindCSS, dan Markdown. Project ini merupakan upgrade besar dari Portfolio v1, baik dari sisi teknologi maupun workflow pengembangan.
Pada versi ini, website portofolio dan blog saya mulai beralih dari stack tradisional ke stack frontend modern, dengan fokus pada performa, kemudahan deployment, dan developer experience yang lebih baik.
#Latar Belakang & Motivasi
Setelah membangun Portfolio v1 menggunakan PHP vanilla, MySQL, dan Bootstrap, saya mulai menyadari beberapa keterbatasan dari pendekatan tersebut, terutama untuk pengembangan jangka panjang.
Di sisi lain, ekosistem frontend modern mulai berkembang pesat, dan saya ingin:
- Meningkatkan kualitas teknis portofolio saya
- Mempelajari framework modern seperti Next.js
- Mengurangi kompleksitas backend yang sebenarnya tidak terlalu dibutuhkan
- Mengadopsi workflow yang lebih modern dan scalable
Dari kebutuhan tersebut, lahirlah Portfolio Website V2.
#Transisi dari V1 ke V2
Portfolio v2 bisa dibilang sebagai fase transisi penting dari pendekatan lama ke pendekatan modern.
Beberapa perubahan utama dari v1 ke v2 antara lain:
-
Migrasi dari PHP + MySQL ke Next.js
-
Penghapusan database untuk konten blog
- Di v1, konten Markdown disimpan di database
- Di v2, konten blog ditulis langsung dalam file Markdown
-
Peralihan dari Bootstrap ke TailwindCSS
-
Deployment modern menggunakan Vercel
Perubahan ini secara signifikan menyederhanakan arsitektur sekaligus meningkatkan fleksibilitas pengembangan.
#Arsitektur & Teknologi
Pada versi ini, saya mulai menerapkan pendekatan static-first dan content-based architecture.
Teknologi utama yang digunakan:
-
Next.js
- Routing modern
- Static generation untuk halaman blog
-
TailwindCSS
- Utility-first CSS
- Styling yang lebih cepat dan konsisten
-
Markdown
- Digunakan untuk menulis konten blog
- Tanpa database
-
Vercel
- Deployment otomatis
- Optimasi performa bawaan
#Fitur & Workflow
Beberapa fitur dan improvement yang hadir di Portfolio v2 antara lain:
-
Mode gelap (dark mode)
-
Integrasi konten berbasis Markdown
-
Integrasi analytics:
- Umami
- Google Analytics
- PostHog
-
CI/CD pipeline menggunakan GitHub Actions
-
Semantic Release untuk manajemen versi
-
Containerization menggunakan Docker
Dari sisi workflow, versi ini jauh lebih modern dibandingkan v1, terutama dalam hal deployment dan automation.
#Keterbatasan & Catatan Teknis
Walaupun mengalami peningkatan besar dibandingkan v1, Portfolio v2 masih memiliki beberapa keterbatasan, terutama jika dilihat dari sudut pandang saat ini:
-
Desain UI masih tergolong sederhana dan belum terlalu polished
-
Fitur code block masih menggunakan highlight.js
-
Belum mendukung fitur lanjutan seperti:
- Line highlighting
- Diff notation
- Advanced code grouping
-
-
Pengalaman menulis konten teknis belum seoptimal versi berikutnya
Namun, keterbatasan ini justru menjadi bahan pembelajaran penting untuk pengembangan Portfolio v3.
#What I Learned
Melalui pengembangan Portfolio Website V2, saya mendapatkan banyak pembelajaran penting, di antaranya:
- Pengenalan dan penggunaan Next.js secara praktis
- Transisi dari backend-heavy ke content-based architecture
- Penggunaan TailwindCSS dalam project nyata
- Workflow deployment modern dengan Vercel
- Implementasi CI/CD dan automation di project personal
- Pentingnya tooling dalam developer experience
#Mengapa Project Ini Penting
Portfolio Website V2 memiliki peran penting sebagai jembatan antara versi awal dan versi yang lebih matang.
Project ini penting karena:
- Menjadi langkah besar pertama menuju stack modern
- Menyederhanakan arsitektur tanpa mengurangi fungsionalitas
- Menjadi fondasi teknis untuk pengembangan Portfolio v3
- Menunjukkan progres dan evolusi cara saya membangun web application
#Kesimpulan
Portfolio Website V2 adalah fase transisi yang krusial dalam perjalanan portofolio saya.
Walaupun dari sisi desain dan fitur masih tergolong sederhana, versi ini berhasil membawa perubahan besar dari pendekatan lama ke pendekatan modern. Semua pembelajaran, keterbatasan, dan eksperimen di v2 menjadi fondasi kuat yang akhirnya melahirkan Portfolio Website V3 dengan kualitas desain, arsitektur, dan developer experience yang jauh lebih matang.
Untuk detail implementasi dan source code lengkap, silakan langsung melihat repository project ini di GitHub.
