gema.my.id - GitHub merupakan situs web yang menyediakan layanan hosting berbasis cloud gratis. Ini memungkinkan Anda untuk mengunggah dan berbagi kode seperti CSS, Javascript dan file sejenisnya.
Jadi inti dari GitHub adalah Git, sebuah open source project yang dibuat oleh Linus Torvalds, yang memungkinkan anda untuk menyimpan kode atau file CSS dan javascript untuk ditampilkan di blog maupun situs kita.
Pada posting ini, saya akan menunjukkan kepada anda cara membuat akun dan menggunakan GitHub untuk mengenyimpan css, javascripts, atau file lainnya untuk kepentingan kode-kode pada blog atau situs web anda.
Langkah untuk menggunakan GitHub sangat mudah, seperti biasa anda harus daftar akun, membuat repositori, upload file kemudian baru kita bisa pasang di blog.
Oke, mari kita simak detail langkah-langkahnya dibawah ini:
Daftar Akun GitHub
Langkah pertama anda harus daftar atau membuat akun GitHub terlebih dahulu. Silahkan masuk ke situs GitHub.com untuk melakukan pendaftaran.
Masukan detail informasi baru akun GitHub anda seperti saat membuat akun Facebook. Selanjutnya lakukan verifikasi akun melalui email anda.
Membuat Repository GitHub
Setelah selesai mendaftar dan verifikasi email, anda akan langsung diarahkan ke sebuah halaman untuk membuat repository baru di GitHub.
Silahkan isi Repository name dengan nama repositori, pilih Public untuk menyimpan file juga sebagai Hosting anda. dan untuk Initialize this Repository pilih dengan opsi add a README. Kemudian klik tombol Create Repository.
Repository disini ialah suatu folder sama halnya dengan folder di komputer anda.
Sekarang anda sudah mendaftar akun dan membuat repository baru. Selanjutnya mari kita upload file javascript ke ke dalam repository yang telah dibuat tadi.
Upload File Javascript ke Repository GitHub
Selanjutnya mari kita upload file ke GitHub. Sebagai contoh disini saya membuat repository bernama terkuakcom dan file yang akan kita upload bernama terkuaksafelink.js.
Pada halaman repository (dalam contoh ini bernama terkuakcom) silahkan klik Add file > Upload file.
klik choose your file lalu Cari file yang akan anda upload di GitHub (dalam contoh ini saya upload file javascript bernama terkuaksafelink.js). Setelah dipilih kemudian klik tombol Commit change.
Jika file yang anda upload tadi berhasil, maka akan terlihat file baru di dalam repository.
Mengubah RAW GitHub Menjadi CDN
Untuk memasang javascript dari GitHub ke blog kita harus tahu dulu Link atau URL Raw file yang telah di upload tadi, kemudian kita ubah ke CDN.
Untuk mendapatkannya link file raw di GitHub, silahkan klik file yang kita upload tadi yakni file terkuaksafelink.js. maka akan terlihat halaman seperti dibawah ini:
Kemudian kita klik tombol RAW, maka akan diarahkan ke link file raw kita. Silahkan copy link yang ada di address bar browser, kira-kira seperti ini:
https://raw.githubusercontent.com/ongkie21/terkuakcom/main/terkuaksafelink.js
Nah, selanjutnya kita ubah terlebih dahulu link raw tersebut menjadi CDN. Agar bisa kita pasang diblog. Caranya kita gunakan layanan dari raw.githack.com
Silahkan kunjungi raw.githack.com, lalu tempelkan link raw yang telah dicopy tadi pada form paling atas, kemudian akan muncul dua link cdn GitHub dibawahnya.
Kita copy link cdn yg sebelah kiri yakni Use this URL in production. Contoh link nya seperti ini :
https://rawcdn.githack.com/ongkie21/terkuakcom/117bc9c0ab836769cb6311960015b0343cf26d83/terkuaksafelink.js
Memasang JavaScript ke Blog
Setelah mengubah raw menjadi cdn, baru kita bisa menasangnya diblog. Contohnya seperti ini :
<script src="https://rawcdn.githack.com/ongkie21/terkuakcom/117bc9c0ab836769cb6311960015b0343cf26d83/terkuaksafelink.js" type="text/javascript"></script>
Bagian yang saya tandai merupakan link dari cdn file kita di GitHub, Silahkan ganti untuk menyesuaikan dengan link anda.
Nah, seperti itulah Cara Menyimpan File CSS dan JavaScript di GitHub. silahkan anda pahami sedikit demi sedikit langkah-langkahnya, jika memang ada yang kurang dipahami, jangan sungkan menanyakan lewat komentar dibawah.
Saya akhiri posting kali ini.
See you...
See you...