How to build a mobile app using HTML5

Yes, you can build mobile apps in HTML. You do not need to use Java or c-sharp (unless you want a complicated app). There are easier ways for the novice programmer. This is good as my students are not really programmers at all, we are designers:) So you can build standard native apps in HTML. My favorite tool for doing this is PhoneGap. PhoneGap is an opensource software package owned by Adobe. Here is a link to phonegap:

PhoneGap: http://phonegap.com/

Here is a review of PhoneGap and my thoughts on using it in the classroom: http://raypastore.com/wordpress/2012/05/phonegap-building-an-app-and-classroom-use/

Now, what is the advantage of using HTML to create a mobile app? One, its pretty easy and many people already know HTML. You can even use dreamweaver to make the app – although be careful because dreamweaver creates some bad code that might not work well on the mobile device. I really suggest hand coding in HTML5 all mobile apps. But the real advantage is that the apps will work on all mobile devices! You can publish to Apple, Google, MS, and Blackberry. Now in order to do so you need to be a developer for each and publish through them, so for Android its Eclipse and Apple is xcode – and as you read in my review blog post above, that is kind of difficult for the average user. However, for the developer, this is an awesome way to create one app that works on all devices.

One thing I do want to mention here and make sure this point is clear: HTML5 apps are simply not as powerful as apps developed in C-Sharp, Java, or Flash. HTML5 just doesnt have the power. So for simple apps, HTML5 is a great option and the best in my opinion. For a more complicated app that access a database and requires a lot of functionality, I would go a different route.

Just a quick note – there are other options besides phonegap, such as: titatium and genexus. I chose phonegap because they really seem to be the most popular, are opensourced, and now that Adobe owns them, I have a feeling they will be integrated with the next version of dreamweaver and will really own the HTML5 mobile market.

PhoneGap: Building an app and classroom use

Well I have built my first mobile app using PhoneGap. Here are my thoughts:

Usability: Setting the software up was pretty easy although I did think the PhoneGap tutorials were not very good and had to look elsewhere to get the software installed on both Eclipse and Xcode. However once I was set up, all I needed to do was to drop HTML files into my WWW folder. Additionally, it was not easy to figure out how to publish my apps to the Android/iOS stores but very easy once I did figure it out. I would recommend one be familiar with Eclipse and Xcode before working with PhoneGap. Now onto building an app – very easy. Building an app using HTML was pretty easy. PhoneGap does have the ability to interact with the phone’s internal hardware just like a native app, which is nice. It does require javascript though, so be prepared to program if using PhoneGap.I did have to also modify things in both Eclipse and Xcode in order to get certain things to work, for instance, just adding external links to my app in Xcode required modification. I honestly think PhoneGap needs to work on their tutorials, for many things their software could do, and it would used by many more people. They are limiting themselves with the poor tutorials they have on their site.

Publishing – Publishing on multiple devices was pretty easy. After I had finished my app for Android, it took me maybe 30-45 mins to get it ready for publishing on iOS, which is pretty impressive. Keep in mind though that in order to publish on Apple (or even get your app on your iPad/iPhone) you need to pay the $99 developer fee. On Android, that fee is only $25 which is much more reasonable. Also, Android lets you publish your app without review, Apple needs to review (takes weeks at a minimum) and might actually reject your app.

Education use: I think this would be a very good tool for the classroom but there are a few things that an instructor needs to be ready for. The first thing is setting up this software. It was not that easy to set up. You have to download and install like 5 things for Android and like 5 things for Apple. Not only do you have to download/install but you need to create directories and move files around. While this was pretty easy for myself (and it did take a while), this is a nightmare waiting to happen in the classroom. You will have to walk your students through this process and I would expect errors. This process alone will turn off non technical students who will never use this tool after class due to this set up process. Once all set up though, its HTML, CSS, and Javascript. I do believe your students should thoroughly understand HTML and CSS with intro level javascript knowledge before attempting to use this tool. You at least need to know how to find/modify javascript to really do  anything ‘fun’ with the tool (unless you are just creating static HTML pages). Now, if you can look past all of that (and I probably can for my non programmer/non technical students even though I did sound rather negative in my review), I would recommend to require all students buy an Android develop account for $25 (vs iOS $99 due to cost) and let them each publish their apps to the Android Martketplace (Google Play). I think students would love to see their apps on the app store.