Introduction to Adobe Flex

Leave a comment

March 25, 2013 by andez

Adobe Flex? Loh bukan nya sekarang namanya udah Apache Flex? Iya bener… Cuma pengguna flex ini biasanya masih belum “ngeh” dengan perubahan nama tersebut (CMIIW). Nanti saya akan sebutkan kapan adobe flex berubah nama menjadi apache flex. Adobe Flex adalah teknologi dari adobe berupa framework dan Software Development Kit (SDK) untuk mengembangkan Rich Internet Application (RIA). Namun flex juga bisa digunakan untuk pengembangan aplikasi berbasis dekstop dan mobile. Aplikasi flex itu “must be running in adobe flash polayer” (Flash Player in desktop browser, Adobe AIR for desktop, atau Adobe AIR for mobile devices). Maksudnya adalah aplikasi flex membutuhkan semacam plugin yaitu flash builder untuk menjalankan nya. Sebagai contoh jika ada aplikasi web yang dibangun menggunakan flex, maka browser tempat kita mengakses aplikasi tsb. harus sudah terinstall plugin flash player.

Perkembangan Adobe Flex, hanya dibahas untuk versi-versi utama saja (major version)

Di awal tahun 2000-an  perkembangan web (yang pesat) mengalami beberapa masalah (atau concern yang perlu diperhatikan) seperti kekurangan support browser pada JavaScript dan Cascading Style Sheets (CSS) atau nama beken nya browser interoperability, protokol HTTP yang stateless yang menyebabkan aplikasi terkesan tidak “responsif” dan juga batasan-batasan pada HTML.  Menyikapi desain dari HTTP sebagai protokel yang stataless maka di pertengahan dekade tahun 2000 berkembanglah AJAX. AJAX itu sendiri menurut saya sebenarnya adalah cikal bakal dari konsep apa itu sebuah Rich Internet Application.

Masalah utama pengembangan aplikasi web sebenarnya ya itu-itu saja. Tampilan harus bagus, cepat, responsif, ringan dan mudah dikembangkan / dimaintenance. Keinginan client / user tentu ga jauh-jauh dari hal tadi bukan? 😀 Bayangkan di tahun 2000an awal pengembangan web terkesan sangat kaku. Metode yang dipakai : HTML – Server Side Script melalui protokel HTTP(stateless). Server side script yang populer yaitu PHP, JSP, ASP dan CGI. Javascritp & CSS juga belom terlalu diperhatikan pengembangannya sehingga membuat aplikasi web yang ada dibangun dengan agak “susah payah”.  Note: Di awal dekade 2000an saya belom mengembangkan aplikasi web, jadi ini murni asumsi dan knowledge dari beberapa testimoni di internet.

Akhirnya pada tahun 2004 Macromedia merilis flex versi 1.0 dengan branded nama“Macromedia Flex“. Tujuan awal dikembangkan flex ini tentu ingin  memberikan kemudahan membuat aplikasi berbasis web dan yang paling penting sebagai penyedia framework pembuat rich internet application. Flex didesain dengan menawarkan beberapa fitur unggulannya seperti :

– Dapat diintegrasikan dengan teknologi sever side seperti j2ee, php dan cold fusion. Cold Fusion adalah server side technology yang dikembangkan oleh adobe sebagai pairing technology aplikasi flex. Cold Fusion adalah alternatif selain J2EE dan PHP. Sekarang ini flex juga bisa mengakses “service” dari teknologi .NET seperti asp.netwcf dsb.

– Flex dapat menyembatani masalah browser support, menyediakan banyak komponen siap pakai untuk UI aplkasi seperti Button, Grid, Panel, ComboBox, TextBox dll.

– Tampilan flex menjadi mirip aplikasi desktop, komponennya ringan dijalankan, bisa dibuatkan animasi yang kompleks maupun UI yang kompleks (seperti  grafik, chart map)

Namun versi 1.0 ini sebenarnya hanyalah  seperti framework pembuat aplikasi flash. Ya flash. Kita biasa nya membuat flash untuk simple aplikasi yang membutuhkan, game dll. Dengan flash kita bisa membuat animasi dan aplikasi yang menarik. Di sini macromedia blom banyak menyediakan class-class atau library pendukung maupun utilitas yang mumpuni untuk membuat aplikasi  RIA (dengan skala enterprise). Untuk script yang digunakan masih sama dengan script yang ada di adobe flash (action script). Fitur-fitur yang saya sebutkan diatas sebenarnya baru ada di flex versi 2.0

Logo Adobe FlexSeiring berjalannya waktu, flex akhirnya merilis versi kedua (tahun nya saya lupa :D). Ada beberapa perubahan / improvisasi yang signifikan di sini. Yaitu dengan ada nya Flex Data Services, IDE yg didesani khusus untuk flex: Adobe Flex Builder dan beberapa komponen untuk chart (Flex Charting Components library). Flex versi 2 juga mengenalkan script baru dengan nama Action Script 3 (AS3). AS3 didesain sebagai Object Oriented Language dan cocok untuk mengikuti paradigma teknologi script / language di sisi server. Pada saat berjalan nya versi inilah ADOBE mengakusisi flex sehingga flex diberikan nama baru yaitu “Adobe Flex”. Dengan komponen-komponen flex  dan as3 kita bisa membuat aplikasi web dengan cepat namun interaktif dengan kompleksitas skala menengah ke atas.

Tahun 2007 versi ke 3 dirilis dengan menekankan pada improvisasi dari Flex Builder. Flex Builder dibuat untuk menangani file MXML and ActionScript. MXML adalah ekstensi file untuk view / tampilan di flex. Jadi UI yang kita desain ini kita buat di file MXML. Untuk logic / bisnis proses aplikasi kita buat di file AS. Pada MXML juga bisa kita berikan script misal untuk inisialisasi form, validasi form, event handler dari masing-masing komponen dsb. Tambahan, Flex Builder  adalah WYSIWYG editor. Kita bisa mendesain UI kemudian langsung melihat tampilan jadinya. Flex Builder juga dilengkapi dengan fitur debugging dan performance analysis.

Adobe Flex akhirnya dirilis lagi dengan menaikkan versi nya menjadi 4.0 ada 2010. Point penting yang ada pada versi ini adalah sbb:

  • Design in Mind: The framework has been designed for continuous collaboration between designers and developers.
  • Accelerated Development: Be able to take application development from conception to reality quickly.
  • Horizontal Platform Improvements: Compiler performance, language enhancements, BiDirectional components, enhanced text (Flex 4 includes the new Text Layout Framework).
  • Full Support for Adobe Flash Player 10 and above.
  • Broadening Horizons: Finding ways to make a framework lighter, supporting more deployment runtimes, runtime MXML.
  • Simpler skinning than the previous versions.
  • Integration with Adobe Flash Catalyst.
  • Custom templates

Maaf untuk mempersingkat tulisan, saya tidak menjelaskan satu-satu dari point di atas :D. Untuk adobe flex builder juga berganti nama menjadi Adobe Flash Builder. Hal signifikan yang ada di flash builder ini yaitu : Data-centric development (yaitu teknologi yang membuat kita dengan mudah & cepat untuk mengkoneksikan form / komponen flex dengan data yang berada di sisi server (Cold Fusion, java, .NET, php).

Logo Apache FlexTahun 2012 kemarin saat versi telah mencapai 4.8, flex berpindah naungan (lagi) dari adobe yg telah membesarkannya selama ini ke Apache. Namanya pun ikut berubah menjadi Apache Flex. Ini memang lumrah di dalam dunia Teknologi Informasi, sebuah teknologi/spesifikasi bisa berpindah-pindah ke beberapa naungan perusahaan. Jadi selain link di adobe kita juga perlu membookmark link diapache untuk situs resmi dari Flex. Oh ya, sekilas saya mau mention Apache ini memang top markotop yah, banyak menaungi projek atau teknologi besar dan open source[1]. Itulah sekilas pembahasan perkembangan dari Adobe Flex, diharapkan dapat menambah wawasan kita dan yang paling penting supaya kita tidak salah kaprah lagi (misalkan) mengartikan flex itu sama dengan flash :D.

Ok, lanjut ke pembahasan bagaimana mengembangankan aplikasi flex. Namun di post kali ini saya tidak memberikan guideline instalasi maupun setup flex dari awal (biar sesuai dengan judul :D). Saya hanya ingin memberikan penjelasan hal-hal yangg dibutukan untuk mengembangkan/membuat aplikasi flex. Hal yang dibutuhkan hanyalah SDK dari flex itu sendiri. Bisa kita download di flex sdk download page. Isi dari SDK ini adalah framework flex itu sendiri (class-class, komponen, utilitas dll) dan compiler untuk flex (MXMLC). Untuk IDE kita bebas memilih menggunakan apa saja. Namun sangat disarankan kita menggunkan Adobe Flash Builder. Ya seperti penjelasan sebelumnya flash builder ini adalah pasangan yang “klop” dari flex.

Di sini juga saya mau menyebutkan bahwa kita hanya membahas membuat aplikasi web saja (bukan desktop atau mobile). Output dari aplikasi flex yg kita bangun adalah file .swf. Nantinya file ini akan diwrap oleh sebuah file html dan akan kita deploy di server. Server yang kita perlukan tergantung dari teknologi apa yang kita pakai. (dotnet -> web server IIS, Cold Fusion server, atau java -> tomcat / jetty). Seperti yangg saya juga sudah sebutkan jangan sampai lupa untuk menginstall plugin di browser kita yaitu adobe flash player. Note: adobe flash player ini cukup sering diupdate jadi kita harus mengupdate juga di browser kita.

Terseedia beberapa pilihan untuk framework di sisi flex. Framework-framework ini menyediakan reusable komponen, struktur aplikasi dan pattern-pattern yang membuat kita dapat mengembangkan aplikasi secara rapi, cepart dan easy to maintenance.

Note : Saya cuma mempunyai experience pada framework Cairngorm dan Swiz  menggunakan SDK Flex 4.1

Sekian pembahasan kita mengenai introduction to adobe flex, untuk melihat sample-sample aplikasi flex bisa kunjungi ini dan ini. Terima kasih. Referensi [1] http://projects.apache.org/indexes/quick.htmlhttp://en.wikipedia.org/wiki/Apache_Flexhttp://en.wikipedia.org/wiki/Adobe_Flash_Builder

R.F.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: