How To Start PhoneGap, #1: An Explanation

An introductory explanation for those who want to start Phonegap development.

The industry isn't the same as it was 5 years ago.

Nowadays, every company, individual or a community must have a mobile app or mobile website.

Since our option here is building mobile apps, I would like to help you get started with PhoneGap easily and quickly.

Before we start talking about what needs to be installed and which apps and frameworks we need to use for developing, I would like to talk about the wrong things you know about PhoneGap.

Facts you know wrong about PhoneGap, #1: PhoneGap isn't a WYSIWYG Editor

Clearly, every native lover has neither developed a single line of Hybrid App nor knows about it; thinks like that. They think as if you have an editor like Visual Studio or Eclipse or whatever WYSIWYG editor you're using to develop apps. That's not true. You can use whatever HTML-supported editor you want, even Notepad can help you build a Hybrid Mobile App with PhoneGap. PhoneGap Apps are HTML/JavaScript oriented apps.

Since I have now clarified those misunderstandings, I better tell you what PhoneGap is.

PhoneGap is divided into 2 parts: Packager and Framework.

The Packager helps you to build and debug apps depending on the platforms you wish to be published, such as Android, iOS, Windows Phone or Blackberry.
The Framework is called Apache Cordova. Cordova helps you to access platform-specific or common elements such as Camera, GPS and so on.

The apps built using the PhoneGap Packager uses Cordova at the backend. It's a device-specific set of scripts that uses native coding in the backend and invokes the features of the phone.

Facts you know wrong about PhoneGap, #2: PhoneGap runs slow.

It's not something to do with PhoneGap, but the system itself!

Let's compare 2 kinds of apps: Native and PhoneGap

In your native app, you don't use any single line of code or visual element. Just a blank screen.

How does native apps work? First the code is compiled line by line and then visual elements (if there are any and no error on debug) is put in the window. Then the emulator runs and displays our app.

Now let's take a look at PhoneGap!

How PhoneGap actually works: Normally to access the native specs, there is a secret Native App Template built on packaging. Yes! What did you think? How else would a JavaScript access native specs without invoking backend native code. So until debugging everything works just like a Native App. After the app works, first the scripts are being called, rendered and then HTML elements being drawn in a WebBrowser component that fills the screen.

See the difference? It's because it is rendered 2 times, 1 for native and 1 for HTML/JavaScript files. So whoever thinks its slower than native, yes you're right but no other hybrid alternative can change that. Its because of the system design. Every a hybrid app runs inside a native app.

I will talk and update this series often so stay in touch.