Tutorial Meteor Untuk Pemula

Meteor, atau disebut juga MeteorJS, adalah web framework yang sedang naik daun. Ditulis dengan Node.js, Meteor memudahkan kita untuk membuat aplikasi web/ Android/ iOS dengan menggunakan bahasa utama JavaScript.

Lupakan membuat web dengan PHP, ASP, Ruby, atau pemrograman server-side lainnya. Dalam artian bahasa-bahasa tersebut sudah bukan keharusan untuk membuat aplikasi web, karena saat ini penggunaan JavaScript juga diarahkan untuk mengembangkan aplikasi web pada sisi server. Buat sebagian developer web hal ini mungkin masih hal baru, tapi percayalah hal baru ini patut dieksplorasi karena beberapa keuntungan antara lain:

  • Pengembangan aplikasi hanya menggunakan satu bahasa utama yaitu JavaScript.
  • Tren teknologi web mengarah pada pengembangan aplikasi berbasis JavaScript. Hal ini dtandai dengan booming-nya Node.js dan penggunaannya oleh perusahaan-perusahaan besar (LinkedIn, Microsoft, Netflix, PayPal, dan seterusnya).

Tutorial singkat ini akan menjelaskan tahapan instalasi dan penggunaan dasar Meteor.

Langkah 1: Instalasi

Bagi pengguna Unix/Linux dan OS X lakukan download dan instalasi melalui terminal dengan perintah:

Sedangkan untuk pengguna Windows, download dan jalankan installer Meteor di https://install.meteor.com/windows

Dalam artikel ini sistem operasi yang digunakan adalah Windows.

Langkah 2: Membuat Project Baru

Setelah instalasi selesai, secara default kita tidak perlu melakukan konfigurasi apa pun, semua yang diperlukan untuk membuat aplikasi sudah tersedia termasuk database MongoDB. Untuk membuat project/ aplikasi baru, jalankan Command Prompt dan ketik:

Penjelasan perbaris:

meteor create webku -> membuat aplikasi baru dengan nama webku, Meteor akan membuat folder webku.
cd webku -> masuk ke dalam folder webku
meteor -> menjalankan server meteor

Selanjutnya buka browser dan ketikkan alamat:

Dan aplikasi web pertama kita sudah selesai, seperti pada screenshot di bawah:

app-meteor

Langkah 3: Memahami Kode Program

Lihat pada folder webku, terdapat 3 file yaitu:

webku.css
webku.html
webku.js

Jika kita membuka file-file tersebut pada text editor, file webku.css tidak berisi CSS apa pun, webku.html berisi template dengan format HTML, dan webku.js adalah kode JavaScript. Cukup mudah memahami kodenya, mari terlebih dahulu isi webku.html:

Sebagian besar kode di atas pasti dipahami  dengan mudah bagi programmer website yang sering menggunakan HTML. Bagian penting di sini adalah template “hello”. Template ini berisi tombol Click Me dan keterangan berapa kali tombol diklik, nilainya disimpan pada variabel {{counter}}. Untuk memahami variabel counter ini, mari kita lihat file webku.js:

Pada kode di atas kita akan mempelajari beberapa bagian penting Meteor yaitu:

  • Session, terlihat pada kode di atas didefinisikan Session bernama counter yang di set dengan nilai awal = 0.
  • Helper, berisi function-function yang berhubungan dengan template. Pada contoh di atas terdapat function counter yang akan mengembalikan nilai session counter pada template “hello”.
  • Event, berisi function yang akan dijalankan pada saat terjadi event tertentu. Pada kode di atas, function dijalankan saat tombol diklik, yang dilakukan function tersebut adalah menambahkan nilai session counter setiap kali tombol diklik.

Demikian tutorial awal dan singkat ini, semoga memberikan sedikit clue apakah Meteor itu. Selamat bertemu di tutorial selanjutnya (yang belum tau kapan hehehehe).

(Visited 1,670 times, 2 visits today)

Leave a Reply