Hybrid mobile apps are like any other apps you’ll find on your phone. They install on your device. You can find them in app stores. With them, you can play games, engage your friends through social media, take photos, track your health, and much more.
It can be very difficult to tell how a mobile application is built. Hybrid mobile applications are no different. A well-written hybrid app shouldn’t look or behave any differently than its native equivalent. More importantly, users don’t care either way. They simply want an application that works well. Trying to figure out if a mobile application is hybrid or native is like trying to differentiate rare grape varieties of wine. Unless you’re a sommelier or someone who really cares about it, it’s not terribly important. What matters is that the wine tastes good. The same can be said for hybrid mobile applications; so long as the application does what it’s supposed to do, who really cares how it was built?
There are many tools and framework available to help you create Mobile applications. In this article, we’ll look at our Top 14
The team at IONIC will soon be introducing an easier way to create IONIC apps with IONIC creator. This will be released soon and will have drag and drop functionality to get started with app development in minutes.
www.sitepoint.com have published several articles on Ionic, including getting started with mobile app development and getting started with firefox os game development.
Mobile Angular UI
Mobile Angular UI is an HTML 5 framework which uses bootstrap 3 and AngularJS to create interactive mobile apps.
The main features of Mobile AngularUI include:
- Bootstrap 3
- Bootstrap 3 mobile components such as switches, overlays and sidebars which are missing in normal bootstrap.
- AngularJS modules such as angular-route, angular-touch and angular-animate
Responsive media queries are stripped out of bootstrap as separate files, you only need to include what you need. Mobile Angular UI doesn’t have any jQuery dependencies, all you need are some AngularJS directives to create awesome mobile user experiences.
Take a look at the Mobile Angular UI demo page to see it in action. If you want to dig deeper, I would recommend reading our article on getting started with Mobile Angular UI.
Intel XDK is a cross platform application tool developed by Intel. Getting started with Intel XDK is easy, all you need is to download their application which is free and available for Linux, Windows and Mac. It provides a number of templates to get started and supports a number of UI frameworks such as Twitter bootstrap, jQuery Mobile and Topcoat.
Intel XDK provides a live preview on the connected device whilst you are developing along side many other useful tools.
On a personal note, I think development using Intel XDK was the easiest. It uses a drag and drop approach, although it does create a lot of unnecessary code.
Sitepoint’s -Introduction to Intel XDK is a great tutorial to get started developing with the platform.
Appcelerator’s Titanium is an open source mobile application framework that provides an environment to create native apps for several mobile platforms
Titanium is a complete solution for creating hybrid mobile apps with all you need in one place. To get started with Titanium download Titanium studio. The Titanium SDK is equipped with a number of mobile platform APIs and Cloud service to use as an app backend. It comes with platform independent APIs which makes it easier to access phone hardware.
Titanium uses Alloy, a MVC framework to enable rapid development of mobile apps. Modules created using Alloy are easy to reuse across different apps, hence significantly reducing the development time and the lines of code.
Titanium studio comes with some code samples to get started and we hope to have a tutorial on SitePoint soon.
Sencha Touch is an HTML 5 mobile app framework for creating apps for several platforms including iOS, Android and Blackberry. It has been in existence for some years now and is popular among hybrid mobile application developers.
Sencha Touch scores highly against it’s competitors by providing a native look and feel across all of the platforms it supports.
Getting started with Sencha Touch isn’t that difficult but in order to get the best out of Sencha Touch, one needs to invest a considerable amount of time.
To get a feel of a Sencha Touch app, take a look at the samples provided on its official page. To get started developing using Sencha, read their official docs or our introductory tutorial from last year.
Telerik’s Kendo UI is an HTML 5 framework for creating cross platform mobile applications. Kendo UI relies heavily on jQuery and has a number of jQuery based widgets.
To get started developing with Kendo UI, refer to the official documentation. They also have a number of video tutorials to help learn the framework.
PhoneGap is the odd one out in this list as it’s not a framework for creating an app, but for packaging and releasing an app. PhoneGap is based on the open source Cordova and is the commercial version owned by Adobe. With a dedicated support team, PhoneGap is popular amongst many mobile developers.
Refer to the PhoneGap documentation to get started, (sitepoint.com)-.or Building a currency converter using PhoneGap is a good starting point.
Framework 7 leads the race among hybrid app frameworks in iOS mobile apps development space.
Framework 7 is completely free and open source under MIT license. You can read more about Framework 7 at its official website - Framework7.
jQuery suite is still in the game and holding the ground tight against the feature rich hybrid mobile app development frameworks like Ionic, Onsen UI and Framework 7. The die-hard jQuey fans community has built this minimalist jQuery Mobile package on top of solid jQueyr and jQuery UI foundation.
The focus of jQuery mobile is to empower developers to build web apps and mobile apps that run seamlessly and with unique user experience across mobiles, tablets and desktops. It doesn't focus much on providing native look and feel to apps for individual platforms like iOS or Android.
You can read more on jQuery Mobile at - jquerymobile.com.
Mobile Angular UI
This one is for the fans of Bootstrap and Angular. With Mobile Angular UI, you get best of both Bootstrap 3 and Angular framework to build HTML5 mobile applications. Angular UI is more like an extension to Bootstrap 3 but without any dependencies to bootstrap js or jQuery. It utilizes fastclick.js and overthrow.js for smooth and better mobile experience.
Mobile Angular UI provides directives for building UI component like overlays, switches, sidebars, scrollable areas and absolute positioned navbars that don’t bounce on scroll. These essentially are the components that you find missing in Bootstrap 3 for building mobile apps.
Mobile Angular UI is available as open source and free to use under MIT license, you can get the source code at github - mobile-angular-ui.
Read more about Mobile Angular UI at official website- mobileangularui.com.
Famo.us is another powerhouse html5 apps development framework and targets to provide near native experience in hybrid apps. The main difference between famo.us and other hybrid html5 frameworks is that it focuses more on graphics rendering, 2d and 3d and hence is more suitable for games development.
Read more about Famo.us at official website - famous.org.
Monaca is another commercial mobile app development platform with a huge list of products for managing end to end app development life cycle. Monaca features a cloud based IDE for developing hybrid mobile apps and lets you compile and publish to multiple platforms, utilizing Cordova.
The range of modules and products that Monaca offers is huge and i prefer to cover that in a separate article, keep watching for that and until then read more about Monaca at the official website - monaca.io.
Trigger.IO - The Dark Horse
I have already covered 10 of the best mobile app development frameworks but am finding it a little difficult to leave Trigger.io out from this list. Trigger.io takes a different approach and doesn't utilize Cordova for native access.
Trigger.io has its own platform for bridging the gap between html5 development and native access. They claim (Though I am still in the process of validating it) that it produces hybrid applications that have much better performance than Cordova based applications.
In this article, we discussed some of the best HTML 5 mobile app development frameworks. HTML 5 mobile development is evolving day by day and there are always new options emerging. What have been your favorite frameworks to use when developing a mobile app?