Dalam proses membuat website, developer tidak hanya membutuhkan HTML, CSS, JavaScript, atau bahasa pemrograman lainnya. Ketika project mulai berkembang, kita juga membutuhkan cara yang baik untuk mengelola perubahan kode.

Bayangkan Anda sedang membuat website dan melakukan perubahan pada beberapa file. Ternyata setelah perubahan tersebut, website justru mengalami error. Jika tidak memiliki sistem pencatatan perubahan, akan cukup sulit untuk mengetahui bagian mana yang menyebabkan masalah.

Di sinilah Git dan GitHub menjadi sangat berguna.

Git membantu developer mencatat dan mengelola perubahan kode, sedangkan GitHub dapat digunakan sebagai tempat menyimpan repository secara online sekaligus berkolaborasi dengan developer lain.

Lalu, apa sebenarnya Git dan GitHub? Apa perbedaannya dan bagaimana cara menggunakannya untuk pengembangan website?

Mari kita bahas dengan bahasa sederhana.

Apa Itu Git?

Git adalah sistem version control yang digunakan untuk mencatat perubahan pada file dalam sebuah project.

Dengan Git, developer dapat mengetahui perkembangan project dari waktu ke waktu.

Misalnya, Anda memiliki website dengan struktur:

website/
├── index.html
├── style.css
└── script.js

Hari ini Anda mengubah style.css. Besok Anda mengubah script.js. Git dapat membantu mencatat perubahan tersebut sehingga perkembangan project lebih terorganisir.

Git juga memungkinkan developer kembali ke versi sebelumnya apabila perubahan terbaru ternyata menimbulkan masalah.

Apa Itu GitHub?

GitHub adalah platform berbasis internet yang digunakan untuk menyimpan repository Git dan mendukung kolaborasi dalam pengembangan software.

Sederhananya:

Git = alat untuk mengelola perubahan kode.
GitHub = platform online untuk menyimpan dan berkolaborasi menggunakan repository Git.

Git dapat digunakan tanpa GitHub. Namun, GitHub menjadi sangat populer karena memudahkan developer menyimpan project secara online, bekerja bersama tim, dan membagikan project kepada orang lain.

Perbedaan Git dan GitHub

Meskipun sering disebut bersamaan, Git dan GitHub sebenarnya berbeda.

Git	GitHub
Sistem version control	Platform hosting dan kolaborasi
Berjalan di komputer	Berbasis online
Mencatat perubahan project	Menyimpan repository secara online
Bisa digunakan tanpa internet untuk sebagian besar aktivitas	Membutuhkan koneksi untuk sinkronisasi layanan online
Digunakan untuk mengelola versi kode	Digunakan untuk berbagi dan berkolaborasi

Jadi, jangan menganggap Git dan GitHub sebagai dua nama untuk teknologi yang sama.

Mengapa Git dan GitHub Penting untuk Developer Website?

Saat project masih kecil, Anda mungkin bisa mengelola file secara manual.

Namun, semakin besar project, semakin sulit melacak perubahan yang terjadi.

Git dan GitHub membantu mengatasi masalah tersebut.

Beberapa manfaatnya antara lain:

• Menyimpan riwayat perubahan kode.
• Memudahkan kembali ke versi sebelumnya.
• Membantu menghindari kehilangan kode.
• Memudahkan kerja sama dalam tim.
• Menyimpan project secara online.
• Mempermudah proses pengembangan fitur.
• Membantu developer mengelola beberapa versi project.

Karena itu, Git merupakan salah satu tools penting yang sebaiknya mulai dipelajari oleh calon web developer.

Mengenal Repository

Dalam Git dan GitHub, Anda akan sering menemukan istilah repository atau biasa disingkat repo.

Repository adalah tempat yang digunakan untuk menyimpan project beserta riwayat perubahan yang dikelola menggunakan Git.

Contohnya, Anda membuat website bernama:

website-toko

Repository tersebut dapat berisi:

website-toko/
├── index.html
├── produk.html
├── style.css
├── script.js
└── images/

Selain file project, Git juga menyimpan informasi mengenai perubahan yang terjadi pada project tersebut.

Apa Itu Commit?

Commit adalah catatan atau snapshot dari perubahan yang disimpan dalam repository Git.

Misalnya Anda membuat halaman utama website.

Setelah selesai, Anda dapat membuat commit:

Membuat halaman utama website

Kemudian Anda membuat halaman produk:

Menambahkan halaman produk

Dengan commit, Anda dapat mengetahui perubahan apa yang dilakukan pada setiap tahap pengembangan.

Contoh sederhana:

Commit 1
Membuat struktur HTML

Commit 2
Menambahkan CSS

Commit 3
Menambahkan halaman produk

Commit 4
Menambahkan fitur JavaScript

Pesan commit sebaiknya dibuat singkat tetapi jelas.

Apa Itu Branch?

Branch digunakan untuk membuat jalur pengembangan yang terpisah dari kode utama.

Misalnya project website memiliki branch utama:

main

Kemudian Anda ingin membuat fitur login.

Daripada langsung mengubah kode utama, Anda dapat membuat branch:

fitur-login

Strukturnya menjadi:

main
   \
    fitur-login

Anda dapat mengembangkan fitur tersebut tanpa mengganggu branch utama.

Setelah fitur selesai dan sudah diperiksa, perubahan dapat digabungkan kembali ke branch utama.

Apa Itu Merge?

Merge adalah proses menggabungkan perubahan dari satu branch ke branch lainnya.

Misalnya Anda memiliki:

main
fitur-login

Setelah fitur login selesai dibuat dan diuji, perubahan dari fitur-login dapat digabungkan ke main.

Konsep sederhananya:

main
  ↓
buat branch
  ↓
fitur-login
  ↓
coding & testing
  ↓
merge
  ↓
main

Branch dan merge sangat membantu ketika developer mengerjakan project yang memiliki banyak fitur.

Mengenal Push dan Pull

Dua istilah yang juga sering digunakan saat bekerja dengan GitHub adalah push dan pull.

Push

Push digunakan untuk mengirim perubahan dari repository lokal di komputer ke repository online di GitHub.

Gambaran sederhananya:

Komputer
   ↓
  Push
   ↓
GitHub

Misalnya Anda selesai membuat fitur baru di komputer dan ingin menyimpannya ke GitHub.

Pull

Pull digunakan untuk mengambil perubahan dari repository remote ke komputer lokal.

Gambaran sederhananya:

GitHub
   ↓
  Pull
   ↓
Komputer

Fitur ini sangat berguna ketika bekerja dalam tim.

Misalnya teman Anda memperbarui kode di GitHub. Anda dapat mengambil perubahan tersebut ke komputer menggunakan Git.

Cara Kerja Git dalam Pengembangan Website

Secara sederhana, alur kerja Git dapat digambarkan seperti berikut:

Buat atau ubah kode
        ↓
   Git melihat perubahan
        ↓
      git add
        ↓
     git commit
        ↓
      git push
        ↓
      GitHub

Alur ini dapat dilakukan berulang kali selama proses pengembangan website.

Contoh Penggunaan Git untuk Project Website

Misalnya Anda memiliki project website sederhana.

1. Buat Folder Project

website-saya/
├── index.html
├── style.css
└── script.js

2. Inisialisasi Git

Buka terminal di folder project kemudian jalankan:

git init

Perintah tersebut akan membuat repository Git lokal.

3. Periksa Perubahan

Gunakan:

git status

Perintah tersebut dapat digunakan untuk melihat status file dalam repository.

4. Tambahkan File

Untuk menambahkan seluruh file:

git add .

Tanda . menunjukkan seluruh perubahan pada direktori tersebut.

5. Buat Commit

Kemudian simpan perubahan menggunakan:

git commit -m "Membuat website sederhana"

Sekarang Git memiliki catatan perubahan tersebut.

Menghubungkan Project dengan GitHub

Setelah repository lokal dibuat, project dapat dihubungkan dengan repository di GitHub.

Secara umum, alurnya:

Project lokal
     ↓
   Git
     ↓
Repository GitHub

Setelah repository GitHub dibuat, URL repository tersebut dapat ditambahkan sebagai remote.

Contoh:

git remote add origin URL_REPOSITORY

Kemudian perubahan dapat dikirim menggunakan:

git push -u origin main

Nama branch utama dapat berbeda tergantung konfigurasi repository yang digunakan.

Mengapa Developer Menggunakan GitHub?

GitHub tidak hanya berfungsi sebagai tempat menyimpan kode.

Platform ini juga menyediakan berbagai fitur yang membantu proses pengembangan software, seperti:

Kolaborasi

Beberapa developer dapat mengerjakan project yang sama.

Pull Request

Developer dapat mengajukan perubahan untuk diperiksa sebelum digabungkan ke branch tertentu.

Issue

Tim dapat mencatat bug, masalah, atau pekerjaan yang perlu dilakukan.

Repository Publik

Project tertentu dapat dibagikan kepada orang lain sehingga dapat menjadi bagian dari portofolio developer.

Git dan GitHub untuk Portofolio Web Developer

Bagi orang yang ingin berkarier sebagai web developer, GitHub juga dapat menjadi bagian dari portofolio.

Anda dapat menyimpan project seperti:

Website Portfolio
Landing Page
Website Toko Online
Aplikasi To-Do List
Sistem Informasi
Project JavaScript
Project PHP

Dengan repository yang rapi, orang lain dapat melihat bagaimana Anda mengembangkan project.

Namun, jangan hanya mengumpulkan repository. Usahakan project memiliki dokumentasi yang jelas agar mudah dipahami.

Tips Membuat Repository yang Profesional

Jika ingin menggunakan GitHub sebagai portofolio, beberapa hal berikut dapat diperhatikan.

Gunakan Nama Repository yang Jelas

Contoh:

website-toko-online

lebih mudah dipahami dibanding:

project123

Buat README

README dapat menjelaskan:

• Nama project.
• Fungsi project.
• Teknologi yang digunakan.
• Cara menjalankan project.
• Screenshot jika diperlukan.

Gunakan Commit yang Jelas

Contoh:

Menambahkan halaman login
Memperbaiki responsive navbar
Menambahkan validasi form
Memperbaiki tampilan footer

Hindari commit seperti:

update
fix
coba
test

jika tidak memberikan informasi yang jelas.

Kesalahan yang Sebaiknya Dihindari

Saat belajar Git dan GitHub, ada beberapa kesalahan yang cukup sering dilakukan pemula.

1. Tidak Membuat Commit Secara Teratur

Jika terlalu lama tidak melakukan commit, riwayat perubahan akan sulit dipahami.

2. Pesan Commit Tidak Jelas

Gunakan pesan yang menjelaskan perubahan.

3. Mengunggah File Rahasia

Jangan mengunggah:

• Password.
• API key.
• Token.
• Credential database.
• File konfigurasi rahasia.

Gunakan .gitignore untuk mencegah file tertentu ikut masuk ke repository.

Contoh:

.env
node_modules/

4. Tidak Memeriksa Kode Sebelum Push

Sebelum mengirim perubahan ke repository online, pastikan kode sudah diperiksa dan tidak mengandung data sensitif.

Apakah Pemula Perlu Belajar Git dan GitHub?

Ya.

Git memang terlihat sedikit membingungkan ketika pertama kali dipelajari karena terdapat banyak istilah seperti:

• Repository
• Commit
• Branch
• Merge
• Push
• Pull
• Clone
• Remote

Namun, Anda tidak perlu mempelajari semuanya sekaligus.

Mulailah dari konsep dasar:

git init
↓
git status
↓
git add
↓
git commit
↓
git push

Setelah memahami alur tersebut, Anda dapat mempelajari branch, merge, pull request, dan fitur lainnya secara bertahap.

Git dan GitHub Bukan Hanya untuk Programmer

Walaupun sangat populer di kalangan programmer, konsep version control juga dapat berguna dalam berbagai project yang membutuhkan pengelolaan perubahan file.

Namun, dalam dunia web development, Git menjadi sangat penting karena project biasanya terus mengalami perubahan.

Hari ini mungkin Anda membuat HTML. Besok menambahkan CSS. Minggu depan menambahkan JavaScript dan database.

Dengan Git, semua perubahan tersebut dapat dikelola dengan lebih terstruktur.

Kesimpulan

Git dan GitHub merupakan tools penting dalam pengembangan website modern. Git berfungsi sebagai sistem version control untuk mencatat dan mengelola perubahan project, sedangkan GitHub menyediakan platform online untuk menyimpan repository dan mendukung kolaborasi.

Dengan memahami konsep seperti repository, commit, branch, merge, push, dan pull, Anda akan lebih siap mengelola project website secara profesional.

Bagi pemula yang sedang belajar web development, Git dan GitHub sebaiknya mulai dipelajari sejak dini. Tidak perlu langsung menguasai semua fiturnya. Mulailah dari perintah dasar, praktikkan pada project kecil, lalu tingkatkan kemampuan secara bertahap.

Coding bukan hanya tentang membuat kode yang berjalan, tetapi juga tentang bagaimana kode tersebut dikelola dengan baik.