Cara Membuat Website dengan Hosting Gratis di GitHub Pages

Pernahkah kalian melihat sebuah website dengan sub-domain .github.io ? Misalnya seperti tutorialpemrogramancom.github.io. Untuk kalian yang belum mengetahuinya, itu adalah GitHub Pages. Dalam tutorial kali ini, saya akan memberikan penjelasan mengenai Cara Membuat Website dengan Hosting Gratis di GitHub Pages.

GitHub Pages adalah layanan hosting website gratis yang dapat digunakan untuk meng-hosting website ataupun project kalian. GitHub Pages dapat kalian manfaatkan juga untuk membuat sebuah website pribadi. Tetapi, GitHub Pages hanya mendukung website yang bersifat statis saja. GitHub Pages ini dapat digunakan untuk akun personal ataupun akun organisasi.

Cara Membuat Website dengan Hosting Gratis di GitHub Pages

Pendahuluan

Untuk mengikuti tutorial ini, pastikan kalian telah memiliki akun GitHub. Jika belum, kalian dapat membuatnya secara gratis melalui tautan berikut.

Kemudian, pastikan juga kalian telah men-install Git pada PC kalian agar kita dapat mengakses repository GitHub melalui Git Terminal. Untuk men-download-nya, silakan klik tautan berikut. Selain menggunakan Git Terminal, kalian juga bisa menggunakan Git for PC. Tetapi, dalam tutorial ini saya hanya akan menggunakan Git Terminal.

Jika kalian tidak mengerti tentang HTML ataupun Cara Membuat Website, kalian tidak perlu khawatir, kalian dapat membuat website dengan cara yang cukup mudah.

Terdapat 2 cara yang dapat digunakan untuk mengisi konten pada website yang akan kita buat dalam tutorial ini. Pertama, untuk teman-teman yang tidak mengerti cara membuat website, kalian dapat menggunakan fitur Automatic Page Generator. Kedua, untuk kalian yang sudah paham dengan HTML dan lain sebagainya, kalian dapat membuat website-nya sendiri ataupun menggunakan berbagai macam pilihan template yang tersedia di internet, seperti template html yang dibuat menggunakan Bootstrap.

Membuat Repository Baru

Silakan login ke dalam https://www.github.com/ menggunakan akun yang telah kalian buat sebelumnya. Kemudian, buat repository baru dengan cara klik New Repository.

 

Gambar 1.

Kemudian isikan nama repository dengan format username.github.io. Ganti username tersebut dengan username (personal ataupun organisasi) kalian. Misalkan, tutorialpemrogramancom.github.io. Tambahkan sedikit deskripsi sesuai dengan keinginan kalian. Jika sudah, klik Create repository.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Apabila repository kalian berhasil dibuat, tampilannya akan seperti gambar di bawah ini.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Cara 1: Menggunakan Automatic Page Generator

Untuk teman-teman yang tidak mengerti cara membuat website, kalian dapat menggunakan fitur Automatic Page Generator. Dengan menggunakan fitur tersebut, kalian tidak perlu berhadapan dengan script/kode html, cukup fokus pada pengisian kontennya saja. Berikut penjelasannya.

Setelah tampilan kalian seperti pada gambar 3, klik Setting. Scroll ke bagian bawah dan cari tab GitHub Pages. Jika sudah ketemu, silakan klik Launch automatic page generator.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Selanjutnya, kalian akan diarahkan pada sebuah halaman seperti text editor yang dapat kalian gunakan untuk mengisi konten dari website yang akan kalian buat. Kalian dapat menggunakan text editor tersebut seperti menggunakan Microsoft Word. Hanya saja, pilihan untuk melakukan formatting-nya lebih terbatas.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Saya asumsikan kalian telah membuat beberapa tulisan untuk ditampilkan, atau jika belum biarkan saja secara default dan kalian dapat mengubahnya nanti. Jika sudah, klik Continue to layouts untuk memilih tema yang sudah disediakan. Kalian akan mendapatkan beberapa tema yang dapat digunakan untuk website yang sudah dibuat. Klik Edit untuk kembali ke halaman sebelumnya, atau klik Publish page untuk men-publish website tersebut.

 

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Apabila telah selesai, kalian akan kembali diarahkan ke halaman utama repository kalian dan pastikan terdapat notifikasi bahwa situs kalian sudah berhasil dibuat.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Untuk melakukan editing, kalian dapat kembali ke menu Setting dan klik Launch automatic page generator.

Cara 2: Upload Kode/Script Website

Cara kedua ini dapat digunakan jika teman-teman sekalian sudah membuat website dengan cara coding sendiri ataupun menggunakan template yang tersedia gratis di internet. Berikut penjelasannya.

Setelah kalian membuat repository baru seperti pada gambar 3, klik icon Copy to clipboard pada bagian Quick Setup.

cara-membuat-website-dengan-hosting-gratis-di-github-pages
Gambar 8.

Selanjutnya buka folder tempat kalian akan menyimpan project kalian yang ingin di-upload, misalkan C:\xampp\htdocs. Klik kanan pada daerah kosong, kemudian pilih Git Bash here.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Jika Git Terminal sudah terbuka, silakan ketikkan perintah di bawah ini, kemudian Enter.

Jika berhasil, pada C:\xampp\htdocs terdapat folder baru dengan nama tutorialpemrogramancom.github.io.

Silakan pindahkan semua file project website yang telah kalian buat ke dalam folder baru tersebut. Kemudian, ketikkan perintah-perintah di bawah ini lalu Enter.

Ganti username dengan username kalian, misalkan:

Lanjutkan dengan perintah di bawah ini, kemudian Enter.

Kemudian, ketik perintah di bawah ini, kemudian Enter.

 

Jika masih terdapat warning, silakan ulangi perintah di atas, sekali lagi.

Jika sudah, silakan refresh halaman utama repository kalian. Untuk memastikan website kalian sudah ter-publish, klik Setting dan pastikan kalian mendapatkan notifikasi pada tab GitHub Pages seperti gambar di bawah ini.

cara-membuat-website-dengan-hosting-gratis-di-github-pages

Untuk teman-teman yang menggunakan cara pertama, kalian dapat mengikuti cara kedua untuk melakukan editing website secara manual ataupun menggantinya dengan project buatan kalian sendiri.

 

Jadi, itulah penjelasan mengenai Cara Membuat Website dengan Hosting Gratis di GitHub Pages. Jika kalian mengalami kesulitan, jangan sungkan untuk menanyakannya kepada kami melalui komentar di akhir artikel. Semoga artikel ini bermanfaat. Terima kasih.

 

 

 

Sumber: TutorialPemrogramanID

2 tanggapan untuk “Cara Membuat Website dengan Hosting Gratis di GitHub Pages

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *