Build Android App Using Html, CSS And JavaScript

Android - Techripper.in

Android is a mobile operating system (OS) based on the Linux kernel and currently developed by Google. With a user interface based on direct manipulation, Android is designed primarily for touch screen mobile devices such as smartphones and tablet computers, with specialized user interfaces for televisions (Android TV), cars (Android Auto), and wrist watches (Android Wear). The OS uses touch inputs that loosely correspond to real-world actions, like swiping, tapping, pinching, and reverse pinching to manipulate on-screen objects, and a virtual keyboard. Despite being primarily designed for touch screen input, it also has been used in game consoles, digital cameras, and other electronics.

Here, we will present you a easy way to build android app in few minutes : -

Using Adobe Phone Gap Build

Phone Gap is a mobile development framework produced by Nitobi, purchased by Adobe Systems in 2011.It enables software programmers to build applications for mobile devices using JavaScript, HTML 5, and CSS3, instead of device-specific languages such as Objective-C.It enables wrapping up of HTML, CSS and JavaScript code depending upon the platform of the device.

The core of Phone Gap applications uses HTML 5 and CSS3 for their rendering and JavaScript for their logic. Although HTML5 now provides access to underlying hardware such as the accelerometer, camera and GPS, browser support for HTML 5-based device access is not consistent across mobile browsers, particularly older versions of Android. To overcome these limitations, the Phone Gap framework embeds HTML 5 code inside a native WebView on the device, using a foreign function interface to access the native resources of the device.

With The Help of Phone gap Build It Is very easy to design or develop an application which will run on multiple platforms.

Phone gap Supports Apple IOS, Google Android, Blackberry, LG webOS, Microsoft Windows Phone (7 and 8), Nokia Symbian OS, Tizen (SDK 2.x), Bada, Firefox OS and Ubuntu Touch.

1 . Download Adobe Dreamweaver for Designing Apps

Adobe Dreamweaver - Techripper.in

First Download the Dreamweaver for designing the apps. It will help to design your apps easily and frequently. You can download adobe Dreamweaver from:  http://www.adobe.com/in/products/dreamweaver.html

2 . Install Dreamweaver on Your System

Dreamweaver Installation - Techripper.in

Install The Dreamweaver into your System by Following the Steps of Setup. It should meet with your system requirements. You can check system requirements for Dreamweaver here: http://helpx.adobe.com/dreamweaver/system-requirements.html

3 . Create Your First App Design in Dreamweaver

Creating Your First App in Dreamweaver - Techripper.in

For Creating Your App Design You Should have A knowledge of html, css and JavaScript.Without Of these you should not able to Create Your App.For Tutorials for Html, css, JavaScript here: http://www.w3schools.com/

• After designing your app save the html file as index.html.


• Then Make .Zip using WinRAR  and put the all file of your app in the Your Zip Folder


• After That Sign Up In The Adobe Phone Gap. here: http://phonegap.com/

PhoneGap Build - Techripper.in

• After Sign In The Adobe Phone Gap Build.


• Upload You Zip file And Wait Till The Uploading Is Complete.

PhoneGap - Techripper.in

• Give Your App Name & App Description.


• After Uploading Click To On Build By Enabling the Hydration.

Hydration: It Will Notify the Smartphone That App Has Some Updates Whenever You Update your App.

• After Building the App There are some error on most of platforms except android and windows. Because app for other platform will be build when you put your developer key.

Your First App Ready - Techripper.in

• Download the apk For Android Smartphone and Ready to Install.

4. Install and Open Your First App

• After Installing Your App You Will open By Click your app.


• It Will looks according to your designing like:

Your First App - Techripper.in

If you have any query regarding this, please comment below ... !!!