Arsip Tag: Javascript Framework

Cappucinno Framework, Aplikasi Web dengan rasa Desktop

Selamat datang hari senin 🙂

Beberapa pekan lalu ada tugas untuk matakuliah DataMining, dan pemrogramannya tidak boleh menggunakan PHP. Hmm, padahal saya sudah cukup terbiasa dengan itu. Solusinya mungkin Java, Web Java, atau apapun lah… Kemudian saya riset, menemukan SproutCore dan Cappucinno, lalu penelitian dimulai.

Cappucinno Web Framework, itu sebutannya. Mengusung bahasa yang baru dan aneh buat saya, turunan dari Javascript, Objective-J. Sintaksnya mirip-mirip dengan Objective-C, dengan maksud bukan untuk meniru Objective-C, tapi untuk menambah Abstraction Layer pada Javascript dan programmernya. Karena turunan dari Javascript, jadi Objective-J bisa menjalankan script Javascript apapun, tapi agar lebih fleksibel (tidak bertabrakan dengan reserved words milik Javascript), maka sintaksnya dirombak total jadi mirip Objective-C. Sayangnya saya bukan programmer asal MacOS, saya bermula dengan Windows, dan sekarang saya di Linux~rasa Ubuntu. Jadi perlu extra efforts untuk mempelajari bahasa asing ini…

Hasil Riset

Naah, dari beberapa pekan itu, kurang lebih 2 pekan saya sudah mulai menyesuaikan diri dengan Objective-J. Ini beberapa hal yang saya dapat.

Dibandingkan dengan sproutcore, yang harus menggunakan Ruby gem untuk menginstallnya, Cappucinno terhitung lebih praktis, tinggal download di halaman utama, 5.3mb versi 0.8.1.

Disitu disertakan API Documentation, NewApplication, yang aplikasi Hello World yang siap diotak-atik, juga bootstrap.sh yang dapat dijalankan di shell untuk menginstall cappucinno tools (perlengkapan bagi para programmer yang serius :D)

Struktur Cappucinno Starter

Tapi jangan khawatir, tanpa cappucinno tools-pun ini sudah dapat dijalankan, langsung lewat web-browser. Silahkan gunakan Firefox untuk ke direktori file (Tempat Cappucinno Starter)/NewApplication/index.php, atau dengan praktis drag file tersebut, dan drop di Firefox.

Aplikasi HelloWorld bawaan, NewApplication

tanpa disentuh-pun aplikasi ini sudah jalan.

Catatan: Untuk Google Chrome, aplikasi tidak akan berjalan dengan baik tanpa disimpan di web server, hal ini dikarenakan Chrome hanya mau menerima XmlHttpRequest dari web saja, tidak dari file.

Editor

Untuk kemudian mengubah alur program, di direktori yang sama terdapat file AppController.j, file ini yang dapat kita edit, menggunakan TextMate di Mac, Notepad++ di Windows, atau dengan rasa Linux, saya gunakan Gedit. Memang Gedit tidak begitu bagus untuk Objective-J, tapi tak apa lah (baca:bahasa baru).

Untuk langsung melihat apa yang bisa kita ubah, kita cek isi AppController.j


 

/*
 * AppController.j
 * NewApplication
 *
 * Created by You on April 9, 2010.
 * Copyright 2010, Your Company All rights reserved.
 */

@import

@implementation AppController : CPObject
 {
 }

- (void)applicationDidFinishLaunching:(CPNotification)aNotification
 {
 var theWindow = [[CPWindow alloc] initWithContentRect:CGRectMakeZero() styleMask:CPBorderlessBridgeWindowMask],
 contentView = [theWindow contentView];

var label = [[CPTextField alloc] initWithFrame:CGRectMakeZero()];

[label setStringValue:@"Hello World!"];
 [label setFont:[CPFont boldSystemFontOfSize:24.0]];

[label sizeToFit];

[label setAutoresizingMask:CPViewMinXMargin | CPViewMaxXMargin | CPViewMinYMargin | CPViewMaxYMargin];
 [label setCenter:[contentView center]];

[contentView addSubview:label];

[theWindow orderFront:self];

// Uncomment the following line to turn on the standard menu bar.
 //[CPMenu setMenuBarVisible:YES];
 }

@end
 

dan ubah bagian

 ...
 [label setStringValue:@"Hello World!"];
 ...
 

menjadi

 ...
 [label setStringValue:@"Hai Om!"];
 ...
 

Apa yang kemudian tampil?, Ya!, teks berubah menjadi Hai Om!, ini perubahan paling sederhana yang bisa dilakukan, dan lihat hasilnya 😀

Setelah Hello World diubah :)

Kesimpulan

Untuk pengenalan mungkin sekian dulu, pembuatan aplikasinya akan saya kenalkan nanti, setelah beberapa riset kedepan 🙂

Lanjutkan sendiri

untuk melanjutkan sendiri, saya sarankan untuk melihat daftar tutorialnya di

http://cappuccino.org/learn/tutorials/

http://cappuccinocasts.com/

http://www.nice-panorama.com/Programmation/cappuccino/

 

 

Iklan

Sekilas Mengenai Dojo Toolkit

Dojo Toolkit Logo
Dijit Theme Tester

Penggugah Selera

Siapa yang sekarang tidak tahu bahwa perkembangan web sangatlah pesat, juga bagian-bagiannya, CSS sudah sampai ke CSS3, HTML sudah HTML5, juga Javascript masing-masing dikembangan sesuai dengan kebutuhan manusia, yang ringan namun esensi, seperti membaca koran, ensiklopedi, bahkan sampai kehidupan sosial kini bisa dilakukan lewat Internet.

Semuanya dapat dilakukan dengan teknologi web 2.0, yang diantaranya Javascript untuk meningkatkan Pengalaman / Kesan Penggunaan (UX ~ User eXperience)

Javascript memang sudah lama berkembang, setelah dianggap anak tiri dalam dunia pemrograman sebelum tahun 2000, akhirnya penggunaan Javascript kembali dilirik setelah Google mempopulerkan AJAX (Asynchronous Javascript and XML) di fitur Google Suggest-nya.

Awal dari Dojo Toolkit

Beberapa tahun setelah kebangkitan Javascript, 25 April 2004, ditulislah kode yang kemudian menjadi cikal bakal Dojo Toolkit, sebuah Javascript Framework yang menyediakan penyederhanaan fungsi scripting dengan javascript sampai ke pembuatan RIA (Rich Internet Application) yang kompleks.

Lisensi dari Dojo Toolkit yang memungkinkan agar komunitas dapat berkontribusi dan dimasukkan kedalam versi resmi menyebabkan Dojo Toolkit menjadi kesatuan yang utuh, yang bisa dikatakan unggul pada bidangnya.

Paket modular sangat membantu para web developer untuk membuat web yang interaktif dengan struktur yang mudah dimengerti. Ditambah lagi sebuah kesatuan antara Javascript library, dengan Widgeting system memperkokoh posisi Dojo Toolkit sebagai Javascript Framework sebenarnya.

Penyederhanaan Javascript

Selain Dojo Toolkit, mungkin kita pernah mendengar ataupun bahkan mencoba jQuery, mootools, prototype, scriptaculous, ExtJS (sekarang Sencha), YUI, dll. Yang kesemuanya adalah mengenai javascript. Tapi masing-masing memiliki kelebihan dan kekurangan dalam satu sisi dan lainnya.

Pada penggunaan praktis dan cepat jQuery terhitung paling populer, namun yang disediakan oleh jQuery ini terbatas pada fungsi DOM, Ajax, animasi, dan fungsi dasar lainnya, untuk widget harus menggunakan jQuery UI, sedangkan fungsi lainnya terdapat banyak plugin yang tersebar di penjuru internet.

Mootools, prototype, scriptaculous, berperan kurang lebih sama dengan jQuery, menyediakan fungsi dasar DOM, Ajax, animasi dan beberapa fungsi dasar lain, dan bisa diberikan fungsi lain dengan menyisipkan plugin yang tersebar di internet.

ExtJS (Sencha) dan YUI bisa dikatakan lebih mirip dengan Dojo Toolkit, menyediakan fungsi-fungsi dasar, juga menyediakan widgeting system.

Dojo Toolkit di Dunia Nyata

Didukung penuh oleh SitePoint dalam pengembangannya, juga disisipkan dalam Zend Framework sebagai library javascript, berarti kemampuannya sudah tidak bisa dianggap remeh lagi. Digunakan juga oleh IBM, AOL untuk bagian dari infrastuktur mereka.

Dilihat dari jumlah pengguna yang banyak dari perusahaan menengah keatas, maka Dojo Toolkit cocok bila dikatakan sebagai Ajax Framework untuk enterprise.

Dojo Toolkit untuk Mobile

Dengan terus berkembangnya teknologi web ini, juga tren yang mulai mengarah ke mobile device, Dojo Toolkit semenjak versi 1.5 menyertakan dojox.mobile agar pengguna mobile device merasa betah dan nyaman dalam menggunakan aplikasi yang dibangun dengan Dojo Toolkit. Meskipun dojox.mobile baru lahir, tapi dengan kekuatan komunitas, dan konsistensi paket bundel, Dojo Toolkit tidak bisa dianggap remeh.

Mari Mulai

Memanggil Dojo Toolkit bisa dikatakan sangatlah mudah untuk komputer yang terkoneksi ke internet, cukup dengan satu baris kode saja di file HTML.

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js"></script>

Dengan memanggil dari sumber CDN Google, sekarang fungsi Dojo sudah bisa digunakan.

<script type="text/javascript">
dojo.ready(function(){
    // disini fungsi dojo bisa dipanggil
});
</script>

tapi jika anda tidak terkoneksi ke internet, yang bisa dilakukan adalah mendownload terlebih dahulu paket Dojo Toolkit di dojotoolkit.com, dan panggil dalam baris kode berikut

<script src="<i>path_ke_dojo</i>/dojo.js"></script>

Dengan begitu, dojo sudah bisa digunakan, tapi mengingat bahwa dojo digunakan untuk empowering the web, alangkah baiknya jika path tersebut mengarah ke http web server (Apache, Nginx, IIS).

Ke Mana Lagi Sekarang

Jika anda masih belum puas tentang awal ini, sumber-sumber dibawah ini juga bisa digunakan sebagai referensi lanjutan.

Sebenarnya anda tidak perlu mencari lagi referensi lain, karena setiap pekannya saya akan jelaskan satu dan lain hal tentang Dojo Toolkit di blog ini.