Di Balik Layar
Penasaran bagaimana situs ini bekerja? Berikut adalah intipan pada tumpukan teknologi, arsitektur, dan pilihan desain yang membuatnya berjalan.
Mengapa Membuat Halaman Ini?
Halaman ini ditujukan untuk mendokumentasikan proses di balik layar, keputusan arsitektur, dan evolusi teknis dari portofolio digital saya. Ini adalah jurnal teknik terbuka.
Kode sumber portofolio ini sepenuhnya terbuka untuk umum. Anda dapat melihat, mempelajari, atau menggunakannya sebagai referensi pembuatan situs Anda sendiri.
Iterasi & Pembaruan Terus-menerus
Saya percaya bahwa sebuah situs web tidak pernah benar-benar selesai. Ia berkembang seiring bertambahnya keahlian dan perubahan selera desain pengembangnya.
Portofolio ini sekarang berada pada iterasi ketiga, bertransisi dari situs HTML statis sederhana menjadi aplikasi web Next.js modern yang terintegrasi secara dinamis.
Bagaimana Portofolio Ini Dibuat?
Detail teknologi utama yang menjadi pilar pengembangan dan kinerja situs web ini agar tetap responsif, cepat, dan interaktif.
Fondasi
Dibangun dengan Next.js App Router terbaru, TypeScript, dan Tailwind CSS untuk menjamin struktur kode yang kokoh, performa SEO yang optimal, serta styling yang responsif.
Animasi & Interaksi
Animasi ringan menggunakan Framer Motion dan transisi CSS.
Manajemen Data
Menggunakan Cloud Firestore untuk penyimpanan data dinamis seperti portofolio, artikel blog, dan buku tamu. Spotify API untuk menampilkan lagu yang sedang diputar.
Tumpukan Teknologi
Inilah yang mendukung situs ini. Tidak ada yang mewah, hanya alat solid yang berfungsi:
Detail Pengembangan
Proyek ini dirancang menggunakan pendekatan modular. Setiap bagian di halaman beranda direpresentasikan sebagai widget mandiri (widget-based layout). Hal ini mempermudah pemeliharaan kode dan penambahan fitur baru di masa mendatang tanpa mengganggu alur sistem yang sudah berjalan.
Performa menjadi prioritas utama. Dengan pemanfaatan Server-side Rendering (SSR) Next.js pada halaman portofolio dan blog, data dapat disajikan dengan cepat kepada pengunjung sekaligus memberikan indeks SEO yang sangat ramah terhadap mesin pencari.
Filosofi Desain
Desain portofolio ini menggabungkan gaya minimalis modern dengan sentuhan interaktif yang menyenangkan. Penggunaan elemen kaca (glassmorphism), bayangan tebal (brutalist shadow), dan transisi dinamis bertujuan untuk memberikan impresi yang profesional namun tetap interaktif bagi para pengunjung.
Skema warna dirancang ramah bagi mata dengan dukungan mode gelap otomatis, memastikan keterbacaan artikel blog dan informasi teknis lainnya tetap maksimal dalam berbagai kondisi pencahayaan.
Domain & Hosting
Ketersediaan situs web dan pengelolaan domain merupakan salah satu aspek teknis krusial untuk memastikan portofolio ini dapat diakses 24/7.
Akhiran .my.id menegaskan identitas personal Indonesia di bawah domain .id. Situs ini dilayani melalui HTTPS dan menerapkan HSTS untuk menjaga koneksi tetap aman.
Situs web Next.js ini dihosting di Vercel, yang secara otomatis membangun proyek dari repositori GitHub dan menyebarkannya ke Edge Network global untuk latensi muat yang sangat rendah.
Inspirasi Desain & Kredit
Antarmuka pengguna (UI) dan estetika desain portofolio ini sangat terinspirasi dari karya luar biasa Ryan Aulia (aulianza.com). Terima kasih sebesar-besarnya kepada beliau karena telah menjadi inspirasi dalam membangun personal web yang indah.
Catatan Akhir
Membangun dan memelihara portofolio ini adalah proses belajar yang sangat menyenangkan bagi saya. Ini bukan hanya sebuah kartu nama digital, melainkan juga wadah eksperimen untuk mencoba teknologi-teknologi web terbaru secara langsung.
Terima kasih telah meluangkan waktu untuk membaca dokumentasi teknis ini. Semoga bisa memberikan inspirasi atau manfaat bagi proyek yang sedang Anda bangun!
Jika Anda memiliki pertanyaan, masukan, atau ingin berdiskusi seputar pengembangan web, jangan ragu untuk menghubungi saya melalui halaman kontak.
Salam hangat,
Riki Daniel Tanebeth