Apache Cordova adalah kerangka pengembangan aplikasi seluler bersifat sumber terbuka. Pengembang dapat membangun aplikasi lintas platform menggunakan teknologi web standar — HTML5, CSS3 dan JavaScript. Aplikasi berjalan di dalam wadah yang dikemas khusus tiap platform, lalu mengakses fitur perangkat melalui binding API standar, seperti sensor, data lokal, status jaringan dan lainnya.
Satu basis kode dapat digunakan untuk banyak platform, serta gratis dan bersifat sumber terbuka.
Apache Cordova bisa menjadi pilihan Anda jika cocok dengan skenario berikut:
- Anda pengembang aplikasi seluler, ingin memasang satu aplikasi ke berbagai platform tanpa perlu membuat ulang kode untuk bahasa dan rangkaian alat tiap platform;
- Anda pengembang web, ingin mengemas aplikasi web lalu menerbitkannya ke berbagai toko aplikasi populer;
- Anda pengembang seluler yang perlu menggabungkan komponen asli dengan WebView (jendela peramban khusus), supaya kode web dapat mengakses API tingkat bawah perangkat; atau perlu membuat plugin untuk membuka jalur komunikasi antara kode asli dan WebView.
Aplikasi Cordova dibangun dari beberapa komponen. Gambar berikut merupakan gambaran umum arsitektur aplikasi Cordova tingkat tinggi.
WebView (Tampilan Web)
WebView yang mendukung Cordova dapat menampung seluruh antarmuka aplikasi. Di beberapa platform, komponen ini juga dapat disematkan ke aplikasi hibrida dan bekerja bersama kontrol asli.
Web App (Aplikasi Web)
Tempat untuk meletakkan kode bisnis Anda. Aplikasi dibuat berbasis halaman web, dengan titik masuk bawaan berupa berkas lokal index.html. Halaman ini memuat berkas CSS, JavaScript, gambar, media dan sumber daya lain yang dibutuhkan. Seluruh aplikasi berjalan di dalam WebView yang berada di wadah asli, kemudian dikemas untuk didistribusikan ke berbagai toko aplikasi.
Terdapat satu berkas yang sangat penting di dalam wadah: config.xml. Berkas ini menyimpan informasi dasar aplikasi dan menetapkan parameter jalannya program, misalnya pengaturan peralihan orientasi layar potret dan lanskap.
Plugins (Plugin)
Plugin adalah bagian inti ekosistem Cordova. Plugin berperan sebagai jembatan komunikasi antara Cordova dan kode asli, sekaligus merangkum berbagai API standar perangkat sehingga JavaScript dapat memanggil fungsi kode asli.
Tim resmi Apache Cordova mengelola sekumpulan plugin inti yang menyediakan antarmuka untuk mengakses fitur dasar perangkat: status baterai, kamera, daftar kontak dan lainnya.
Selain plugin inti resmi, tersedia banyak plugin pihak ketiga yang mengemas fitur tambahan yang tidak selalu berjalan di semua platform. Anda dapat mencari plugin Cordova melalui platform pencarian atau npm; Anda juga dapat membuat plugin sendiri dengan mengikuti Panduan Pengembangan Plugin. Contoh penggunaan umum: membangun komunikasi antara Cordova dan komponen asli buatan sendiri.
Peringatan: proyek Cordova baru secara bawaan tidak disertai plugin apa pun, ini adalah aturan versi terbaru. Semua plugin, baik plugin inti maupun plugin pihak ketiga, harus dipasang secara manual dengan perintah eksplisit.
Cordova tidak menyediakan kontrol antarmuka maupun kerangka frontend MV. Ia hanya menyediakan lingkungan eksekusi untuk menjalankan kode web. Jika Anda memerlukan komponen tampilan atau kerangka arsitektur frontend, Anda harus memilih dan mengintegrasikannya ke proyek secara mandiri.
Dua Alur Pengembangan
Cordova menyediakan dua alur kerja utama untuk membangun aplikasi seluler. Di banyak kasus, kedua alur mampu mencapai tujuan, namun masing-masing memiliki keunggulan tersendiri:
Alur Lintas Platform (Alat Baris Perintah CLI)
Cocok untuk proyek dengan banyak platform target dan jarang memerlukan penyesuaian khusus tiap platform. Alat utamanya adalah cordova CLI. CLI adalah alat tingkat tinggi yang dapat membangun proyek untuk beberapa platform sekaligus, menyembunyikan detail skrip tingkat bawah: CLI menyalin sumber daya web umum ke subfolder tiap platform, melakukan konfigurasi platform secara otomatis, menjalankan skrip pembuatan untuk menghasilkan paket pemasangan, serta menyediakan antarmuka baris perintah seragam untuk mengelola plugin.
Alur Khusus Platform
Cocok untuk pengembangan yang fokus pada satu platform dan memerlukan perubahan mendalam pada berkas proyek tingkat bawah.
Contoh penggunaan umum: menggabungkan komponen asli kustom dengan Cordova WebView di dalam aplikasi.
Pilih alur ini jika Anda perlu mengubah berkas proyek di dalam SDK platform secara langsung.
Alur ini berbasis skrip tingkat bawah khusus tiap platform, disertai alat mandiri Plugman untuk mengelola plugin. Meskipun dapat digunakan untuk pengembangan lintas platform, biayanya lebih tinggi: tidak ada alat tingkat tinggi yang mengelola semuanya secara terpusat, setiap platform perlu dibangun dan dikonfigurasi plugin secara terpisah.
Setelah berpindah dari mode CLI ke mode SDK Platform + skrip tingkat bawah, tidak dapat dikembalikan lagi.
CLI menyimpan sumber kode umum lintas platform dan akan menimpa berkas di folder platform setiap kali proses pembuatan dijalankan. Jika Anda ingin menyimpan perubahan pada berkas di folder platform, wajib berpindah ke mode skrip tingkat bawah. Mode ini tidak lagi membaca sumber kode web umum dan langsung menggunakan berkas mandiri di folder platform.
Memasang Cordova
Cara pemasangan bergantung pada alur pengembangan yang Anda pilih:
Kita gunakan contoh alur lintas platform melalui CLI.
Alat baris perintah Cordova (CLI) didistribusikan sebagai paket npm.
Ikuti langkah berikut untuk memasang cordova CLI:
- Unduh dan pasang Node.js. Setelah pemasangan selesai, Anda dapat menjalankan perintah
nodedannpmlangsung di terminal. - (Opsional) Jika Git belum terpasang, unduh dan pasang klien Git. Setelah dipasang, Anda dapat menjalankan perintah
gitdi terminal. Cordova CLI dan npm akan memanggil git saat perlu mengunduh sumber daya dari repositori Git. - Gunakan alat npm yang sudah ada di Node.js untuk memasang modul cordova; npm akan mengunduh paket secara otomatis.
Pemasangan nodejs
Pemasangan Node.js cukup mudah: unduh berkas msi (untuk sistem Windows), jalankan dengan klik dua kali dan cukup ikuti langkah bawaan. Setelah pemasangan selesai
Buka terminal CMD untuk memverifikasi apakah pemasangan berhasil.
Ketik dua perintah berikut. Pemasangan dinyatakan berhasil jika keduanya menampilkan nomor versi (hasilnya akan menampilkan versi, seperti gambar di bawah)
node -v
npm -v
Setelah Node.js berhasil terpasang, selanjutnya kita pasang cordova
Sistem macOS / Linux:
npm install -g cordovaPengguna macOS dan Linux: jika ingin memasang alat ke folder dengan batasan izin seperti /usr/local/share, Anda mungkin perlu menambahkan parameter sudo pada perintah npm.
Namun jika Anda menggunakan alat manajer versi nvm / nave, atau folder saat ini memiliki izin tulis, Anda tidak perlu menggunakan sudo.
Disarankan sebisa mungkin menghindari penggunaan npm bersama sudo untuk mencegah masalah izin dan kegagalan pemasangan paket.
Sebaiknya gunakan nvm (Node Version Manager) atau nave untuk mengelola Node.js dan npm, sehingga biasanya tidak perlu sudo saat memasang paket.
Sistem Windows:
C:\>npm install -g cordovaParameter -g berarti pemasangan cordova secara global. Tanpa parameter ini, paket hanya akan dipasang di subfolder node_modules direktori saat ini.
Setelah pemasangan selesai, jalankan perintah cordova tanpa parameter di terminal. Jika informasi bantuan muncul dengan normal, pemasangan berhasil.
Saat proses pemasangan berjalan, akan muncul tulisan “added 217 packages in 14s”
Verifikasi hasil pemasangan
cordova -vJika nomor versi muncul dengan normal (contoh: 13.0.0), semua siap digunakan.
Persyaratan Sistem dan Dukungan Versi
| Versi CLI Cordova | Versi minimum Node.js yang didukung |
|---|---|
| 13.x | >=20.17.0 |
| 12.x | >=16.13.0 |
| 11.x | >=12.0.0 |
| 10.x | >=10.0.0 |
| 9.x | >=6.0.0 |
Pemasangan sudah selesai, selanjutnya kita mulai belajar cordova secara mendalam.
Pengenalan dan Pemasangan