Cara Membuat Blog Dengan Github Pages - Pada kesempatan kali ini saya mau share bagaimana membuat blog gratis menggunakan github.
Dalam tutorial ini saya menggunakan jekyll sebagai site generatornya, tapi sebelum kita masuk ke tutorial membuat blog gratis.
...mari kita cari tahu dulu, apa itu github? dan apa itu jekyll?
Pengertian dan Penjelasan Tentang Github
GitHub adalah layanan hosting repository open-source, seperti cloud untuk kode. Ini akan menjadi hosting pada proyek kode sumber kita dalam berbagai bahasa pemrograman yang berbeda dan melacak berbagai perubahan yang dibuat untuk setiap literasi.
Pada 2018, GitHub melaporkan bahwa mereka memiliki lebih dari 28 juta pengguna, jauh lebih banyak daripada pesaing seperti: BitBucket, Microsoft Team Foundation Server dan yang lainnya
GitHub tidak hanya digunakan untuk pemrograman dan pengembangan perangkat lunak saja. Ini juga bisa digunakan oleh banyak jenis proyek lainnya.
Misalnya, panduan sumber terbuka, proyek dokumentasi, sumber belajar, dan proyek lain. tempat pengguna dapat berkolaborasi secara online dan bekerja bersama.
Fasilitas yang ada di Github
#1. Repository
Repository (biasanya disingkat "repo") ini adalah lokasi di mana semua file untuk proyek tertentu disimpan. Setiap proyek memiliki repo sendiri, dan kita bisa mengaksesnya dengan link URL.
#2. Forking a Repo
"Forking" adalah ketika kita membuat proyek baru berdasarkan proyek lain yang sudah ada. Ini adalah fitur luar biasa yang sangat mendorong pengembangan program dan proyek lainnya.
Jika kita menemukan proyek di GitHub yang ingin kita sumbangkan, kita bisa membayar repo, membuat perubahan yang kita inginkan, dan merilis proyek yang direvisi sebagai repo baru.
Jika Repository asli yang kita buat untuk membuat proyek baru yang ingin diperbarui, kita bisa menambahkan pembaruan tersebut ke fork kita saat ini.
#3. Tarik Permintaan
Saat membuat revisi dan menyimpannya, dan ingin itu diakui oleh pengembang aslinya, kita bisa melakukannya dengan membuat tarik permintaan.
Jadi, Penulis dari Repository asli dapat melihat pekerjaan kita, dan kemudian memilih apakah ya atau tidak untuk menerima ke dalam proyek resminya.
#4. Jaringan sosial
Setiap pengguna di GitHub memiliki profil masing-masing yang bertindak seperti resume, menunjukkan riwayat pekerjaan dan kontribusi, dengan begitu pengguna lain bisa melihat dan melakukan atau menawarkan tarik permintaan.
#5. Changelogs
Ketika banyak orang berkolaborasi dalam sebuah proyek, sulit untuk melacak revisi, siapa yang mengubah apa, kapan, dan di mana file-file itu disimpan. GitHub menangani masalah ini dengan melacak semua perubahan yang telah di push ke Repository.
Produk dan Fitur Lain dari Github
- Github Gist - memungkinkan pengguna GitHub untuk membagikan potongan kode atau catatan lain.
- Github Flow - adalah alur kerja berbasis cabang yang ringan untuk penyebaran yang diperbarui secara berkala.
- Github Pages - adalah halaman web statis untuk menjadi tuan rumah sebuah proyek, menarik informasi langsung dari repositori GitHub secara individu atau organisasi.
- Github Desktop - memungkinkan pengguna untuk mengakses GitHub dari desktop Windows atau Mac, tanpa harus ke situs web GitHub.
- Github Student Developer Pack - adalah tawaran gratis alat pengembang yang terbatas untuk siswa, dan termasuk sumber daya cloud, alat dan dukungan pemrograman, dan akses GitHub.
Nah, itulah penjelasan singkat tentang pengertian dari github dan fiturnya
...sekarang mari kita bahas tentang jekyll static site generator
Pengertian Jekyll Static Site Generator
Perlu kita ketahui sebenanya ada dua jenis website: dynamic dan static. Pada Website dynamic misalnya yang dibuat menggunakan CMS seperti Wordpress, Joomla, Drupal dan Blogger/Blogspot.
Informasi atau konten untuk mengisi sebuah halaman web disimpan dalam database yang kemudian akan ditarik ketika ada “perintah” atau query.
Sebagai contoh, ketika kita akan melakukan pencarian produk di Shopee, halaman HTML utuh yang berisi hasil pencarian sebenarnya tidak ada.
Tetapi Shopee mempunyai template khusus untuk memuat hasil pencarian. Sistem akan melakukan query untuk mencari produk pada database sesuai kata kunci, selanjutnya daftar produk yang ditemukan akan dimuat dalam template tersebut.
Di sisi lain, Website static tidak menggunakan database. Seluruh informasi yang akan ditampilkan pada suatu halaman web memang sudah ada pada file HTML-nya.
Tidak ada lagi proses query. File-file HTML ini dapat ditulis satu-persatu menggunakan text editor seperti Notepad atau Sublime Text, atau dapat pula dihasilkan secara otomatis menggunakan “static site generator” seperti Jekyll.
Jekyll adalah salah satu software generator situs static, jadi intinya jekyll adalah platform yang bisa kita gunakan untuk membuat situs static
Perbanding Website Dynamic Dan Static
Dalam contoh ini saya akan coba membandingkan Jekyll dan WordPress
Kelebihan Jekyll di Bandingkan WordPress
- Wordpress itu overkill. Terlalu berlebihan, setidaknya untuk kebutuhan saya dalam membuat blog. Sementara itu, Jekyll memang dikhususkan sebagai blogging platform. Meskipun jauh lebih simple, Jekyll tetap kaya akan fitur-fitur yang dibutuhkan untuk membuat blog.
- Jekyll jauh lebih cepat. karena semua halaman yang ditampilkan memang sudah benar-benar “jadi”. Tidak ada lagi query ke database. Selain itu, memuat file statis pada halaman website membutuhkan sumberdaya yang jauh lebih kecil di sisi server.
- Karena server hanya berisi file-file statis, Jekyll lebih aman dari “gangguan” hacker yang tidak bertanggungjawab. Tidak ada sesuatu yang bisa disasar oleh hacker, kecuali mereka punya username dan password-nya. Bandingkan dengan website berbasis Wordpress yang mempunyai banyak “lubang” untuk dieksploitasi.
- Jekyll adalah “mesin” di belakang Github. Karenanya, dengan mudah kita bisa publish blog gratis pada Github Dengan Github, setiap perubahan pada blog kita akan terekam, meskipun hanya merubah satu huruf. Ya, Github adalah salah satu layanan versioning control yang paling populer. Selain itu, dengan Github memudahkan kita untuk berkolaborasi.
- Jekyll menggunakan Markdown. Artinya kita bisa membuat artikel yang berisi R scripts dengan R Markdown.
Karena tidak ada yang sempurna Jekyll juga memiliki kekurangan dibandingkan WordPress
- Tidak bisa update blog secara live. Perubahan dilakukan secara “lokal”, baru kemudian blog kita generate ulang.
- Menulis artikel pada Jekyll artinya menulis sebuah file teks. Formating dilakukan dengan menggunakan “simbol-simbol” khusus. Bagi yang tidak terbiasa tentu akan terasa merepotkan. Bandingkan dengan Wordpress, menulis artikel dan format-nya (teks tebal dan miring, ukuran huruf, menyisipkan gambar) semudah membuat tulisan dengan Microsoft Word: apa yang kita lihat itulah yang akan kita dapat what you see is what you get - WYSIWYG.
- Tidak seperti template Wordpress yang dapat diganti dengan “sekali” klik, mengubah template Jekyll relatif memerlukan “upaya ekstra”, tricky alias rumit :(
Nah, gimana teman teman? kita sudah membahas keduanya. Sekarang kita akan melanjutkan ke pokok pembahasan kita kali ini yaitu membuat blog gratis menggunakan jekyll dan github pages.
Sebenarnya diluar sana ada banyak banget platform yang bisa kita gunakan untuk membuat blog gratis, salah satu contoh yang paling ngtren misalnya blogger/blogspot dari google.
Tapi, entah kenapa saya sangat tertarik sama jekyll, selain jekyll saya juga menggunakan ghost untuk membuat blog, mungkin lain kali saya akan share artikelnya di blog ini ya.
oh ya buat informasi saja, saya juga udah pernah nulis artikel tentang membuat blog gratis menggunakan blogspot, itu saya tulis di blog saya yang satunya, yang menggunakan CMS WordPress.
Lohh kok WordPress??? kan katanya Sangat Tertarik sama jekyll.
Iya emang sih, saya tertarik sama jekyll tapi bukan berarti saya harus migrasi juga dari WordPress ke Jekyll
Alangkah baiknya kalau kita mempelajari keduanya, biar bisa jadi perbandingan dan tentunya juga bisa menambah wawasan dari kedua platform tersebut, gitu...
...oke, sekarang kita langsung saja
Cara Membuat Blog Menggunakan Jekyll dan Github Pages
#1. Daftar/Masuk Ke Github
Silahkan login terlebih dahulu ke Github, jika belum memiliki akun silahkan lakukan pendaftaran
#2. Buat Repository
Buat repository baru dengan alamat URL sesuai dengan username Github kalian, contohnya farhamdani.githubio.io
...dibelakang username harus ada `.github.io` perhatikan gambar dibawah ini.
Keterangan Pada Gambar:
- Import Repository - Kita bisa mengimport/clone Repo yang sudah ada
- Repository Name - Buat nama repository sesuai dengan username github kalian dan tambahkan .github.io dibelakang username tersebut
- Creat Repository - Klik tombol tersebut jika pada repository name berwarna hijau (tersedia)
Sekedar tambahan, dengan Clone repository kita akan lebih cepat dan mudah untuk membuat github pages, kita hanya tinggal kostum saja.
...Tapi, biar tutorial ini lebih afdol kita bikin dari awal saja :) Lanjut...
Jika sudah melakukan tahapan di atas selanjutnya kita akan di arahkan kehalaman untuk mengimport kode ke github
#3. Setting Github Pages Menggunakan Jekyll
Jekyll berjalan di atas sistem Ruby dan Bundler. Untuk Menginstall Keduanya Berikut Perintahnya:
1. Install Jekyll
$ gem install jekyll
kemudian jalankan perintah berikut untuk install bundler
2. Install Bundler
$gem install bundler
3. Menggunakan Jekyll
Perintah jekyll dasar untuk membuat direktori jekyll dasar yang disebut myrepo adalah jekyll new
$ jekyll new myrepo
$ cd myrepo
$ git init
Jika repo kosong tidak ada pesan error. Jika repo ada file sebelumnya maka akan ada komplain tentang adanya file yang sudah ada di repo. Pindahkan saja file ke tempat lain untuk sementara dan jalankan kembali perintah.
$ jekyll build
$ jekyll serve
Untuk melihat situs web secara lokal, buka http: // localhost: 4000 . Setelah itu kita bisa menekan ctrl-c untuk menghentikan proses di terminal.
kita juga dapat menambahkan --watch perintah di bagian akhir untuk memaksa Jekyll membangun kembali situs setiap kali kita menyimpan file.
$ jekyll serve --watch
Sekarang selanjutnya gunakan perintah$ git add .
$ git commit -m "initial page commit"
Dan Selanjutnya kita akan push ke repository github yang sudah kita buat tadi, gunakan perintah berikut
$ git branch -m master gh-pages
$ git remote add origin git@github.com:username/myrepo.git
$ git push -u origin gh-pages
Sampai Tahap ini kita sudah berhasil membuat blog gratis dengan github pages.Sekarang kita akan membuat blog jekyll dengan cara clone repository
Clone repository jekyll
ini adalah cara yang paling gampang, kita hanya mencari tema jekyll di github atau mencarinya di google, jika kita sudah menemukan tema jekyll yang cocok untuk blog kita, kita tinggal melakukan `fork` atau copy code via https, ssh atau github cli
Setelah itu, kita tinggal melakukan edit pada _config.yml dan kostum pada semua file yang ada, kita bisa sesuaikan dengan yang kita mau.
Oke, teman teman itulah cara kita membuat blog gratis dengan github dan jekyll. semoga artikel yang ribet ini hehe bisa bermanfaat buat kalian semua, selamat mencoba dan sukses selalu buat kita semua.