source: http://brianshim.com/webtricks/phonegap-and-jquery-mobile/
PhoneGap and jQuery Mobile vs. Sencha Touch
PhoneGap Build lets web developers create native mobile apps for iOS and Android without learning Objective C or Java, while still being able to access native hardware features like vibration, accelerometer, camera, and so forth. This is great if you are a web developer and need to develop a native mobile app on multiple platforms (iOS, Android, etc.)
I was fortunate enough to be able to attend Web Unleashed 2012, a two-day “Front End Developer Event” near Boston, where they discussed mobile app development. One of the highlights for me was a presentation called “Building Multiplatform Apps with HTML & JavaScript Using PhoneGap Build”, by Brian Rinaldi from Adobe.
PhoneGap Build Makes it Easier
PhoneGap Build is Adobe’s attempt to take care of more of the development process for you (especially the convoluted iOS compilation process). In fact, using PhoneGap Build, you can develop iOS apps using a Windows PC! (Apple’s iOS development tools only run on Mac). Adobe accomplishes this by moving the iOS-specific parts of the PhoneGap development process to their servers on the web, so you only need to upload files there and push a button. To load your app onto your mobile device, you scan a QR code from your phone and it sends you to a link where the files are waiting for you. I went through most of the process and it was relatively painless! The only reason I didn’t go all the way was that I had an iPhone and I didn’t have an Apple developer license ($99), which is required for iOS development.
Android development (and Blackberry, for those who care), works the same way, except that you don’t need a license. If I had an Android phone, I would have been able to run the demo on my phone that day.
I had attended a native iOS development workshop once before, and the whole process turned me off. If I had to develop an iOS app, I’d definitely use PhoneGap Build instead. I’d recommend it to any web developer who wants or needs to develop a native mobile app. This is the easiest way that I’ve found.
PhoneGap Build is free for one app and $10/month for 25 apps. You can find out more about PhoneGap Build here: http://build.phonegap.com/
PhoneGap vs. PhoneGap Build
I wasn’t aware of this before I went, but there is a distinction between “PhoneGap Build” and “PhoneGap” (without the “Build”). Both allow you to develop native mobile apps using HTML, CSS, and JavaScript and give you access to native hardware features. However, PhoneGaprequires that you have a Mac running XCode if you want to develop an iPhone app. That is why Phone Gap Build is so cool – no Mac required. The Mac-specific stuff is done on Adobe’s servers.
jQuery Mobile vs. Sencha Touch
Closely related to Phone Gap is jQuery Mobile, a JavaScript UI framework that gives your app the look and feel of a native app by providing cosmetic elements like buttons, menus, etc., as well as animations like transitions. These elements are not just icing on the cake; Apple requires that native apps have a specific look and feel, so you’ll either have to craft these elements yourself or rely on a framework.
I have previously used jQTouch for this, which was easy to use, but doesn’t seem to have much momentum behind it now. For my next project, I’ll definitely use jQuery Mobile. It seems very easy to use for anyone familiar with HTML and CSS and it appears to be well-supported by Adobe. More on jQuery Mobile here: http://jquerymobile.com/.
I also attended a talk on Sencha Touch, which is another mobile app framework, but is a much bigger departure from traditional web design methodology. With Sencha Touch, the whole HTML body section is generated dynamically by the JavaScript framework, in a more MVC philosophy. You don’t write any HTML code for the body directly, which might be disconcerting to some developers. I think most front-end web developers would feel much more at home with a less radical framework like jQuery Mobile. I know that if I needed to develop a mobile web app fast, I’d be up and running much quicker with jQuery Mobile than Sencha Touch. Pure JavaScript programmers, on the other hand, might prefer Sencha Touch.
A Side Note: The Brackets Code Editor
Some of the coolest things I discover from these presentations are the tools that the presenter uses.
Brackets is an open-source code editor created and maintained by Adobe. One of the coolest features of Brackets is inline code editing. Say you are editing a div tag in your code and want to see the CSS that goes with it. Click a button, and the CSS for that div appears right below the line you are editing. Very cool!!!
Brackets is still in beta, but I’m going to be watching it. It could become the code editor that you’ve been looking for too.
Mongoose: An Easy-To-Use Web Server
To get people who didn’t have servers running on their laptops up and running quickly for the workshop, the presenter recommended usingMongoose. You simply download it (it works on Mac or PC), copy it to a directory, launch it, and boom, you have a web server running on your computer. No messing around with installing WAMP, MAMP or XAMPP. I already had a web server running on my laptop, but this seemed pretty cool.
The Verdict
If you are a front-end developer accustomed to building websites with HTML, CSS, and some JavaScript, you will find jQuery Mobile to be definitely easier and quicker to develop with than Sencha Touch. If, on the other hand, you are a professional JavaScript programmer who likes the “MVC way” of doing things, you’ll like Sencha Touch. As for Phone Gap Build, I’d recommend that for anyone who hasn’t already gone through the painful iOS development process. Save yourself some headaches!
Have you used Phone Gap or PhoneGap Build? What are your thoughts?
- Brian
댓글
댓글 쓰기