Search
Close this search box.

Cordova 2021 Quick Checklist

Amitpal Singh
Amitpal Singh
October 19, 2020

Here is a complete checklist for cordova based application to start. It is easier to go through in simple steps.


Step1: Open Command Prompt and go to root directory C:\

Run CMD
cd..

Step2: Create an application with appname/project

cordova create appname com.appname.subdomain AppName

Step3: Go Inside the project or app folder in cmd

cd appname

Step4: Edit the Project domain info, project name, project description, author name and author email in config.xml file


Step5: Add platform like android or ios in your project/app

cordova platform add android@9.0.0

Step6: Add android minimum and target SDK version into config.xml file present in your project root folder. Replace platform for android code with this code below:

<platform name="android">
<allow-intent href="market:*" />
<preference name="android-minSdkVersion" value="22"/>
<preference name="android-targetSdkVersion" value="29"/>
<preference name="ShowSplashScreenSpinner" value="false"/>
<preference name="SplashMaintainAspectRatio" value="true"/>
<preference name="SplashShowOnlyFirstTime" value="true"/>
</platform>

Step7: Add plugin to your android application project with the following commands. So many plugins available at npm/cordova library

cordova plugin add cordova-plugin-splashscreen

cordova plugin add onesignal-cordova-plugin --save

cordova plugin add cordova-plugin-vibration


Step8: Remove or comment the Content-Security-Policy code from projectname/www/index.html file, if you want to link this app operational with your website or domain.


<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">

Step9: Add jQuery library file in root folder and include in your index.html or needed html file in project (optional)


Step10: Create icon and splashscreen online from https://pgicons.abiro.com/


Step11: Copy the downloaded res folder and paste in your root directory.


Step12: copy the sample code from https://pgicons.abiro.com/config.xml and add in your config.xml file inside the platform code mentioned on Step6

<icon density="ldpi" src="res/icon/android/ldpi.png"/>
<icon density="mdpi" src="res/icon/android/mdpi.png"/>
<icon density="hdpi" src="res/icon/android/hdpi.png"/>
<icon density="xhdpi" src="res/icon/android/xhdpi.png"/>
<icon density="xxhdpi" src="res/icon/android/xxhdpi.png"/>
<icon density="xxxhdpi" src="res/icon/android/xxxhdpi.png"/>

<splash density="hdpi" src="res/drawable-port-hdpi/screen.png" />
<splash density="ldpi" src="res/drawable-port-ldpi/screen.png" />
<splash density="xhdpi" src="res/drawable-port-xhdpi/screen.png" />
<splash density="xxhdpi" src="res/drawable-port-xxhdpi/screen.png" />
<splash density="xxxhdpi" src="res/drawable-port-xxxhdpi/screen.png" />

Step13: Make sure you have these folders and have screen.png file in each.
drawable-port-hdpi
drawable-port-ldpi
drawable-port-xdpi
drawable-port-xxdpi
drawable-port-xxxdpi

Step14: If your project have plugins like vibration etc, then add the plugin related tutorial info code into your project. See the documentations for all the plugins and their usage.

Step15: Allow external url in app for ajax and API purposes. Go to androidmanifest.xml and put this code inside <application> tag

android:usesCleartextTraffic=”true”

Step16: Build your application in cmd

cordova build android

Install the app-debug.apk into your phone and enjoy.

Share this post:

How to Attribute?

Lorem ipsum is typically a corrupted version of De finibus bonorum et malorum, a 1st-century BC text by the Roman statesman and philosopher Cicero.
for Example: Website, Social Media, Blogs, ebooks , newsletter, etc.
Lorem ipsum is typically a corrupted version of De finibus bonorum et malorum, a 1st-century BC text by the Roman statesman and philosopher Cicero.
Copied!

Got a Question? Check out our FAQ Section.

Your action, our appreciation

It encourage us to give you more valuable content on website.