Langkah mudah deploy blog hugo ke netlify ini merupakan lanjutan dari tutorial sebelumnya yang membahas tentang:

  1. Cara membuat blog dengan hugo bagian 1
  2. Cara membuat blog dengan hugo bagian 2 (deploy ke github pages)

Setelah sebelumnya membahas tentang cara membuat blog hugo di komputer lokal kemudian meng-online-kan blog tersebut dengan meng-upload nya ke github dan menggunakan github pages. Sekarang kita akan mencoba cara berikutnya tanpa menggunakan github pages, akan tetapi menggunakan fasilitas dari netlify.

Langkah-langkah yang dilakukan untuk menjalankan blog hugo dengan netlify adalah sebagai berikut:

Mempersiapkan blog hugo di komputer lokal

Disini saya menyiapkan contoh blog yang dibuat menggunakan hugo dengan nama “latihan-3” dengan menggunakan tema “hugo-hello-programmer-theme”.

Latihan
    archetypes
    content
        post
            artikel-pertama.md
    data
    layouts
    static
    themes
        hugo-hello-programmer-theme
    config.toml

Apabila belum tahu caranya, silahkan baca tutorial membuat blog hugo.

Upload blog ke github
  • membuat repository dengan nama “latihan-3” di akun github.
  • cara yang sekarang tidak sama dengan cara sebelumnya dengan deploy hugo ke github pages karena tidak perlu membuat folder public pun file akan tetap bisa dieksekusi dengan netlify.
  • kemudian upload folder blog di komputer lokal ke repo github

        git init
        git add .
        git commit -m "upload latihan"
        git remote add origin https://github.com/penakode/latihan-3.git
        git push -u origin master
    
  • tampilan setelah berhasil upload ke github

    tampilan-blog-hugo-di-github

Menyiapkan akun netlify

Kali ini, kita tidak menggunakan fasilitas github pages, akan tetapi kita hanya menyimpan file di repo github tetapi menggunakan fasilitas layanan dari netlify untuk bisa membuat blog atau website kita online.

  • Buka situs netlify dengan membuka app.netify.com

    tampilan-home-netlify

  • Karena saya sudah punya akun github, maka saya akan login menggunakan akun github.

  • Setelah login pilih > New Site

    tampilan-new-site-netlify

  • Untuk source, saya menggunakan repo dari github, kemudian pilih > configure netlify on github.

    tampilan-new-site-netlify

  • izinkan netlify untuk mengakses repository github

    Ada 2 pilihan akses:
    1. All repositories (akses netlify ke semua repo github)
    2. Only select repositories (akses netlify hanya untuk repo yang diizinkan saja)
    

    Silahkan pilih sesuai keinginan kamu ya.

  • Setelah akun github terhubung ke netlify, selanjutnya memilih nama repository “latihan-3”

  • Kemudian setting sesuai gambar dibawah ini

    tampilan-new-site-netlify

  • Pilih “Deploy Site”

  • Jika sudah selesai proses deployed, maka akan tampil seperti gambar dibawah ini

    tampilan-new-site-netlify

  • Jika Berhasil, maka site baru sudah bisa diakses secara online.

    tampilan-new-site-netlify

Penutup

Alamat url yang dihasilkan dari netlify masih berbentuk alamat yang masih susah diingat, jadi tinggal diganti aja alamat sub domain dari netlify nya.