Sunday 13 June 2021

Creating Android App Using HTML and CSS

Android Apps Using Cordova



Hello Friends !

In this post I am going to show you how can any one create  Android apps just by using HTML ,CSS and JavaScript. For this we will use Apache Cordova.

✔Apache Cordova:

Cordova is an open-source mobile development framework. It allows you to use web technologies such as HTML5, CSS3, and JavaScript for cross-platform development, avoiding each mobile platforms' native development language. Applications execute within wrappers targeted to each platform, and rely on standards-complaint API bindings to access each device's sensors, data, and network status.
You can not only create android apps but there are other options also available like:
1. Android
2. IOS
3. Windows
4. OS X
5. Electron

But in this post we will only see creating Android apps.

📑Requirement:

You just need to know basic HTML ,CSS and JavaScript to create an android app. Is this isn't amazing.
 But before using Cordova you need to install some additional tools that required by Cordova for creating android apps.

✔Java Development Kit (JDK):

Download Here: Java


When installing on Windows you also need to set JAVA_HOME Environment Variable according to your JDK installation path  .




Gradle:

Download Gradle and set it path in Environment Variable.




After downloading Gradle, extract the file if it is in .zip from and then set its path variable.

✔Android SDK:

Download Android Studio and install in your desktop.





After installing Android Studio , you need to download Android SDK packages.

1. Open Android Studio application.







2. Go to configure > SDK manager




3. Now install any of the SDK package from there.

I will be better to install Android version between 8.0 and 10.0

4. Then set the environment variable:
 
Set the ANDROID_SDK_ROOT environment variable to the location of your Android SDK installation

✔Node.js

Install Node.js



After installing Node.js , set its path variable.

📑 Installing Cordova:

After all the hectic work in installing the requirements , the fun part begins now.
 
1. Open cmd and run command:  

                                      ✅ npm install -g cordova

this will install Cordova in you system.

2. Then go to the folder where you want to store all the files of the app and type:                         

                                                ✅  cordova create MyApp

 this will create all the files and folders required by your app , like html and css file.

3. After creating a Cordova project, navigate to the project directory. From the project directory, you need to add a platform for which you want to build your app.

                                              ✅  cordova platform add android

✔Creating Android App:

Now see the video to understand how to create Android app in a very simple way using HTML and CSS. 

Share:

No comments:

Post a Comment