Instalasi Sencha Touch - Tutorial Sencha Touch #Part 1 Oleh: FAUZI Instalasi Sencha Touch - Baiklah, pada kesempatan pertama ini saya ingin berbagi tentang persiapan awal dalam pembangunan aplikasi mobile berbasis web ini, tapi sebelumnya saya ingin review sedikit tentang sencha touch bagi yang belum mengenal framework yang satu ini.   Sencha touch adalah sebuah frame... Instalasi Sencha Touch - Baiklah, pada kesempatan pertama ini saya ingin berbagi tentang persiapan awal dalam pembangunan aplikasi mobile berbasis web ini, tapi sebelumnya saya ingin review sedikit tentang sencha touch bagi yang belum mengenal framework yang satu ini. Sencha touch adalah sebuah framework web application mobile yang menggabungkan kekuatan HTML5 mobile dan javascript sehingga dapat menghasilkan suatu web application mobile layaknya sebuah aplikasi native pada perangkat mobile tersebut. jadi, dengan sencha touch kita dapat membuat sebuah aplikasi yang indah dan dapat berinteraksi dengan module-module perangkat smartphone secara sederhana. Untuk informasi lebih lanjut bisa mengunjungi website resminya www.sencha.com/products/touch Bahan-bahan yang perlu disiapkan: 1. 2. 3. Sencha-touch-2.3.1a bisa langsung di download disini. SenchaCmd-3.1.2.342-windows bisa langsung di download disini.. java Development Kit jdk-6u20-windows-i586 bisa langsung di download disini.. Baiklah sekarang kita langsung melakukan instalasi sencha touch pada komputer maupun laptop yang kita miliki, perlu di ingat pada tutorial ini saya menggunakan windows 7 untuk sistem operasi yang saya gunakan, sejauh ini sencha touch berjalan dengan baik pada windows 7 ultimate, home dan windows 8, untuk versi OS lainnya saya belum melakukan explorasi. Langkah pertama download dahulu dulu paket yang telah saya berikan sebelumnya, yang berisi 3 file wajib yang harus dimiliki.
Perangkat yang harus ada sebelum kita bisa menggenerate project pada sencha touch ini adalah JAVA DEVELOPMENT KIT (jdk), jadi kita harus install dahulu jdk-6u20-windows-i586 yang sudah saya berikan sebelumnya. Lakukan proses instalasi seperti pada umumnya. Setelah proses instalasi selesai dilakukan, selanjutnya lakukan instalasi pada sencha CMD SenchaCmd-3.1.2.342-windows. Ini berfungsi untuk menggenerate project baru yang akan kita bangun nantinya, karena proses generate project dan pembangunan lokal server dilakukan menggunakan command prompt (CMD) maka kedua file ini wajib sudah terinstalasi dengan baik. Untuk mengetahui apakah kedua perangkat ini sudah berjalan dengan baik, lakukan percobaan berikut. Silahkan buka Command Prompt (CMD) ketikkan sencha tanpa tanda petik di command prompt anda. Maka hasilnya akan seperti ini. Apabila dua software tadi belum berhasil di instalasi maka hasilnya akan seperti ini. Silahkan ulangi proses instalasi apabila tahap pengecekan menghasilkan error seperti di atas. Baiklah tahap berikutnya adalah pembuatan direktori sencha yang akan digunakan untuk membangun project nantinya. Silahkan extrak file sencha-touch-2.3.1a-commercial.rar yang telah saya berikan sebelumnya, dan arahkan extraksi di drive C:\ anda, maka file touch-2.3.1 akan berada seperti berikut.
Tahap ini dilakukan untuk pengarahan lokal server ke direktori touch-2.3.1 dan penempatan project kita nantinya. Sejauh ini proses instalasi telah berjalan dengan baik, selanjutnya kita akan melakukan pengecekan terakhir dan melihat demo project dari framework sencha touch ini. Seperti pembangunan aplikasi web mobile pada umumnya sencha touch juga membutuhan server lokal dalam pengujian projectnya. Kabar baiknya sencha touch telah menyedia kan server lokal di dalamnya, jadi kita tidak membutuhkan aplikasi tambahan seperti XAMPP dan sejenisnya. Untuk pengaktifan server lokal, lakukan aktifasi pada sencha cmd web server dengan cara berikut. Buka command prompt (CMD) ketikan perintah berikut sencha fs web -port 8000 start -map C:\touch-2.3.1 tanpa tanda petik, port 8000 adalah port yang akan kita gunakan pada server ini, anda bisa mengganti dengan port yang anda inginkan, c:\touch-2.3.1 adalah direktori sencha touch yang akan kita jadikan server lokal nantinya. jadi, direktori c:\touch-2.3.1 akan menjadi lokal server layaknya htdoc pada XAMPP. Apabila proses aktifasi server berjalan dengan baik, maka hasilnya akan seperti berikut. Berikutnya silahkan buka browser google chrome untuk mellihat apakah sencha touch telah berjalan dan bisa digunakan. Sencha touch berjalan dengan baik pada browser yang memiliki kemampuan yang bagus seperti safari dan chrome. Ketikkan url berikut di google chrome anda localhost:8000 sesuai dengan port yang anda berikan pada tahap pengaktifan sencha cmd web server. Apabila semua tahap instalasi selesai maka hasilnya akan seperti ini. Selanjutnya kita akan melihat kemampuan-kemampuan sencha touch dalam membangun web aplikasi mobile dengan melihat demo projectnya. Silahkan ketikkan url berikut localhost:8000/examples/ di browser google chrome yang anda buka sebelumnya.
Silahkan lakukan explorasi dengan melihat-lihat demo yang dimiliki oleh sencha touch. Sencha touch memiliki kemampuan yang luar biasa di bandingkan framework-framework lainnya, salah satunya kita bisa merasakan efek touch yang biasa dirasakan pada aplikasi native smarphone dan dapat berinterasi dengan hardware yang ada di dalam perangkat smartphone tersebut. Saya sendiri sangat menyukai framework yang satu ini dalam membangun web aplikasi mobile di bandingkan dengan menggunakan jquery, karena kemampuannya yang luar biasa dan desain thema yang mampu di sesuaikan dengan perangkat yang menjalankannya secara otomatis. Berikut adalah salah satu contoh demo form yang dimiliki sencha touch. Demikianlah tahap instalasi sencha touch. Pada tutorial berikutnya kita akan belajar membuat project sederhana dan instalasi documentasi untuk mempermudah proses exprolasi atau pembelajaran kedepannya. Salam hangat Tentang Penulis FAUZI