Cara Menyimpan Website ke Repository Digital agar Dapat Dilihat Orang Menggunakan GitHub

on

Artikel ini membahas cara menyimpan website statis di GitHub agar dapat diakses oleh siapa saja. Dengan panduan ini, bahkan pemula sekalipun bisa melakukannya. Yuk, ikuti langkah-langkahnya secara detail!

Langkah 1: Siapkan Folder Website

  1. Buat folder di komputer kamu yang berisi file-file website seperti:
    • File HTML (misalnya: index.html).
    • CSS (misalnya: style.css).
    • JavaScript (jika ada, misalnya: script.js).
  2. Pastikan website ini bersifat statis, artinya tidak menggunakan bahasa pemrograman server-side seperti PHP.

Langkah 2: Buat Akun GitHub

  1. Kunjungi GitHub.com.
  2. Klik tombol Sign Up atau Daftar.
  3. Masukkan email, password, dan nama pengguna sesuai petunjuk.
  4. Setelah mendaftar, verifikasi email yang dikirimkan oleh GitHub.
  5. Login ke akun GitHub yang sudah dibuat.

Langkah 3: Buat Repository Baru

Repository adalah tempat penyimpanan file website kamu. Berikut langkah-langkah membuatnya:

  1. Setelah login, lihat di bagian kanan atas halaman GitHub, terdapat ikon +. Klik ikon tersebut, lalu pilih New Repository.

    Catatan: Jika kamu berada di halaman awal GitHub, ada tombol berwarna hijau bertuliskan New Repository di bagian kiri atas. Klik tombol ini.

  2. Isi informasi berikut:
    • Repository Name: Ketik nama sesuai keinginan, misalnya portofolio-saya.
    • Description (opsional): Tambahkan deskripsi singkat, seperti "Ini adalah website portofolio saya".
    • Pilih Public agar orang lain bisa mengakses website kamu.
  3. Centang Add a README file (opsional, tapi disarankan untuk dokumentasi).
  4. Klik tombol Create Repository.

Langkah 4: Install Git Bash

Git Bash adalah alat yang mempermudah pengelolaan file dengan perintah sederhana:

  1. Buka git-scm.com.
  2. Download versi terbaru Git Bash sesuai sistem operasi komputer kamu.
  3. Install software seperti biasa (klik Next hingga selesai).

Langkah 5: Buka Terminal

Ada dua cara membuka terminal untuk upload file ke GitHub:

1. Di Visual Studio Code (VS Code):

  • Pastikan kamu sudah menginstal VS Code.
  • Buka VS Code, lalu buka folder website kamu.
  • Klik menu View > Terminal atau tekan Ctrl + `.
  • Ubah terminal ke mode Bash (jika belum otomatis Bash, klik dropdown terminal dan pilih Bash).

2. Di File Explorer (Tanpa VS Code):

  • Buka File Explorer, cari folder website kamu.
  • Klik kanan folder tersebut.
  • Pilih opsi Git Bash Here. Jika opsi ini belum muncul, pastikan kamu sudah menginstal Git Bash sebelumnya.

Langkah 6: Upload Website ke GitHub

  1. Pastikan terminal berada di dalam folder website kamu.
  2. Ketik perintah berikut satu per satu:
    bash

    git init
git add .
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/username/portofolio-saya.git
git push -u origin main
    Penjelasan:

    • git init: Memulai repository git di folder website.

    • git add .: Menambahkan semua file ke repository.

    • git commit -m "first commit": Menyimpan perubahan dengan pesan "first commit".

    • git branch -M main: Mengatur branch utama menjadi "main".

    • git remote add origin ...: Menghubungkan repository lokal ke GitHub.

    • git push -u origin main: Mengupload file ke GitHub.

    Catatan: Ganti username dengan nama akun GitHub kamu dan portofolio-saya dengan nama repository.

Langkah 7: Tampilkan Website di Browser

  1. Kembali ke halaman repository kamu di GitHub.
  2. Klik menu Settings di bagian atas.
  3. Scroll ke bawah hingga menemukan opsi Pages.
  4. Pada bagian Source, pilih Deploy from a branch.
  5. Ubah Branch dari None menjadi main.
  6. Klik tombol Save.

GitHub akan memproses dan memberikan link untuk mengakses website kamu. Link biasanya berbentuk:

arduino

https://(username).github.io/(nama-repository)/

Tips untuk Pemula

  • Jika tidak melihat perubahan langsung, tunggu beberapa menit, karena GitHub Pages membutuhkan waktu untuk memperbarui.
  • Pastikan semua file utama berada di folder utama (root), terutama index.html.

Dengan langkah ini, website kamu kini dapat diakses publik dengan mudah. Bagikan linknya dan tunjukkan karyamu ke dunia! 

Comments

Post a Comment