Membuat Fungsi Dalam Template Handlebars Node JS

Posted on

cara merancang logika baru di tema express hbs – Selamat datang di artikel Referensi Coding kali ini! Artikel ini akan membahas mengenai pemrograman web dengan server node js. Terkhususnya, artikel ini akan memberikan solusi bagi masalah yang muncul ketika menggunakan package express-handlebars bagi sisi frontend web.

Apa itu express handlebars?
Express Handlebars lazim disebut pun HBS, yaitu package node js yang mempermudah setiap web developer bagi mengirim data dari backend (server) ke frontend (client). Templating di pada file HBS hampir sama dengan templating di blade framework laravel.

Berikut ini contoh dari halaman HBS


Contoh Halaman HBS

Cara kerja dari HBS yaitu selaku berikut. Seluruh logika (function) yang ingin ditampilkan di halaman web dibungkus pada sebuah object json. Kemudian HBS tinggal memanggil data tersebut dengan kurung kurawal seperti ini {{ }} dimana didalamnya berisi key json yang berisi function yang telah dikerjakan sebelumnya diserver.

Baca Pun: Cara Mengamankan HTTP Request Express Node

Dengan cara kerja seperti ini, sepertinya sulit bagi merancang variabel baru atau logika baru di tema hbs. Tetapi tenang, artikel ini akan menjelaskan bagaimana solusinya.

HBS Helper
Solusinya yaitu dengan menggunakan Helper. Helper function tambahan kita sendiri yang dapat ditampilkan di tema HBS. Dengan helper ini pun kita dapat mengubah return dari function bawaan express handlebars.

Berikut ini contoh pengaplikasian HBS helper di Node JS.

SERVER

res.render('/',{
        helpers:{
          aku_sebuah_function: function(status,msg){
            if(status === '1') return msg
          }
        }
      })

kemudian cara menampilkan helper yang telah dikerjakan yaitu seperti berikut.

CLIENT

<div>{{aku_sebuah_function 1 'Hanya Tampil Jikalau Statusnya 1'}}</div>

Jikalau biasanya format function seperti ini:

function nama(parameter,parameter_lain)

tetapi di tema HBS, bagi menampilkan function dari helper lumayan seperti ini:

{{nama parameter parameter_lain}}

Oke, demikian artikel kali ini mengenai cara membuat logika atau function baru didalam template hbs express node js. Semoga artikel ini bermanfaat! Terima kasih!

(Visited 51 times, 1 visits today)

Leave a Reply

Your email address will not be published. Required fields are marked *