Github io Tutorial untuk Pembuatan Halaman Web Github

Last Updated on October 31, 2023 by

Github adalah platform yang sering digunakan para developer atau programmer untuk mengelola proyek secara kolaborasi. Layanan berbasis cloud ini dapat memudahkan dalam manajemen proyek, dapat berkomunikasi dengan banyak orang dari berbagai tempat karena diakses secara online.

Intinya, github sangat membantu dalam mengelola dan mengembangkan karya untuk programmer. Github menjadi trend, karena keunggulan-keunggulan yang dimilikinya. Satu dari banyak layanan yang disediakan Github adalah halaman web Github.

Apa itu halaman web Github? Halaman web Github dapat juga disebut Github Pages merupakan sebuah layanan dari Github untuk meng-hosting web atau proyek yang dimiliki langsung dari repositori pada Github.

Sederhananya, Github Page ini memberikan layanan publikasi website. Anda dapat memanfaatkannya sebagai website pribadi ataupun organisasi. Untuk website pribadi dapat dijadikan sebagai alternatif untuk memajang informasi diri, karya atau proyek, bahkan portofolio.

Pada artikel ini, kita akan membahas mengenai github.io tutorial yang dapat Anda coba. Lalu apa itu github.io? Layanan yang diberikan oleh Github ini, nantinya akan mendapatkan sub domain .github.io.

Keunggulan membuat halaman Github ini adalah kemudahan dan sifatnya gratis, sehingga bagi Anda yang ingin menggunakan domain secara gratis, Github Page menjadi satu solusi yang tepat. layanan ini sangat berguna untuk Anda yang memiliki budget terbatas.

Meskipun layanan ini gratis, tetapi Github page hanya menyediakan website yang sifatnya statis. Artinya, halaman ini hanya dapat menjalankan client side saja dan tidak dapat menjalankan dari server side.

Di samping itu, halaman ini hanya dapat dikelola menggunakan HTML, CSS, dan Javascript dan tidak dapat digunakan untuk PHP ataupun Database, seperti melakukan CRUD (Create, Read, Update, dan Delete). Jadi, web statis ini sifatnya satu arah, yang mana tidak adanya fitur untuk menerima feedback dari pengunjung.

Istilah-Istilah dalam Github

Sebelum masuk ke dalam github.io tutorial kali ini, ada beberapa istilah dalam menggunakan Github, terutama dalam membuat Github Page. Di bawah ini, dijelaskan istilah-istilah dalam Github untuk Anda ketahui yang mungkin masih awam dengan Github, tetapi ingin mem-publish website sendiri.

1. Git merupakan sistem pengontrol (beberapa orang menyebutnya sebagai jantung dari Github).
2. Hub merupakan istilah yang digunakan untuk mengubah baris perintah atau command line (beberapa orang menyebutnya sebagai jiwa dari Github)
3. Repository atau disebut juga dengan istilah repo merupakan tempat atau folder untuk menaruh proyek Anda, dapat berupa file kode, gambar, audio, dan lainnya.
4. Branch merupakan salinan dari repositori yang digunakan untuk memulai melakukan pengembangan proyek terpisah.
5. Forking repository merupakan istilah untuk menyalin repositori yang telah ada ke repositori baru. Anda dapat melakukan perubahan dan modifikasi, serta menjadikannya milik Anda.
6. Commit merupakan fitur snapshot atau rekaman dari repositori (riwayat perubahan).
7. Checkout merupakan istilah fitur untuk melakukan perpindahan ke dalam suatu perubahan tertentu.
8. Merge merupakan istilah untuk menggabungkan dua branch atau lebih.
9. Remote merupakan sumber daya atau resource yang memiliki repositori.
10. Push merupakan istilah untuk mengirim commit ke repositori.
11. Pull merupakan isitilah untuk mengambil commit dari repositori.
12. Clone merupakan istilah untuk mengambil repositori dari sebuah remote.
13. Hash penanda unik pada sebuah commit.

Tutorial Membuat Github Page

Setelah mengetahui istilah-istilah dalam Github, selanjutnya kita akan masuk ke pembahasan github.io tutorial. Ada banyak cara yang dipakai dalam membuat Github Page, seperti melalui Github langsung dan ada pula menggunakan aplikasi Git yang dapat diakses dari terminal. Tentunya, Anda perlu meng-install Git untuk cara yang kedua.

Namun, pada tutorial ini akan dibahas melalui halaman Github saja.  Tidak hanya itu, di sini juga akan dibahas cara untuk mengubah Github Pages-nya jika dirasa konten yang ditampilkan masih kurang pas.

1. Akun Github

Sebelum membuat Github pages, pastikan Anda telah memiliki akun Github. Jika belum memilikinya, Anda dapat mendaftar melalui Sign Up.

Jika sudah memiliki akun Github, Anda hanya perlu Sign In untuk masuk.

2.  Membuat repository

Setelah masuk ke akun Github, perlu dibuat repository terlebih dahulu. Membuat repository dapat dilakukan dengan klik Create Repository dan akan tampil beberapa opsi.

Pada halaman ini, isilah nama repositorinya sesuai dengan nama username akun Github Anda.  Contohnya adalah seperti ini: mangqwerty.github.io. Lalu, Anda juga dapat mengisi deskripsi sesuai keingininan.

Kemudian, Anda akan melihat ada dua pilihan visibility, yaitu public dan private. Public artinya repositori Anda dapat dilihat oleh siapa saja dan dapat melakukan commit. Sedangkan, private artinya repository Anda bersifat pribadi yang hanya dapat dilihat oleh Anda atau orang-orang yang diberi akses dapat melihatnya, serta dapat melakukan commit. Pada tutorial ini diatur agar dapat diakses public dengan klik Public.

Pada “Initialize this repository with a README”, README yang dimaksud artinya file berisi deskripsi  panjang terkait proyek yang Anda buat. Anda dapat mencentangnya atau tidak karena sifatnya opsional.

Setelah itu, Anda dapat mengklik tombol Create Repository.

Jika berhasil membuat repositori, maka tampilannya akan seperti gambar di bawah ini.

3. Mengunggah File atau Membuat File

1. Mengunggah file

Unggah file yang nantinya dijadikan sebagai Github Pages dapat berupa file HTML, CSS, Javascript. Caranya dengan klik uploading an existing file, dan unggah file yang digunakan. Setelah itu klik commit changes untuk menyimpan perubahannya.

Apabila sudah berhasil, maka akan tampil halaman seperti di bawah yang berisi file terunggah.

2. Membuat File

Namun, jika Anda belum memiliki filenya, Anda dapat membuatnya melalui Github juga bisa, loh! Caranya dengan klik creating a new file.

Maka akan muncul tampilan seperti gambar di bawah ini. Anda dapat menuliskan baris code-nya pada text editor yang disediakan. Jangan lupa untuk mengisi nama filenya. Contohnya, di sini menggunakan index.html.

Jika sudah selesai menulis baris code-nya, Anda dapat mengklik Commit New File untuk menyimpannya.

Jika telah berhasil membuat file baru, maka file-nya akan muncul pada repositori Anda.

4. Mempublikasikan Halaman Github

Cara mengakses Github Page sangat mudah. Anda dapat mengetikkan nama repositori tersebut dalam URL address, yaitu https://mangqwerty.github.io/. Hal ini akan otomatis mengakses file HTML di dalam repositori.

Namun, jika anda ingin mengakases file lain, Anda dapat mengaksesnya dengan username.github.io/nama_file.html. Sedangkan, untuk mengakses file lain yang berada di folder repositori lain Anda dapat mengaksesnya dengan username.github.io/nama_folder/nama_file.html.

Mengubah Isi Halaman Website

Pada github.io tutorial ini juga dijelaskan cara mengedit file halaman website. Anda dapat melakukannya langsung di Github dan tidak perlu mengeditnya di text editor lain dan kembali mengunggahnya.

Adapun caranya, yaitu membuka file yang akan diedit. Untuk mengeditnya, Anda dapat mengklik icon pensil lalu mengubah baris code-nya.  Lalu akan muncul halaman ini yang menyediakan text editor. Jika telah diedit, jangan lupa untuk commit changes agar filenya tersimpan.

Tidak hanya mengedit, Anda juga dapat menghapusnya melalui icon sampah di sebelah icon pensil dan jangan lupa juga untuk commit changes untuk menyimpan perubahan.

Demikian github.io tutorial dengan mudah dan cepat yang dapat Anda coba. Menarik, bukan? Github Pages bisa digunakan untuk eksperimen jika sedang belajar pemrograman web, baik itu belajar HTML, CSS, maupun Javascript. Untuk lebih tahu lebih dalam tentang dunia pemrograman, simak terus artikel kami di https://appkey.id.