Arsip mwmag[Files]  [Up]© 2002 PT Masterweb Media

Membuat Situs Web dengan make dan m4

  1. Pendahuluan
  2. m4, Macro Processor
  3. Menggunakan m4
  4. Perintah m4
  5. Membuat makro m4
  6. make
  7. Dasar-Dasar make
  8. makefile
  9. Struktur makefile
  10. Contoh makefile
  11. Komentar
  12. Target boneka
  13. Variabel
  14. Makefile untuk m4
  15. Penutup
  16. Rujukan

Files

  1. index.m4
  2. Makefile
  3. stdlib.m4

 

Oleh Tedi Heriyanto

Dalam membuat situs web, terkadang kita mengalami kesulitan mendapatkan halaman yang konsisten baik warna, header/footer, maupun strukturnya. Terlebih lagi bila situs kita terdiri dari banyak halaman. Artikel ini mencoba mengemukakan sebuah teknik sederhana membuat situs yang konsisten dengan menggunakan dua buah tool yang ada pada sistem operasi GNU/Linux yaitu m4 dan make. Tool ini sering dikenal sebagai tool programer dalam membuild aplikasi. Namun ternyata dapat pula digunakan dalam membantu kita membuat dan memaintain situs web.

Pendahuluan

Beberapa waktu lalu, saat melakukan update situs pribadi, saya mengalami kesulitan karena situs tersebut awalnya tidak dirancang agar memiliki konsistensi tampilan dan struktur. Antara halaman satu dengan lainnya tampak tidak ada hubungan. Selain itu, saya pun ingin menyertakan informasi mengenai tanggal update pada halaman-halamannya. Hal ini sulit dilakukan dengan menggunakan fasilitas Insert Date atau semacamnya yang ada pada editor HTML. Selain itu bila harus melakukan perintah Insert Date ke semua halaman (saat itu berjumlah sekitar sepuluh), saya malas. Saya ingin sebuah cara yang secara otomatis dapat menambahkan informasi tersebut pada halaman-halaman situs saat diupdate.

Setelah mencari-cari di Internet, saya menemukan dua buah artikel yang membahas cara pembuatan situs sederhana menggunakan sebuah program bernama m4. Kemudian saya membaca keduanya dan mulai mengadaptasi tekniknya untuk pembuatan ulang situs saya. Ternyata hasilnya tidak mengecewakan dan memenuhi keinginan. Artikel ini selanjutnya akan menceritakan pengalaman saya tersebut.

m4, Macro Processor

m4 adalah sebuah prosesor makro, secara sederhana ia akan mengekspansikan sebuah makro saat diproses. Misalkan, kita mempunyai sebuah makro yang akan mencetak tulisan “Hallo”, kita sebut saja makro ini CetakHallo. Lalu kita menyertakan makro ini ke dalam sebuah file teks, saat file tersebut diproses maka makro CetakHallo akan diekspansi untuk mencetak tulisan “Hallo”.

m4 hanya dapat digunakan dalam file-file teks. Kita tahu bahwa sebuah file HTML tidak lain adalah file teks biasa yang berisikan tag-tag khusus untuk memformat file itu dalam format HTML, karenanya m4 dapat pula digunakan dalam membuat file HTML.

Dalam manual m4 dikatakan bahwa m4 dapat menyebabkan kecanduan pada beberapa orang. Yaitu pertama-tama mereka menggunakan m4 untuk masalah-masalah yang sederhana, kemudian mereka menggunakannya untuk masalah-masalah yang semakin kompleks. Bahwa dikatakan “Beware that m4 may be dangerous for the health of compulsive programmers.

Menggunakan m4

Dalam membuat situs web, saya tidak membuat file-file .html, melainkan file-file .m4, yang nanti akan diproses untuk menghasilkan file-file .html. Berikut ini adalah contoh sebuah file .m4 bernama index.m4. Perhatikan bahwa kutip di m4 sedikit berbeda. Anda harus membuka dengan kutip terbalik, dan diakhiri kutip tunggal.

include(`stdlib.m4')
_BEGIN(`Tedi Heriyanto Page')
_BGCOLOR
_NOSCRIPT
_NAV_BAR
<br>
<!-- The Homepage body -->
<center>
<table border="1" bgcolor="#cccccc" width="640">
<tr>
<td>
<p>
_TITLE(`Welcome/Bienvenue/Wilcomen')
_QUOTE
<p>
Hi, welcome to my homepage. My name is Tedi Heriyanto. I am currently trying
to finish my undergraduate project at Faculty of Economics.

Terlihat bahwa file di atas merupakan file .html biasa, dengan beberapa buah makro di dalamnya. Di sini saya menggunakan huruf kapital dan diawali dengan karakter garis bawah, _, untuk menandakan bahwa kata tersebut adalah sebuah makro.

File ini kemudian diproses dengan perintah m4 untuk menghasilkan file index.html:

$ m4 < index.m4 > index.html

Perintah m4

Berikut ini adalah beberapa buah perintah m4 yang saya gunakan dalam file .m4 saya. Pertama, include untuk menyertakan sebuah file ke dalam HTML Anda. Lalu define, mendefinisikan sebuah variabel m4. dnl menyatakan komentar. esyscmd mengeksekusi perintah Linux dan mengambil keluarannya. divert, digunakan untuk mengeluarkan output ke suatu tempat. Dapat digunakan untuk menghilangkan output yang tidak diinginkan, bila diberikan divert(angka). Jika tidak ada angka, diasumsikan adalah nol yang berarti tidak ada diversi.

Membuat makro m4

Jika kita ingin menaruh sesuatu di beberapa halaman web, maka sebaiknya kita buatkan makronya saja agar mudah. Untuk membuat makro, digunakan perintah define. Sebagai contoh kita ingin mendefinisikan alamat email kita, perintah adalah:

define(`_EMAIL_ADDRESS',tedi_h(at)gmx(dot)net)

Sedangkan bila kita menginginkan makro untuk mendefinisikan tanggal update, dapat diberikan perintah sebagai berikut:

define(`_UPDATE', '$ Last update: esyscmd(date +"%d-%m-%Y") $')

Untuk makro yang membutuhkan argumen tambahan, misalnya makro untuk mencetak “mailto”, pendefinisiannya adalah sebagai berikut:

define('_MAILTO',<A HREF="mailto:$1">$2</A>)

Makro-makro yang telah kita buat, sebaiknya dikumpulkan dalam file khusus, misalnya saja bernama stdlib.m4. Kemudian bila ingin menggunakannya, dalam file .m4 untuk halaman web yang kita buat, kita berikan perintah include(`stdlib.m4'). Makro yang kita inginkan akan dipanggil.

Contohnya file untuk halaman web kita adalah sebagai berikut:

include(`stdlib.m4')
<html>
<head><title>My Web Site</title></head>
<body>
<center>
<h1>Welcome</h1>
</center>
<hr>
Email me at: _MAILTO(_EMAIL_ADDRESS,_EMAIL_ADDRESS)
<br>
_UPDATE
</body>
</html>

Proseslah file tersebut dengan perintah seperti yang telah diterangkan. Jika Anda melakukan perubahan terhadap file .m4, lakukanlah proses tersebut kembali, sehingga dihasilkan file .html yang mencerminkan file .m4 terbaru.

Isi stdlib.m4 yang saya gunakan adalah sebagai berikut:

divert(-1)
define(`_EMAIL_ADDRESS',tedi_h(at)gmx(dot)net)
define(`_MAILTO',<A HREF="mailto:$1">$2</A>)
define(`_EMAILME',_MAILTO(_EMAIL_ADDRESS,$1))
define(`_CODEQUOTE',<BLOCKQUOTE><PRE><CODE>$1</CODE></PRE></BLOCKQUOTE>)
define(`_WEBMASTER', 'tedi')
define(`_UPDATE', `$ Last update: esyscmd(date +"%d-%m-%Y") $')
 
dnl Logical markup:
define(`_EM',<EM>$1</EM>)
define(`_STRONG',<STRONG>$1</STRONG>)
define(`_CITE',<CITE>$1</CITE>)
define(`_PRE',<BLOCKQUOTE><PRE>$1</PRE></BLOCKQUOTE>)
define(`_CODE',<CODE>$1</CODE>)`
 
dnl Physical markup:
define(`_BOLD',<B>$1</B>)
define(`_ITALICS',<I>$1</I>)
define(`_STRIKE',<S>$1</S>)
define(`_SUBSCRIPT',<SUB>$1</SUB>)
define(`_SUPERSCRIPT',<SUP>$1</SUP>)
define(`_COURIER',<TT>$1</TT>)
define(`_UNDERLINE',<U>$1</U>)
define(`_SMALL',<SMALL>$1</SMALL>)
define(`_BIG',<BIG>$1</BIG>)
define(`_CENTER',<CENTER>$1</CENTER>)
define(`_IMAGE', <P><CENTER><IMG SRC="$1" ALT="[$1]" WIDTH=$2 HEIGHT=$3></CENTER><P>)
 
define(`_HEAD1', <H2>$1</H2>)
define(`_HEAD2', <H3>$1</H3>)
define(`_LINK', <a href="$1">$2</a>)
define(`_TITLE', <center><h1>$1</h1></center>)
 
divert

File stdlib.m4 bisa diambil dari situs majalah di mwmag.com/issue/07/content/pemrograman-web_dengan_make_m4/file/.

Catatan: Makro yang anda definisikan dapat berupa semua tag HTML, namun perhatikan bahwa m4 akan memberikan pesan kesalahan bila dalam definisi tersebut anda menggunakan simbol koma (,), karena simbol tersebut digunakan untuk menyatakan akhir parameter definisi makro.

Definisi berikut akan menyebabkan m4 mengeluh:

define(`_BLURB', 
<center>
<h1>Hi, My Name is Blurb</h1>
</center>
)

Jadi saran saya, hindarilah tanda koma dalam definisi makro anda.

make

Pada bagian sebelumnya diterangkan bagaimana memroses sebuah file .m4 menjadi file .html. Proses tersebut hanya berlaku untuk satu buah file saja, bagaimana bila Anda ingin menghasilkan banyak file dan tidak ingin berulang-ulang mengetikkan perintah m4? Salah satu solusinya adalah dengan menggunakan make.

Beberapa buah alasan mengapa saya memilih menggunakan make. Pertama, make hanya memroses file-file yang telah mengalami perubahan saja, sehingga dapat menghemat waktu tanpa perlu memroses semua file, termasuk yang tidak berubah. Kedua, dengan make saya dapat membuat beberapa fasilitas lainnya, misalnya mengkompresi file-file .html yang dihasilkan untuk digunakan sebagai backup.

Dasar-Dasar make

Misalkan saja Anda sedang membuat sebuah program bernama foo, yang terdiri dari lima buah file header, yaitu 1.h hingga 5.h, serta enam buah file sumber 1.c hingga 6.c dan sebuah main.cpp. Anda lalu mengedit file 1.c. Untuk membuat kembali aplikasi, Anda perlu menghasilkan kembali 1.o lalu melink semuanya menjadi sebuah binary. Lalu kemudian Anda mengedit 3.h, yang diinclude oleh 1.c, 2.c, dan 5.c. Kini Anda perlu mengkompile ulang ketiga file .c tersebut lalu melakukan linking lagi. Kemudian Anda menambahkan direktori program sumber baru, modul1/ yang menginclude berbagai file .h lain. Saat ada file .c atau .h lagi yang telah Anda ubah, bagaimana caranya menghasilkan binary yang updated? Daripada bingung-bingung, kompile lagi saja semua bukan? Sayangnya, cara ini tidak efisien dan membosankan, apalagi jika proyek Anda terdiri dari ratusan file sementara komputer Anda bukan quad Xeon dengan SCSI RAID 10K RPM.

make adalah utilitas yang diciptakan salah satunya untuk menyelesaika masalah di atas: mengecek saling ketergantungan antarfile dan menjalankan program secara kondisional menurut ketergantungan tersebut. Jadi misalkan 5.o bergantung pada 1.h, 2.h, 3.h dan 5.c, maka perintah kompilasi 5.c menjadi 5.o bisa dilakukan hanya jika salah satu dari empat file telah berubah menjadi lebih baru tanggal modifikasinya.

makefile

Perintah make tidak begitu saja secara ajaib dapat mengetahui saling ketergantungan antarprogram. Kita harus mendefinisikan daftar ketergantungan ini dalam sebuah file konfigurasi/skrip, yang lazim disebut makefile. Nama file default yang dicari make memang bernama makefile atau Makefile. Jika makefile Anda bernama lain, maka perlu disebutkan di perintah make dengan opsi -f.

Struktur makefile

Sebuah makefile terdiri dari bagian target, ketergantungan, dan perintah. Target adalah nama file yang ingin dibuat. Ketergantungan berisikan daftar nama file di mana sebuah target yang bersangkutan bergantung padanya. Sementara perintah mendefinisikan apa-apa saja yang akan dilaksanakan seandainya ketergantungan tidak terpenuhi. Berikut sintaks makefile:

target1: ketergantungan1 ...
perintah
perintah
...
 
target2: ketergantungan2 ...
perintah
perintah
...

Yang perlu diperhatikan, make mewajibkan baris-baris perintah diawali dengan karakter Tab. Bukan deretan spasi, melainkan Tab. Jika tidak, make akan mengeluh seperti ini:

Makefile:xxx: *** missing separator.  Stop.

Contoh makefile

Berikut ini contoh sebuah makefile yang amat sederhana:

client: conn.o
g++ client.cpp conn.o -o client
conn.o: conn.cpp conn.h
g++ -c conn.cpp -o conn.o

Makefile tersebut dapat dibaca seperti ini: “(baris 3 & 4): Untuk membuat conn.o, diperlukan conn.cpp dan conn.h. Cara membuat conn.o adalah dengan perintah g++ -c conn.cpp -o conn.o. (baris 1 & 2): Sementara untuk membuat client, diperlukan conn.o. Cara membuat client yaitu dengan perintah g++ client.cpp conn.o -o client.” Pertama kali dijalankan, make akan mengeksekusi kedua perintah di atas karena kedua target tidak terpenuhi ketergantungannya (conn.o tidak ada sementara). Setelah make berjalan, file objek bernama conn.o dan file executable bernama client telah tercipta. Jika make dijalankan lagi, kedua perintah kompilasi tidak akan diulangi. Kenapa, karena saat make mengecek dan membandingkan tanggal modifikasi, semua ketergantungan telah terpenuhi (file client lebih baru dari conn.o, dan file conn.o lebih baru dari conn.cpp dan conn.h). Sekarang, andaikata conn.h diubah, lalu kita menjalankan make, apa yang akan terjadi? Target kedua tidak terpenuhi ketergantungannya (conn.o lebih lama dari conn.h) maka conn.o dibuat ulang. Setelah itu, target pertama pun jadi tidak terpenuhi (file conn.o lebih baru dari client) sehingga client dikompile ulang.

Jadi keuntungannya apa? Manakala kita selesai memodifikasi file, cukup jalankan make dan make akan mencari cara agar semua ketergantungan selesai dipenuhi. Tentu saja, apabila salah satu perintah kompilasi gagal (karena ada syntax error misalnya), make akan berhenti di target terakhir yang gagal. Betulkan program sumber yang salah, lalu ketikkan make lagi. Hidup jadi lebih mudah bukan?

make dapat kita perintahkan untuk membuat salah satu target saja. Misalnya:

$ make conn.o

akan membuat target conn.o saja (yang kebetulan akan membuat file objek yang bernama sama dengan nama targetnya, yaitu conn.o). Defaultnya make akan membuat target pertama (pada contoh kita, target bernama client).

Komentar

Untuk memberi komentar di dalam makefile dapat dilakukan dengan memberikan tanda # di awal baris yang ingin dikomentari.

Target boneka

Target boneka adalah nama target yang berupa nama file yang tidak dikenal dan memang tidak dimaksudkan untuk dibuat, melainkan hanya sebagai label target saja. Jika make menjumpai target seperti ini:

target1:
perintah

maka perintah akan selalu dijalankan, karena ketergantungan tidak pernah terpenuhi. Contohnya:

clean:
rm *.o temp

Waktu dijalankan, make mengecek file clean, karena file clean tidak ada maka make akan selalu mencoba menjalankan perintah rm. Tapi andaikata tiba-tiba file clean ada, maka baris target ini tidak akan bekerja lagi seperti yang kita harapkan. Untuk menghindari masalah ini, anda dapat secara eksplisit mendeklarasikan target menjadi boneka, menggunakan target khusus yaitu .PHONY. Berikut ini adalah contohnya:

.PHONY: clean

Setelah hal ini selesai, make clean akan menjalankan perintah-perintah tanpa terganggu adanya file bernama clean.

Variabel

Untuk mendefinisikan sebuah variabel dalam makefile, dapat dilakukan dengan perintah berikut:

$VAR_NAME=isinya

Biasanya nama sebuah variabel diberikan dalam huruf kapital semua. Contoh :

$OBJECTS=main.o test.o

Untuk mengambil isi sebuah variabel, dapat dilakukan dengan cara memberi tanda $ dan nama variabel diapit dalam tanda kurung, contohnya:

$(VAR_NAME)

Dalam makefile dikenal ada dua buah variabel, yaitu variabel recursively expanded dan simply expanded. Pada variabel recursively expanded, make akan terus mengekspansi variabel tersebut, hingga tidak dapat lagi diekspansi, contohnya:

TOPDIR=/home/tedi/project
SRCDIR=$(TOPDIR)/src

Variabel SRCDIR akan diekspansikan dengan terlebih dulu mengekspansikan variabel TOPDIR. Hasil akhirnya adalah /home/tedi/project/src

Namun, variabel recursively expanded ini tidak akan sesuai untuk perintah berikut:

CC = gcc -o
CC = $(CC) -O2

Dengan menggunakan variabel recursively expanded, perintah di atas tidak akan pernah berkesudahan. Oleh karena itu digunakan variabel simply expanded berikut:

CC := gcc –o
CC += $(CC) -O2

Makefile untuk m4

Kita kembali ke permasalahan semula, yaitu mengupdate beberapa file .m4 secara otomatis menggunakan make.

Berikut ini adalah Makefile yang saya gunakan:

DEST = aztecc.html gnu.html index.html links.html linux.html \
lyrics.html projects.html readings.html writings.html
DATE := $(shell date +"%d%m%Y")
 
all : $(DEST)
 
$(DEST): %.html : %.m4
m4 $< > $@
chmod 644 $@
 
.PHONY : backup clean
 
backup:
tar cvzf backup-$(DATE).tar.gz *.ma *.css 2> /dev/null
 
clean:
@rm -rf *~

Yang perlu Anda perhatikan adalah blok:

$(DEST): %.html : %.m4-
m4 $< > $@
chmod 644 $@

Perintah ini berfungsi untuk memproses semua file .m4 yang ada menjadi file-file HTML yang ada di DEST. File-file HTML tersebut kemudian diset modenya menjadi 644. Untuk membuat file-file HTML, perintah yang Anda berikan adalah:

$ make

Mudah sekali bukan?

Penutup

Demikianlah pembahasan singkat tentang sebuah teknik membuat sebuah situs sederhana. Saya berharap bahwa artikel ini dapat menambah wawasan Anda bahwa membuat sebuah situs tidak selalu harus dilakukan editor HTML atau program bantu khusus Web lainnya. Akhir kata, selamat mencoba.

Tedi Heriyanto seorang programer software bebas dan penulis freelance, dapat dihubungi di tedi_h@gmx.net.

Rujukan

Dokumentasi info make (dapat dibaca dengan mengetikkan info make di shell).

Manual m4 (info m4).

mw

[Last-Modified: Wed Aug 14 12:26:16 2002]

Arsip mwmag[Files]  [Up]www.master.web.id/mwmag