PhoneGap: An Introduction

PhoneGap: An Introduction

What is PhoneGap and why should I use it?

PhoneGap is a bridge between your web application and mobile phones. It makes it possible to create phone applications without writing them in each phone's native code.

You can write your application in HTML, CSS, and JavaScript, the standard languages of the web, and then PhoneGap acts as the bridge between the web and mobile phones.

Rather than coding separate applications from scratch for every device, PhoneGap allows you upload a web app and convert it into a phone app. So no there's no need to configure SDks for every device or learn multiple new programming languages.

PhoneGap turns HTML, CSS and JavaScript into native phone apps

HTML, the language of the web

All web pages are created using the HTML language which is the core of your site. HTML is by nature a static language, meaning that what you add to the page is what you will see. It will hold all the content on your site that can then be styled with CSS.

But to add user interaction based on conditions we need a 3rd party language like JavaScript that will do the job. JavaScript is vast subject and a very rich language that has been simplified into libraries that make it easier to code and easier to implement functionality.

One of the latest libraries is called AngularJS which makes it possible to bind events into the HTML, making a HTML page into a dynamic page.

Using these 3 languages we can create a mobile phone application, that is dynamic, having search, and sorting functions and performing tasks based on user events, for example on the event that a user performs a mouse click.

CSS, the preferred method for styling a site or app

When the World Wide Web first came out there was only the HTML language to create sites. We didn't have all these 3rd party languages that work hand in hand with the HTML to make it more dynamic, and more stylish. So we were limited to default styles that HTML offers.

Later on in the 2000's CSS came out as a solution to styling your web page's content giving much more options to styling pages and making it possible to separate the content on your site from your site's styling rules.

Like JavaScript, CSS is a vast subject that has now been branched into libraries making it easier to implement on your projects. One of the many libraries out there is Topcoat. You can simply visit their site, copy and paste common code and use it on your project.

Monaca is a Phonegap Solution

Monaca is one of the many PhoneGap solutions in the market.

It's an IDE (a web interface to edit, and compile, code) that is easy to use. You simply visit their site, create an account and begin coding your projects. You can import existing projects, too.

Monaca + Topcoat + AngularJS

With these 3 technologies you will be able to code phone apps without having to code for each type of phone. You won't need to become an expert in Java (for Android apps) and Objective-C (for iPhone apps).


If you're curious about what kind of apps can be built using PhoneGap, visit their community area to see examples and case studies.

If you've been thinking about creating an app but indecisive about which platform to build it for, PhoneGap could be a great option.