๐ฟ Phase 1.5 โ Git
P07 ยท Pertemuan 7 dari 20
Git & Version Control
Memahami konsep version control, menguasai perintah Git dasar, membuat repository GitHub, dan deploy website gratis via GitHub Pages.
Tujuan Pembelajaran
- 01Memahami apa itu Git dan mengapa penting bagi developer
- 02Instalasi Git dan konfigurasi (git config)
- 03Menguasai perintah dasar: init, add, commit, status, log
- 04Membuat branch, checkout, dan merge
- 05Membuat repository GitHub dan melakukan push/pull
- 06Deploy website ke GitHub Pages
Sub-topik & Materi
- 01Apa itu Git dan Version Control System (VCS)
- 02Instalasi Git & konfigurasi global (user.name, user.email)
- 03Perintah dasar: git init, add, commit, status, log
- 04Branching: git branch, checkout, merge
- 05GitHub: membuat repo, remote add, push, pull
- 06Deploy ke GitHub Pages โ hosting gratis
Penjelasan Konsep
Konsep 1
Apa itu Git dan Mengapa Perlu?
Git adalah sistem version control โ alat untuk menyimpan riwayat perubahan kode. Bayangkan seperti "Ctrl+Z super canggih" yang bisa kamu gunakan kapan saja. Dengan Git: kamu bisa kembali ke versi sebelumnya jika ada yang rusak, bisa berkolaborasi dengan tim tanpa menimpa pekerjaan orang lain, dan punya backup otomatis di cloud (GitHub).
Konsep 2
Alur Kerja Git: Working โ Staging โ Commit
Ada 3 "area" di Git: Working Directory (file yang sedang kamu edit), Staging Area (file yang sudah kamu "tandai" untuk di-commit dengan git add), dan Repository (riwayat commit yang tersimpan). Alurnya: edit file โ git add (tandai) โ git commit (simpan ke riwayat).
bash
"t-cm"># Cek status file yang berubah "t-fn">git status "t-cm"># Tandai semua file untuk di-commit "t-fn">git add . "t-cm"># Atau tandai file tertentu "t-fn">git add index.html about.html "t-cm"># Simpan ke riwayat dengan pesan "t-fn">git commit -m "Add navigation menu to all pages"
Konsep 3
Setup Git Pertama Kali
Sebelum menggunakan Git, kamu perlu mengkonfigurasi nama dan email. Ini akan muncul di setiap commit sebagai identitas kamu. Lakukan ini satu kali di komputer baru. Gunakan email yang sama dengan akun GitHub.
bash
"t-cm"># Konfigurasi identitas (lakukan sekali) "t-fn">git config --global user.name "Nama Kamu" "t-fn">git config --global user.email "email@kamu.com" "t-cm"># Cek konfigurasi "t-fn">git config --list "t-cm"># Inisialisasi repo baru di folder project "t-fn">git init
Konsep 4
Hubungkan ke GitHub dan Push
GitHub adalah layanan cloud untuk menyimpan repository Git. Setelah commit lokal, push ke GitHub agar tersimpan online. Langkah: buat repo baru di github.com โ copy URL repo โ tambahkan sebagai remote โ push.
bash
"t-cm"># Tambahkan GitHub sebagai remote "origin" "t-fn">git remote add origin https://github.com/username/webdev-project."t-fn">git "t-cm"># Push ke GitHub (pertama kali) "t-fn">git push -u origin main "t-cm"># Push selanjutnya cukup "t-fn">git push
Konsep 5
GitHub Pages โ Deploy Website Gratis
GitHub Pages adalah fitur gratis untuk hosting website statis (HTML/CSS/JS). Caranya: di repository GitHub โ Settings โ Pages โ Source: Deploy from branch โ Branch: main โ Save. Website akan tersedia di https://username.github.io/nama-repo dalam beberapa menit.
Contoh Kode Lengkap
bash
"t-cm"># Konfigurasi pertama kali (sekali saja) "t-fn">git config --global user.name "Nama Kamu" "t-fn">git config --global user.email "email@kamu.com" "t-cm"># Inisialisasi & commit pertama "t-fn">git init "t-fn">git add . "t-fn">git commit -m "Initial commit: tambah halaman profil" "t-cm"># Hubungkan ke GitHub & push "t-fn">git remote add origin https://github.com/username/repo."t-fn">git "t-fn">git push -u origin main "t-cm"># Update setelah perubahan "t-fn">git add . "t-fn">git commit -m "Update: perbaiki navigasi halaman about" "t-fn">git push "t-cm"># Cek status dan riwayat "t-fn">git status "t-fn">git log --oneline
Latihan Kelas ยท Upload Mini Project HTML ke GitHub dan deploy menggunakan GitHub Pages
1
Install Git dan konfigurasi nama & email
2
Buat repository baru di github.com (nama: webdev-project)
3
Di folder Mini Project, jalankan git init dan git add .
4
Commit dengan pesan "Initial commit: mini project HTML"
5
Push ke GitHub dengan git remote add + git push
6
Aktifkan GitHub Pages: Settings > Pages > Branch: main > Save
Kesalahan yang Sering Dibuat
git push tanpa git add dan git commit dulu โ harus urut: add โ commit โ push
Pesan commit terlalu singkat ("update", "fix") โ tulis pesan yang deskriptif: "Fix broken nav link in about.html"
Repository dibuat Private โ GitHub Pages butuh repo Public
Salah branch name: "master" bukan "main" โ GitHub sekarang default "main"
Tidak konfigurasi nama/email Git โ commit tidak teridentifikasi dengan benar