background preloader

The Easiest Way to Build your First iPhone App

The Easiest Way to Build your First iPhone App
Mobile websites have come a long way, but if you want to take full advantage of a smartphone's hardware, or get listed in the iTunes App Store, you need to compile your code. In this tutorial, we'll show you how to create a mobile web app with an iPhone look and feel using jQTouch, then turn it into a native iPhone app using Phonegap. No Objective-C necessary. Tutorial Details Program: PhonegapVersion: 0.80Difficulty: IntermediateEstimated Completion Time: 1 hour Requirements To complete this tutorial, you'll need the following: Mac OS XXCode (included with Mac OS X, but installed separately)iPhone SDK (registration required)PhoneGap 0.80 Introduction to PhoneGap PhoneGap is an open-source framework that can turn any web app into a native app for iPhone, BlackBerry and Android. Included in the PhoneGap distribution is everything you need to build and run an iPhone app. Building and Running an iPhone App First, open up the iPhone folder, and double-click on PhoneGap.xcodeproj: That's it!

How to test / simulate the ipa-download after PhoneGap-build and before uploading to the Appstore I didn't have to drag the provisioning file into iTunes, just the IPA in two steps (on Windows 7 64bit): 1) Before Build: Make sure your iPhone's UDID is included in the provisioning profile by defining it in your apple developer profile for the app. To obtain the UDID: In iTunes, select your device in the ‘Devices’ section and navigate to the Summary tab. 2) After build & IPA download: Go to "Apps" Tab for your iPhone in iTunes 3) Check the "Sync Apps" box to allow editing of the left pane 4) Drag & drop your downloaded IPA to the left 5) Once it's there, drag it onto one of your iPhone pages on the right 6) Click "Apply" I had to add the IPA to the left pane first and then drag it to the right, I couldn't drop it directly onto the right pane.

"Mobifying" Your HTML5 Site Introduction Developing for the mobile web is a hot topic these days. This year, for the first time ever, smart phones out sold PCs. More and more users are using a mobile device to traverse the web, which means it's becoming critical for developers to optimize their sites for the mobile browsers. The "mobile" battlefield is still uncharted waters for a large number of developers. Creating a mobile-friendly html5rocks.com As an exercise I thought it would be interesting to take html5rocks (an existing HTML5 site) and augment it with a mobile-friendly version. This article examines how we created a mobile version of html5rocks optimized for Android and iOS devices. HTML4 and CSS2 have supported media-dependent style sheets for some time. would target print devices and provide specific styling for the page content when it is printed. You can use media queries in the media attribute of your external stylesheets to target screen width, device width, orientation, etc. <head> ... - url: /(.*\.

How to Make an HTML5 iPhone App By Alex Kessinger You’ve been depressed for like a year now, I know. All the hardcore Objective-C developers have been having a hay-day writing apps for the iPhone. You might have even tried reading a tutorial or two about developing for the iPhone, but its C—or a form of it—and it’s really hard to learn. I don’t want to say that you should give up on the objective: you can get it eventually. You can create a native app that lives with all the other apps, and for the most part, it’s going to be a pitch-perfect imitation. You can do this with the skill set you probably already have: HTML(5), CSS, and JavaScript. I’ll show you how to create an offline HTML5 iPhone application. Offline? What am I talking about when I say "offline"? The app should be as functional as it can when it is offline, just like normal native mobile apps. This is a tutorial specifically for iPhones but most of these techniques apply to all phones that have HTML5-capable browsers. Prework About the App Application Cache <!

Safari Web Content Guide: Configuring the Viewport Safari on iOS displays webpages at a scale that works for most web content originally designed for the desktop. If these default settings don’t work for your webpages, it is highly recommended that you change the settings by configuring the viewport. You especially need to configure the viewport if you are designing webpages specifically for iOS. Configuring the viewport is easy—just add one line of HTML to your webpage—but understanding how viewport properties affect the presentation of your webpages on iOS is more complex. Before configuring the viewport, you need a deeper understanding of what the visible area and viewport are on iOS. If you are already familiar with the viewport on iOS, read “Using the Viewport Meta Tag” for details on the viewport tag and “Viewport Settings for Web Applications” for web application tips. Read “Layout and Metrics on iPhone and iPod touch” to learn about the available screen space for webpages on small devices.Read “What Is the Viewport?”

Creare mobile apps con Dreamweaver CS5.5 e jQuery Mobile Grazie all'ultimo aggiornamento di Dreamweaver CS5.5 oggi possiamo creare - con una relativa facilità - mobile application per sistemi iOS (iPad / iPhone) e Android (versione 2.2). In buona sostanza la stessa cosa che permettono di fare anche Flash Pro 5.5 e Flash Builder CS4.5 (i programmi Adobe per sviluppo Flash based) ma partendo dal versante opposto: HTML(5), CSS(3), JavaScript, ecc.. Grazie all'introduzione per la creazione di mobile apps, di PhoneGap (chi sviluppa applicazioni per iPhone/iPad da tempo, sicuramente avrà avuto modo di utilizzarlo), il lavoro svolto per la realizzazione delle nostre apps è molto semplificato. Come è possibile vedere dalla schermata seguente, possiamo impostare da subito il nostro progetto PhoneGap ready quando chiediamo a Dreamweaver di creare un nuovo documento Tutte ovviamente basate su jQuery solutions. Anche questo passaggio fortunatamente è a nostra portata.

A Beginner's Guide to Using the Application Cache Introduction It's becoming increasingly important for web-based applications to be accessible offline. Yes, all browsers can cache pages and resources for long periods if told to do so, but the browser can kick individual items out of the cache at any point to make room for other things. Using the cache interface gives your application three advantages: Offline browsing - users can navigate your full site when they're offline Speed - resources come straight from disk, no trip to the network. The Application Cache (or AppCache) allows a developer to specify which files the browser should cache and make available to offline users. The cache manifest file The cache manifest file is a simple text file that lists the resources the browser should cache for offline access. Referencing a manifest file To enable the application cache for an app, include the manifest attribute on the document's html tag: <html manifest="example.appcache"> ... Note: "/page-url/", "/page-url/? Updating the cache

macity: Cocos2d: disponibile la versione 1.0 del framework di sviluppo Dopo oltre tre anni, 63 versioni distribuite e oltre 2500 giochi pubblicati su App Store, è stata finalmente pubblicata la versione 1.0.0 di cocos2d, l’ottimo framework di sviluppo open source per dispositivi iOS. Nato come progetto in Python grazie a Ricardo Quesada e alcuni amici argentini, cocos2d ha visto il contributo di oltre 140 tra sviluppatori e appassionati, che si sono impegnati realizzare quello che, a oggi, è uno dei migliori strumenti per creare rapidamente giochi per iPhone e iPod Touch. Non è un caso infatti se a farne uso sono stati giochi più o meno noti, come Farmville e League of Evil. Il futuro del framework è ancora incerto, e probabilmente spetterà sempre più alla community il dovere di portarlo avanti. Lo scorso maggio i creatori di cocos2d sono infatti stati assunti da Zynga, il colosso del social gaming dietro titoli come Farmville e Cityville, allo scopo di lavorare a progetti interni all’azienda.

iPhone Compatibility Tips This article describes how you can use CSS rules and simple HTML changes to make your Web site more compatible with the Web browser in the iPhone and iPod Touch. Topics include what image formats and file formats are supported, controlling site magnification, how to create links to iPhone's built-in applications, and creating a custom Web Clip icon. iPhone Compatibility The iPhone has a built-in version of the Safari Web browser. Everything in this tip can be applied to either the iPhone or the iPod Touch. All of the information in this tip is gleaned by Apple presentations and the information on their developer Web site. Basic Compatibility The first step to ensuring compatibility of your site with iPhone is to make sure your site works great in Safari. Your site will render much the same in Safari on iPhone as it does on the desktop. PDF files can be viewed on the iPhone. What's Not Supported Page Layout Double Tap

Related: