Praktik: Mengelola proyek web menggunakan Git dan GitHub

From OnnoWiki
Jump to navigation Jump to search

Tujuan Pembelajaran

Setelah menyelesaikan modul ini, peserta akan mampu:

  • Menginisialisasi proyek web menggunakan Git
  • Mengelola versi proyek secara lokal
  • Melakukan sinkronisasi ke GitHub
  • Berkolaborasi dengan tim dalam pengembangan proyek web

Persiapan

1. Instalasi Git di Ubuntu

Buka Terminal: 

sudo apt update
sudo apt install git -y

2. Konfigurasi Git 

git config --global user.name "Nama Kamu"
git config --global user.email "emailkamu@example.com"

Menyiapkan Proyek Web

3. Buat Folder Proyek 

mkdir webku
cd webku

4. Tambahkan File HTML Dasar 

 echo "<!DOCTYPE html>
 <html>
 <head><title>Webku</title></head>
 <body><h1>Halo Dunia!</h1></body>
 </html>" > index.html

Inisialisasi Git Lokal

5. Inisialisasi Git 

git init

6. Menambahkan dan Commit File 

git add .
git commit -m "Inisialisasi proyek web"

Menghubungkan ke GitHub

7. Buat Repositori GitHub

  • Login ke [1](https://github.com)
  • Klik **New Repository**
  • Masukkan nama, contoh: `webku`
  • Klik **Create repository**

8. Hubungkan Repositori Git Lokal ke GitHub 

git remote add origin https://github.com/username/webku.git
git branch -M main
git push -u origin main

> Gantilah `username` dengan nama akun GitHub-mu.

Bekerja dengan Proyek

9. Membuat Perubahan

Misalnya edit `index.html`: 

nano index.html

Setelah selesai: 

git add index.html
git commit -m "Perbaikan halaman utama"
git push

Menggunakan Branch untuk Fitur Baru

10. Buat Branch Baru untuk Fitur 

git checkout -b fitur-kontak

Tambahkan file:

echo "

Kontak: email@example.com

" >> index.html 

git add index.html
git commit -m "Menambahkan info kontak"
git push origin fitur-kontak

Kolaborasi dan Pull Request

11. Membuat Pull Request

  • Buka GitHub
  • Akan muncul notifikasi **Compare & pull request**
  • Klik dan isi deskripsi perubahan
  • Klik **Create pull request**

Setelah disetujui dan di-merge oleh tim, branch dapat dihapus: 

git branch -d fitur-kontak
git push origin --delete fitur-kontak

Menarik Perubahan Terbaru

Jika ada perubahan oleh rekan tim: 

git pull origin main

Mengabaikan File Tertentu

12. Tambahkan `.gitignore` 

echo "node_modules/" >> .gitignore
echo "*.log" >> .gitignore
git add .gitignore
git commit -m "Menambahkan file .gitignore"
git push

Latihan Proyek Web

  • Buat folder proyek `latihan-web`
  • Tambahkan file `index.html` dan `style.css`
  • Inisialisasi Git dan commit
  • Push ke GitHub
  • Buat branch `fitur-galeri` → tambahkan `galeri.html`
  • Push, buat pull request, dan merge ke `main`

Tips Tambahan

  • Gunakan `git status` untuk melihat status file
  • Gunakan `git log` untuk melihat riwayat commit
  • Gunakan `git diff` untuk melihat perubahan sebelum commit

Pranala Menarik

Retrieved from "https://onnocenter.or.id/wiki/index.php?title=Praktik:_Mengelola_proyek_web_menggunakan_Git_dan_GitHub&oldid=72464"