Website Portofolio V3

#Project Overview

Website Portofolio V3 adalah versi terbaru dari situs web portofolio pribadi saya yang dibangun menggunakan Next.js, TypeScript, TailwindCSS, dan Shadcn UI. Website ini berfungsi sebagai pusat informasi untuk menampilkan profil, pengalaman, proyek, serta tulisan blog saya.

Versi ini merupakan peningkatan besar (major improvement) dibandingkan versi sebelumnya, dengan fokus pada desain yang lebih clean dan modern, arsitektur komponen yang lebih reusable, serta peningkatan signifikan pada developer experience dan user experience.

#Latar Belakang & Motivasi

Website portofolio ini telah melalui beberapa iterasi, dan pada versi 3, saya ingin melakukan perombakan menyeluruh dari versi sebelumnya.

Motivasi utama pengembangan versi ini adalah:

• Menciptakan desain yang lebih bersih, modern, dan konsisten
• Membangun arsitektur komponen yang mudah dirawat dan dikembangkan
• Menjadikan website ini tidak hanya sebagai portofolio, tetapi juga sebagai platform blog yang kaya fitur
• Mengimplementasikan berbagai best practice yang saya pelajari dari project dan pengalaman sebelumnya

#Improvement dari Versi Sebelumnya

Dibandingkan dengan versi sebelumnya, Website Portofolio V3 membawa banyak peningkatan, antara lain:

• Perombakan desain UI/UX agar lebih modern dan minimalis
• Penggunaan reusable components secara konsisten
• Implementasi rich code block menggunakan Shiki dan Rehype untuk konten teknis
• Dukungan internationalization (i18n) untuk multi-bahasa
• Fitur search, pagination, dan filtering menggunakan tags
• Struktur konten yang lebih rapi untuk blog dan project

#Arsitektur & Teknologi

Website ini dibangun menggunakan teknologi modern dengan pendekatan yang terstruktur:

• Next.js sebagai framework utama
• TypeScript untuk type safety dan maintainability
• TailwindCSS dan Shadcn UI untuk sistem desain dan komponen UI
• MDX untuk menulis konten blog dan project secara fleksibel
• TanStack Query untuk pengelolaan data asynchronous
• Framer Motion untuk animasi ringan dan interaksi UI

Untuk observability dan analytics, website ini terintegrasi dengan:

• Umami
• Google Analytics
• PostHog

#Automation & Release Workflow

Website Portofolio V3 juga dilengkapi dengan workflow automation, di antaranya:

• CI/CD pipeline menggunakan GitHub Actions
• Semantic Release untuk versioning dan release otomatis
• Containerization menggunakan Docker untuk konsistensi environment
• Deployment otomatis ke Vercel

Workflow ini membantu menjaga kualitas kode, konsistensi rilis, dan kemudahan maintenance.

#Open Source & Velora

Walaupun repository Website Portofolio V3 bersifat closed-source, saya tetap menyediakan versi open-source dalam bentuk template blog bernama Velora.

Velora dapat diakses melalui:

Live demo: velora-example.vercel.app

Repository: github.com/armandwipangestu/velora

#What I Learned

Melalui pengembangan Website Portofolio V3, saya mendapatkan banyak pembelajaran, antara lain:

• Merancang arsitektur frontend yang scalable dan reusable
• Mengelola konten teknis menggunakan MDX dengan rich code block
• Implementasi multi-language support (i18n) di Next.js
• Mengintegrasikan berbagai tool analytics dalam satu platform
• Membangun workflow CI/CD dan release automation untuk project frontend

#Mengapa Project Ini Penting

Website Portofolio V3 bukan hanya sekadar situs personal, tetapi juga menjadi:

• Representasi kemampuan teknis saya secara end-to-end
• Media eksperimen dan implementasi best practice frontend modern
• Fondasi untuk pengembangan project dan konten di masa depan

#Kesimpulan

Website Portofolio V3 merupakan hasil iterasi dan improvement berkelanjutan dari versi sebelumnya, dengan fokus pada kualitas desain, arsitektur kode, dan pengalaman pengguna.

Project ini mencerminkan pendekatan saya dalam membangun aplikasi web modern yang maintainable, scalable, dan siap dikembangkan lebih lanjut, serta memperkuat skill saya di bidang Software Engineering, khususnya pada pengembangan frontend dan full-stack web application.