Recomendados
Más contenido relacionado
La actualidad más candente
La actualidad más candente (19)
Destacado
Destacado (7)
Similar a PhoneGap 101 & Toura Mulberry
Similar a PhoneGap 101 & Toura Mulberry (20)
Último
Último (20)
PhoneGap 101 & Toura Mulberry
- 1. PhoneGap 101 or: how I learned to stop writing platform-specific code and love JavaScript, HTML and CSS @MattRogish (mrogish@toura.com) and @touradev / @touramobile
- 2. Matt Rogish
- 4. To APP or not to APP...
- 27. “The purpose of PhoneGap is for PhoneGap to cease to exist” - Brian LeRoux, Nitobi (now Adobe)
- 28. “The purpose of PhoneGap is for PhoneGap to cease to exist”
- 30. The purpose of <Other Mobile Platform> is for <Other Mobile Platform> to cease to exist?
- 36. PhoneGap is an HTML5 app platform that allows you to author native applications with web technologies and get access to APIs and app stores. PhoneGap leverages web technologies developers already know best... HTML and JavaScript. - PhoneGap.com
- 37. Huh?
- 45. Yeah, but can I make real apps with it?
- 46. SQLite DOM Key-Value File System HTTP
- 49. vasc ri pt
- 50. Okay, okay. How do I get started?
- 51. 1. Download & Install PhoneGap & Pre- requisites 2. Write HelloWorld.html 3. ??? 4. Profit!
- 52. “???” explained... or: getting from zero to app in 60 seconds
- 53. Mulberry takes the promise of PhoneGap — mobile apps built with web technologies — and smooths over many of the “gotchas” that front-end developers confront as they venture into client-side application development in a mobile environment. - http://toura.github.com/mulberry/
- 54. Huh?
- 58. Thank you! Any Questions? • http://www.phonegap.com • http://groups.google.com/group/phonegap • http://www.meetup.com/The-New-York- Phone-Gap-Devlopers-Enthusiasts-Meetup/ • http://mulberry.toura.com • http://api.toura.com/weinre • http://www.twitter.com/touradev
Notas del editor
- \n
- Hi, I&#x2019;m Matt. I work at Toura, etc.\n
- Toura has a bunch of products and stuff we do\n
- Before we get into PhoneGap proper, there&#x2019;s still some debate as to whether or not we should do mobile apps at all\n
- A lot of folks think they are stupid, dying, proprietary, etc. etc.\n
- That they lead to fragmentation of code\n
- And that you should just write HTML apps (or HTML5, depending on your target audience)\n
- This is the future they predict\n
- I think the reports of mobile app&#x2019;s deaths are greatly exaggerated \n
- What&#x2019;s the difference between these devices\n
- and this one?\n
- LOTS of native functionality outside of the browser sandbox. Functionality that has no desktop browser analog.\n
- AND native functionality that differs on a per-platform basis. Stuff that mobile web can&#x2019;t yet touch.\n
- To access this stuff on a computer (where applicable) you needed to use Flash\n
- But flash is dead on mobile\n
- Or, you could write native code\n
- Something \n
- tells\n
- me\n
- we&#x2019;re looking at it the wrong way\n
- Let&#x2019;s think about this. We need to access native features across multiple disparate platforms\n
- So, we want a mix - HTML5 and Javascript to write apps in ways that are cross-platform in a language we know and love\nand native code to access things that aren&#x2019;t (YET) exposed in the browser\n
- Happy\n
- That&#x2019;s PhoneGap! It allows you to mix HTML, JS, and native code all in a nice tidy package\n
- Nitobi was purchased by Adobe. PhoneGap is open source, and now being accepted into the Apache Foundation; you cannot &#x201C;own&#x201D; open source software.\n
- But, you may ask - why would I choose PhoneGap over any of the other platforms? Consider PhoneGap&#x2019;s philosophy\n
- \n
- PhoneGap (and Nitobi, the folks just acquired by Adobe) want the web to win. PhoneGap is a temporary fix until HTML5/JS exposes ALL of the stuff in a unified, standardized way\n
- Don&#x2019;t hold your breath waiting for that to happen anytime soon, however. It&#x2019;s taken years for the W3C to suggest standards, and some vendors aren&#x2019;t implementing it all the same. It&#x2019;ll be a while until all the native functionality is exposed in pure Javascript.\n
- Do the other cross-platform mobile application frameworks exist so they&#x2019;ll be obsolete? Or does it exist to further lock you in to their technology stack? When the magical day occurs when the W3C and Device Manufacturers all have full Javascript interoperability occurs, will you be able to easily port your apps to it? To mobile web? Hmm. Ponder that.\n
- What about the Appcelerator folks? They are decidedly NOT open source. They compile their own JS to native components. So it&#x2019;s not even really cross platform. If the rapture occurs and you can remove phonegap, you can&#x2019;t simply take your Appcelerator app and make it a mobile web app.\n\nRhoMobile is somewhat similar. Now that they are owned by Motorola Solutions, unsure as to the future of the product. But that&#x2019;s a bit of FUD from me. Take it with a grain of salt. :)\n\nstrobe is dead, acquired by facebook.\n\nSenchaTouch is NOT free software. It has a commercial software license that, although is free as in &#x201C;Free beer&#x201D; is not free as in &#x201C;Free speech&#x201D;. \n
- What about the Appcelerator folks? They are decidedly NOT open source. They compile their own JS to native components. So it&#x2019;s not even really cross platform. If the rapture occurs and you can remove phonegap, you can&#x2019;t simply take your Appcelerator app and make it a mobile web app.\n\nRhoMobile is somewhat similar. Now that they are owned by Motorola Solutions, unsure as to the future of the product. But that&#x2019;s a bit of FUD from me. Take it with a grain of salt. :)\n\nstrobe is dead, acquired by facebook.\n\nSenchaTouch is NOT free software. It has a commercial software license that, although is free as in &#x201C;Free beer&#x201D; is not free as in &#x201C;Free speech&#x201D;. \n
- What about the Appcelerator folks? They are decidedly NOT open source. They compile their own JS to native components. So it&#x2019;s not even really cross platform. If the rapture occurs and you can remove phonegap, you can&#x2019;t simply take your Appcelerator app and make it a mobile web app.\n\nRhoMobile is somewhat similar. Now that they are owned by Motorola Solutions, unsure as to the future of the product. But that&#x2019;s a bit of FUD from me. Take it with a grain of salt. :)\n\nstrobe is dead, acquired by facebook.\n\nSenchaTouch is NOT free software. It has a commercial software license that, although is free as in &#x201C;Free beer&#x201D; is not free as in &#x201C;Free speech&#x201D;. \n
- So, anyway, on to the good stuff.\n
- \n
- Show, don&#x2019;t tell.\n
- It&#x2019;s simply a www directory, with all your static web content. And by static I mean &#x201C;No server required&#x201D; - aka what we used to make in Dreamweaver back in the late 90s/early 2000s. But this aint no Web1.0 stuff - this is full on webkit-y goodness.\n
- PhoneGap opens a browser, full screen and without all the chrome - and navigates to your index.html\n
- As you can see, this is all HTML, CSS, Javascript. You can open it in your local browser and do development. You just have to be careful to not call hardware-specific things when not on a device, which is easy to test.\n
- PhoneGap is an interface between YOUR Javascript and the native code. It&#x2019;s a bridge that allows you to call native (and thus hardware) code from a standard, consistent Javascript API. You&#x2019;re also not limited to PhoneGap native code, you can easily write code that extends their API for your own doings (like analytics, augmented reality, etc.). The downside, of course, is you&#x2019;d need to write it for every platform in every language. D&#x2019;oh!\n
- PhoneGap has broad support for many hardware specific capabilities - Windows Mobile 7.5 (mango) is quasi-supported by PhoneGap but isn&#x2019;t officially on the list yet.\n
- There&#x2019;s also a vibrant plugin community that offers native code components for different platforms. All licensed MIT/BSD - aka do what you want with it.\n
- There&#x2019;s also PhoneGap build. An automated service to take your project file (the www directory we saw earlier) and turn that into a compiled binary for iOS, Android, etc.\n
- So - yeah, vibrating the device is fine and all, but what about interactivity and data collection? How do I persist my stuff so when the app opens again, it&#x2019;s not brand new?\n
- PhoneGap, via webkit, supports <each>. The cool thing about HTTP is that since your app is running in a privileged sandbox via file:// you can do XHR to *any domain*. That&#x2019;s something you can&#x2019;t do on a normal web site; you&#x2019;d need your server to process xhrs, or you&#x2019;d have to use JSON-P or some other hax\n
- You can definitely make apps that look and feel native. MOST native apps aren&#x2019;t super graphically intense things that require lots of native code.\n
- But even JS is getting 3d-accelerated graphics. \n
- I think a lot of people still view JS as a toy language. It isn&#x2019;t. As a ruby developer, I&#x2019;ve pulled a lot of cool things from JS, and I&#x2019;ve brought a lot of ruby stuff to JS.\n
- \n
- First, you need to have the pre-requisites. For iOS, that&#x2019;s Xcode and a Mac. For Android, that&#x2019;s the Android SDK (Unix and Windows). For WinMo, a Windows PC/VM and the right .NET stuff. etc.\n\nYou can quickly download and install PhoneGap from PhoneGap.com\n\nWrite a HelloWorld HTML file, press compile, and voila!\n
- But it&#x2019;s a lot harder than that. You have to build single-page javascript applications. You need to interface with server APIs if you want to do anything interesting. You need to know about WebKit and CSS3 on different devices, and all that stuff. We&#x2019;ve done all that, and we&#x2019;ve released it open source.\n
- \n
- \n
- \n
- We also have a remote debugging service. sometimes you encounter bugs when on the device. Usually not in the JS code, but in the way different devices handle CSS rendering (Android v. iOS, etc.)\n
- A product called Weinre allows you to debug on a live, running app! We have a hosted service at api.toura.com/weinre that works out of the box with our apps\n
- \n