Repository GitHub yang berisi notebook dan kode memang penting, tapi bagi orang awam (termasuk recruiter non-teknis), membuka file .ipynb satu per satu terasa merepotkan. Di sinilah GitHub Pages berperan: mengubah repository-mu menjadi sebuah website portofolio yang bisa diakses lewat link, tampil rapi, dan mudah dibagikan lewat CV atau LinkedIn semuanya gratis, tanpa perlu beli hosting.
Artikel ini membahas cara membuat GitHub Pages dari nol, lengkap dengan analisis akar masalah menggunakan metode 5 Why.
Kenapa Ini Penting? Analisis 5 Why
Masalah awal: Portofolio Data Analyst di GitHub kurang dilirik oleh recruiter.
- Why #1 — Kenapa portofolio di GitHub kurang dilirik? Karena recruiter harus membuka banyak repository satu per satu untuk melihat hasil kerja, dan itu memakan waktu.
- Why #2 — Kenapa membuka repository satu per satu jadi masalah? Karena tidak ada satu halaman ringkas yang menampilkan semua proyek sekaligus dalam bentuk yang mudah dipahami.
- Why #3 — Kenapa tidak ada halaman ringkas seperti itu? Karena kebanyakan orang berhenti di tahap “upload ke GitHub” dan tidak tahu bahwa GitHub juga bisa menghasilkan website statis gratis (GitHub Pages).
- Why #4 — Kenapa fitur GitHub Pages sering tidak dimanfaatkan? Karena dianggap butuh skill web development (HTML/CSS) yang rumit, padahal bisa dimulai dengan template siap pakai.
- Why #5 — Kenapa “kemudahan akses” itu penting untuk portofolio? Karena keputusan recruiter sering diambil dalam hitungan detik saat melihat sebuah profil — semakin cepat dan mudah mereka memahami kualitas kerjamu, semakin besar peluang portofoliomu dilirik lebih lanjut.
Kesimpulan dari 5 Why: Akar masalahnya bukan soal “kurang banyak proyek”, tapi soal presentasi — bagaimana proyek yang sudah ada ditampilkan dengan cara yang paling mudah diakses. GitHub Pages adalah solusi langsung untuk masalah presentasi ini.
Yang Perlu Disiapkan sebelum Memulai Tutorial ini :
- Akun GitHub
- Repository yang ingin dijadikan portofolio
- Teks/konten yang ingin ditampilkan (ringkasan proyek, link ke notebook, dll)
- (Opsional) Sedikit pengetahuan HTML/Markdown dasar
Langkah 1: Tentukan Jenis GitHub Pages yang Akan Dibuat
Ada dua jenis utama:
- User/Organization Page : Satu halaman portofolio utama untuk seluruh akunmu. Nama repository harus persis:
username.github.ioContoh: kalau username kamuabryan-yoga, maka repo-nya harus bernamaabryan-yoga.github.io. - Project Page : Halaman khusus untuk satu proyek tertentu, dibuat dari branch/folder di repository proyek itu sendiri.
Untuk portofolio Data Analyst yang menampilkan banyak proyek sekaligus, User Page biasanya jadi pilihan terbaik sebagai halaman utama.
Langkah 2: Buat Repository Khusus Portofolio
- Login ke GitHub, klik New Repository
- Isi Repository name persis:
username.github.io(gantiusernamedengan username GitHub kamu) - Pilih Public
- Centang Add a Readme file
- Klik Create Repository
disitu saya sudah membuat repo dengan nama yang serupa jadi membuat adanya Warning
Langkah 3: Aktifkan GitHub Pages
- Masuk ke repository yang baru dibuat
- Klik tab Settings
- Di sidebar kiri, klik Pages
- Pada bagian Build and Deployment, pilih Source Deploy From a Brach
- Pilih Brach : Main, folder / (Root), lalu klik Save
- Tunggu beberapa menit, lalu refresh halaman nanti akan muncul link seperti:
https://username.github.io
Langkah 4: Buat Halaman dengan index.html atau Template Jekyll
GitHub Pages otomatis mencari file index.html (atau index.md) di root repository sebagai halaman utama. Ada dua pendekatan:
Opsi A Pakai Markdown Sederhana (paling mudah, tanpa HTML/CSS)
Cukup edit file README.md yang sudah ada, karena GitHub Pages secara default bisa merender README sebagai halaman utama jika kamu mengaktifkan tema Jekyll bawaan:
- Di Settings > Pages, pilih tema di bagian Theme chooser (misalnya “Minimal” atau “Cayman”).
- Edit
README.mddengan struktur portofolio, contoh:
# Halo, saya [Nama Kamu] 👋
Data Analyst dengan fokus pada analisis bisnis dan visualisasi data.
## 📊 Proyek Portofolio
### [Analisis Churn Pelanggan](https://github.com/username/analisis-churn-pelanggan)
Memprediksi risiko churn pelanggan menggunakan Logistic Regression.
**Insight utama:** pelanggan baru dengan komplain tinggi berisiko churn 2x lebih besar.
### [Dashboard Penjualan Retail](https://github.com/username/dashboard-penjualan)
Membangun dashboard interaktif untuk memonitor penjualan bulanan.
## 🛠️ Skills
Python, SQL, Pandas, Tableau, Power BI
## 📫 Kontak
- LinkedIn: [link]
- Email: [email]
Opsi B — Pakai HTML Kustom (lebih fleksibel)
Kalau ingin tampilan lebih personal, buat file index.html di root repository:
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<title>Portofolio Data Analyst - Nama Kamu</title>
</head>
<body>
<h1>Halo, saya Nama Kamu 👋</h1>
<p>Data Analyst dengan fokus pada analisis bisnis dan visualisasi data.</p>
<h2>Proyek Portofolio</h2>
<ul>
<li><a href="https://github.com/username/analisis-churn-pelanggan">Analisis Churn Pelanggan</a></li>
<li><a href="https://github.com/username/dashboard-penjualan">Dashboard Penjualan Retail</a></li>
</ul>
<h2>Kontak</h2>
<p>Email: [email protected]</p>
</body>
</html>
Commit dan push file ini ke repository (lewat GitHub web editor, atau lewat Git di terminal seperti pada tutorial deploy notebook sebelumnya) jika ingin melihat hasil htmlnya kamu bisa masuk ke GitHub Pages yang di tutorial ke 3 diatas dan ini hasilnya bisa kamu lihat dibawah ini :
Langkah 5: Hubungkan ke Proyek-Proyek Lain
Supaya portofolio ini jadi “pusat kendali” dari semua hasil kerjamu, tambahkan link ke:
- Repository notebook analisis (seperti yang dibahas di tutorial “Deploy Notebook ke GitHub”).
- Live demo dashboard (kalau ada, misalnya dari Tableau Public atau Streamlit).
- Artikel/tulisan yang sudah kamu publikasikan.
Langkah 6: Verifikasi dan Bagikan
- Buka
https://username.github.iodi browser baru (mode incognito) untuk memastikan tampilannya sudah benar dari sudut pandang pengunjung lain. - Cek semua link proyek berfungsi dan tidak error 404.
- Tambahkan link ini ke bio LinkedIn, CV, dan email signature.
Tips Tambahan
- Gunakan custom domain (opsional) kalau punya domain sendiri, lewat menu Settings > Pages > Custom domain.
- Update secara berkala — setiap kali selesai proyek baru, tambahkan ke daftar portofolio agar selalu up to date.
- Perhatikan responsivitas kalau pakai HTML kustom, supaya tampilan tetap rapi saat dibuka dari HP.
- Sertakan bagian “Insight Utama” di setiap proyek, bukan cuma link — ini menunjukkan kemampuan analisis, bukan cuma kemampuan coding.
Kesimpulan
GitHub Pages mengubah repository yang tadinya hanya berisi kumpulan file teknis menjadi sebuah halaman portofolio yang profesional dan mudah diakses siapa saja. Seperti yang terlihat dari analisis 5 Why di atas, akar masalah portofolio yang kurang dilirik bukan soal kuantitas proyek, melainkan soal presentasi — dan GitHub Pages adalah jawaban paling praktis serta gratis untuk masalah tersebut.
Langkah selanjutnya: buat repository username.github.io, aktifkan GitHub Pages, susun halaman utama berisi ringkasan proyek-proyekmu (termasuk notebook analisis churn yang sudah dibuat sebelumnya), lalu ambil screenshot di setiap tahap penting sesuai marker 📸 di atas.