Mobile apps using Web Technologies

This is probably one of the best inventions of the mobile applications development world, since its beginnings. Web developers can now use their knowledge and craft applications that compete with those built using native mobile languages, such as Java or Swift/Objective-C.

In this article, I will try to present to you the technologies that enable this, as well as the benefits and drawbacks of using them. So let’s start.

The Technologies

A few technologies exist today within the hybrid development world. Some of them are old while some emerge with the advance of other technologies.

Apache Cordova (PhoneGap)

Formerly known as PhoneGap, it was acquired by Adobe in 2011. They released an open-source version of the code, which they renamed as Apache Cordova.

I remember the days when I discovered it. It appeared to me as the solution to all my worries as I knew a little bit about web development (I had built a few web pages using bare HTML, CSS and JavaScript), but really wanted to wander into the aw-attractive world of mobile development.

Cordova is really easy to use, provided you have rudimentary Unix Terminal and web development knowledge. Basically what happens is you generate your project skeleton using the terminal commands provided by Cordova’s API, then kindly write your HTML, CSS and JavaScript as you always do. This code is then “transpiled” into native code, adapted to each platform. “But wait, wait! What about responsiveness?!”### Ionic Ionic was made for more advanced JavaScript developers.

In the late-2013, a group of developers noticed the power of hybrid web development and decided to combine it with the versatility of Angular. For those who do not know what Angular is, it sure is not a design software.

The most summed up definition I could come up with is: a JavaScript-based web development framework aiming to ease the struggle for responsiveness and functional development.

When I started using Ionic, I tried Ionic1, based on AngularJS, which is the first version of Angular. I was impressed at how easy it was then to build stuff. But at the same time, Ionic2, based on Angular (version 2) was already released, and the gap between Ionic v1 and Ionic2 was certainly not negligible…

The mistake I made was to continue using Ionic v1 after Ionic2 came out… Then Ionic3 came out. The application I was building was full of bugs, and I was using deprecated packages. Hear me out: do not use deprecated technologies. You will end up with no support in case of failure…

Ionic is a little easier to use than Cordova if you already know about Angular. It provides an API to automate most project architecture issues, such as: creating files at the right places, sorting them or linking them together. “OK, that’s great but what if I don’t know much about JavaScript ?!”### Xamarin This technology is a little bit out of focus, as it does not use web technologies, but rather C#, which is a programming language developed by Microsoft as part of its .NET program.

I have never used it before, but the advertisement around it makes it really attractive. First of all, it was built by Microsoft. A company that revolutionized the way we use computers. Secondly, its website claims that C# is the best language for mobile apps development and that it is faster than technologies that interpret code at runtime (shots fired at JavaScript technologies).

Indeed, me being from a C background, I really feel interested in trying Xamarin as C# really is just an extension of the C programming language. They both differ from web development as they are compiled before runtime, which SHOULD provide better performances.

I shall try it very soon and write about it.

Two Advantages

The biggest advantage for me is the fact that developers only have to write one version of the source code using one technology, and distribute their apps on different platforms. So: 1 code, many platforms.

From a financial management point of view, it is definitely less expensive to hire one developer who masters hybrid mobile development than 2 developers, one in Android, and the other in Swift for iOS.

Two Drawbacks

Hybrid mobile programming is a technology that sometimes involves web technologies. We technologies are interpreted at runtime, as discussed previously. Hence, it could render slower than if the code was native.

Scarce documentation and support is a major issue in hybrid programming, compared to Java that has been around for more than 20 years now. As it is a small cluster of Programming and a fairly young technology, the reduced amount of documentation and support make it somehow hard for newcomers.

In The End

In the end, what I strongly recommend when using Hybrid Mobile development technologies is to be very meticulous about your code. A clean code will help you solve bugs you could encounter and find the answers on the Internet. Everything was set up to facilitate usability: do not reinvent the wheel, go by best-practices. And most important : have fun ;-)

Next

In my next article I will cover the exciting developments with React Native. Something that is really exciting and becoming more and more popular.

---

If you’re passionate about Front End development, check out the JavaScript Works job-board here!

---

Author: Florian Adonis - Twitter - @florian_adonis