Perjalanan Membuat Website Portfolio Pertama
Cerita singkat tentang proses belajar HTML, CSS, dan JavaScript sambil membangun portfolio ini, termasuk kesalahan dan hal yang baru dipahami.
Dari analis data ke pembelajar web development
Sebagai seorang Data Analyst dan Business Intelligence Specialist, kebanyakan hari saya dihadapkan pada spreadsheet, query SQL, dan dashboard BI. Saya nyaman menyajikan data dalam Tableau atau Power BI, tetapi terbatas pada platform yang sudah ada.
Saya ingin bisa menyajikan hasil analisis melalui website sendiri, sehingga memutuskan untuk belajar pengembangan web dari nol: HTML, CSS, dan JavaScript.
Memilih Astro untuk portfolio
Saya mencoba beberapa alat dan akhirnya memilih Astro untuk website portfolio ini. Alasannya:
- Berfokus pada konten, sangat cocok untuk blog dan portfolio.
- Menghasilkan HTML statis yang cepat dimuat.
- Mendukung Markdown untuk tulisan blog.
- Tidak membutuhkan backend yang kompleks.
Kendala yang saya hadapi
- Tata letak responsif — Pada awalnya, tampilan desktop acak ketika dibuka di ponsel. Saya belajar tentang media query dan pendekatan mobile-first.
- Gelap terang (dark mode) — Menyimpan pilihan pengguna di
localStoragedan menyesuaikan sesuai preferensi sistem memerlukan sedikit JavaScript. - Routing dan halaman detail blog — Memahami bagaimana Astro mengambil file Markdown dan menghasilkan halaman detail untuk setiap artikel.
Kesalahan yang saya buat
Saya pertama kali mencoba menambahkan animasi berlebihan dan hero yang sangat besar. Hasilnya, halaman terasa berat dan tidak nyaman dibuka di perangkat mobile. Setelah membaca panduan desain yang berfokus pada konten, saya membuang animasi yang tidak perlu dan menyederhanakan tata letak.
Apa yang saya pelajari
- HTML semantik penting untuk aksesibilitas dan SEO.
- CSS variabel memudahkan pengelolaan warna tema terang dan gelap.
- JavaScript dasar cukup untuk interaksi sederhana seperti toggle tema dan pencarian artikel.
- Dokumentasi proses belajar itu sendiri sudah menjadi bagian dari portofolio.
Website ini adalah hasil simulasi pembelajaran dan akan terus diperbarui seiring berkembangnya pemahaman saya tentang pengembangan web.