How to Build a Cordova Android App Without Android Studio (Convert HTML, CSS, JS to Android App)

If you’re a web developer with skills in HTML, CSS, and JavaScript, you might want to convert your web project into an Android app. You don’t need Android Studio to accomplish this; Cordova, along with several tools, allows you to package your web app into a mobile app. This guide walks you through the entire process step by step.

Step-by-Step Guide to Building a Cordova Android App

Step 1: Download and Install Node.js

Cordova requires Node.js to manage its command-line interface (CLI). Download the latest version of Node.js from the official website.

• Download Node.js

Once downloaded, install Node.js and verify its installation by running the following commands in your command prompt:

node -v
npm -v

copy

Step 2: Install Cordova

To install Cordova globally, open the command prompt and run:

npm install -g cordova

copy

After installation, check if Cordova was installed correctly by running:

cordova -v

copy

Step 3: Download and Install Oracle JDK 17

Download and install Oracle JDK 17 from the following link:

• Download JDK 17

Set Environment Variables for Java:

• JAVA_HOME: C:\Program Files\Java\jdk17
• Path: %JAVA_HOME%\bin

Verify the Java installation by running:

java -version

copy

Step 4: Download the Android SDK (Command Line Tools Only)

Next, download the Android SDK (Command Line Tools Only):

• Download Android Command Line Tools
• Download Android Platform Tools

Setting up the Android SDK:

• Create the folder: C:\Android
• Copy the extracted cmdline-tools and platform-tools into C:\Android

Set Environment Variables for Android SDK:

• ANDROID_HOME: C:\Android
• Path: %ANDROID_HOME%\platform-tools and %ANDROID_HOME%\cmdline-tools\latest\bin

Step 5: Download and Install Gradle

Gradle is the build automation tool required to compile your Android app. Download and install Gradle:

• Download Gradle

Set up the environment variables:

• Create the folder: C:\Gradle
• GRADLE_HOME: C:\Gradle\gradle-x.x.x
• Path: %GRADLE_HOME%\bin

Verify Gradle installation by running:

gradle -v

copy

Step 6: Install Android SDK Components

Navigate to the cmdline-tools folder:

cd C:\Android\cmdline-tools\latest\bin

copy

Then, run the following command to install the necessary SDK components:

sdkmanager "platform-tools" "platforms;android-30" "build-tools;30.0.3" "build-tools;34.0.0"

copy

Step 7: Create a Cordova Project

Create a new Cordova app by running:

cordova create myApp com.example.myapp MyApp

copy

Step 8: Add the Android Platform

Navigate to your project folder:

cd myApp

copy

Add the Android platform to your Cordova project:

cordova platform add android

copy

Step 9: Build the Android App

Build the APK by running:

cordova build android

copy

The APK will be generated in the platforms/android/app/build/outputs/apk/debug/ directory.

Conclusion

By following these steps, you can easily convert your HTML, CSS, and JavaScript project into an Android app without using Android Studio. With the help of tools like Node.js, Cordova, JDK, Android SDK, and Gradle, you can create and build your mobile apps efficiently.