Apache Cordova adalah kerangka kerja pengembangan aplikasi seluler yang awalnya dibuat oleh Nitobi. Adobe Systems membeli Nitobi pada tahun 2011, mengganti namanya menjadi PhoneGap, dan kemudian merilis versi open source dari perangkat lunak yang disebut Apache Cordova.
Apache Cordova memungkinkan pemrogram perangkat lunak untuk membangun aplikasi untuk perangkat seluler menggunakan CSS3, HTML5, dan JavaScript daripada mengandalkan API khusus platform seperti yang ada di Android, iOS, atau Windows Phone. Ini memungkinkan pembungkusan kode CSS, HTML, dan JavaScript tergantung pada platform perangkat. Ini memperluas fitur HTML dan JavaScript untuk bekerja dengan perangkat. Aplikasi yang dihasilkan adalah hibrida, yang berarti bahwa mereka bukan aplikasi seluler asli (karena semua rendering tata letak dilakukan melalui tampilan Web, bukan kerangka kerja UI asli platform) atau murni berbasis Web (karena mereka bukan hanya aplikasi Web, tetapi dikemas sebagai aplikasi untuk distribusi dan memiliki akses ke API perangkat asli).
Anda dapat menghubungkan ke API perangkat asli dengan menggunakan Cordova Plugins.
Persiapan untuk Aplikasi Cordova
Sebelum kita terjun ke pengembangan yang sebenarnya, kita perlu melakukan beberapa pekerjaan persiapan.
Langkah 1 - Instalasi
Langkah pertama adalah memastikan Anda menginstal Cordova CLI dan SDK yang diperlukan.
npm install -g cordova
Pengturan Android
-
Setelah langkah ini, Anda perlu menginstal SDK platform Android di mesin Anda. Anda dapat mengunduh Android Studio di sini dan ikuti langkah-langkah instalasi ini setelah itu.
-
Pastikan bahwa setelah Anda menginstal Android SDK, Anda kemudian menerima lisensinya. Buka terminal dan buka folder tempat SDK diinstal, di tools/bin dan panggil sdkmanager --licenses.
-
Tambahkan instalasi Android ke path directori Anda:
Unix(macOs, Linux)
export ANDROID_HOME="$HOME/Android/sdk"
export ANDROID_SDK_ROOT="$HOME/Android/sdk"
export PATH=$PATH:$ANDROID_SDK_ROOT/emulator
export PATH=$PATH:$ANDROID_SDK_ROOT/tools
export PATH=$PATH:$ANDROID_SDK_ROOT/platform-tools
Harap dicatat bahwa terkadang /Android/Sdkfolder ditambahkan di /Library/ dalam folder pengguna Anda.
Periksa folder pengguna Anda dan jika /Android/folder hanya di dalam /Library/lakukan:
export ANDROID_SDK_ROOT="$HOME/Library/Android/Sdk" atau
export ANDROID_HOME="$HOME/Library/Android/Sdk" sebagai gantinya.
Windows
Setelah menginstal Android Studio, Anda perlu menginstal dua perangkat lunak lagi:
- JDK dari Oracle. Ini dapat ditemukan di sini
- Gradle. Dulu dapat digunakan dari Android Studio tetapi sekarang Anda harus menginstalnya secara terpisah. Ada versi yang sangat spesifik yang dibutuhkan cordova. Anda dapat mengunduhnya di sini
Maka Anda harus mengatur variabel lingkungan. Anda perlu mengatur variabel berikut. Cordova sudah memiliki panduan yang bagus untuk itu. Ini dapat ditemukan di sini. Kamu butuh:
- tambahkan ANDROID_SDK_ROOT. Ini dapat dengan aman diatur ke:
"%USERPROFILE%\AppData\Local\Android\Sdk"
- tambahkan dua direktori
ANDROID_SDK_ROOT ke PATH Anda: %ANDROID_SDK_ROOT%\tools;%ANDROID_SDK_ROOT%\platform-tools
- tambahkan
Gradle ke PATH Anda. Perhatikan bahwa gradle tidak memiliki penginstal. Anda cukup meletakkan file biner di tempat yang Anda inginkan, lalu tambahkan direktori bin ke PATH Anda.
Jika Anda memiliki skrip init untuk prompt perintah atau PowerShell Anda, Anda dapat mencoba ini:
setx ANDROID_HOME "%USERPROFILE%\AppData\Local\Android\Sdk"
setx ANDROID_SDK_ROOT "%USERPROFILE%\AppData\Local\Android\Sdk"
setx path "%path%;%ANDROID_SDK_ROOT%\tools;%ANDROID_SDK_ROOT%\platform-tools;<gradle_path>\bin;"
Setelah alat diinstal, siapkan Android Studio dengan SDK yang benar dan buat mesin virtual.
-
Mulai Android studio (periksa file yang dapat dieksekusi di folder tempat Anda menginstalnya). Langkah selanjutnya adalah menginstal SDK individual:
-
Buka menu "Konfigurasi" di bagian bawah jendela:
-
Pilih SDK yang diinginkan. Per Desember 2019 Cordova membutuhkan android-28 (Android 9.0 - Pie) jadi pastikan untuk memasukkannya. Klik "Terapkan" untuk menginstal SDK.
Pengturan iOS
Anda akan membutuhkan macOS dengan Xcode diinstal. Setelah Anda menginstalnya, buka Xcode untuk mendapatkan prompt lisensi. Terima lisensinya, lalu Anda bisa menutupnya.
Langkah 2 - Tambahkan Mode Quasar Cordova
Untuk mengembangkan/membangun aplikasi Seluler, kita perlu menambahkan mode Cordova ke proyek Quasar kita. Apa yang dilakukan adalah menggunakan Cordova CLI untuk menghasilkan proyek Cordova di /src-cordova folder. /src-cordova/www folder akan ditimpa setiap kali Anda membangun.
quasar mode add cordova
Langkah 3 - Tambahkan Platform
Untuk beralih ke proyek cordova, ketik:
cd src-cordova
Platform target dipasang sesuai permintaan oleh Quasar CLI. Namun, jika Anda ingin menambahkan platform secara manual, ketik:
cordova platform add [android|ios]
Untuk memverifikasi bahwa semuanya sudah beres, ketik:
cordova requirements
Pada beberapa sistem operasi berbasis Debian yang lebih baru, Anda mungkin menghadapi masalah yang sangat persisten saat menjalankan cordova requirements. Silakan lihat bagian “Android SDK tidak ditemukan” setelah penginstalan untuk bantuan.
Langkah 4 - Mulai Developing
Jika Anda ingin langsung masuk dan mulai mengembangkan, Anda dapat melewati perintah langkah #2 dan #3 dan mengeluarkan salah satu perintah di bawah ini. Jika Anda memiliki perangkat seluler/tablet yang terhubung ke mesin Anda, Anda juga dapat menjalankan aplikasi dev di dalamnya alih-alih di emulator.
quasar dev -m cordova -T [android|ios]
# passing extra parameters and/or options to
# underlying "cordova" executable:
quasar dev -m ios -- some params --and options --here
# when on Windows and using Powershell:
quasar dev -m ios '--' some params --and options --here
Ini akan menambahkan mode dan proyek Cordova secara otomatis, jika tidak ada.
Namun, jika Anda ingin membuka IDE (Android Studio / Xcode) dan dari sana untuk memilih emulator secara manual (atau beberapa emulator secara bersamaan!) untuk menjalankan aplikasi dev di dalamnya:
quasar dev -m [ios|android] --ide
PERINGATAN
Di Android Studio, Anda akan disambut dengan pesan yang merekomendasikan untuk meningkatkan versi Gradle. JANGAN UPGRADE GRADLE karena akan merusak proyek Cordova. Hal yang sama berlaku untuk peningkatan yang diminta lainnya.
Jika Anda menemukan kesalahan IDE, klik File > Invalidate caches and restart.
