Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Similar to PhoneGap Enterprise Viewer
Similar to PhoneGap Enterprise Viewer (20)
Recently uploaded
Recently uploaded (20)
PhoneGap Enterprise Viewer
- 1. PhoneGap Enterprise Viewer Anthony Rumsey | @planetrumsey Adobe Systems
- 3. AEM Apps 3 Mobile Apps Made Easy! +
- 5. Developer Adobe Experience Manager Marketer SCM • How do I preview my app on a device? • How do I preview content changes before they are published? PhoneGap CLI QE ? The Problem
- 6. PhoneGap Developer App Removes the headache of code-signing and compiling Develop locally then see the changes instantly on your mobile device No need to re-sign, re-compile, or reinstall your app to test your code Access to the device APIs that aren't available in web browsers app.phonegap.com
- 7. PhoneGap Enterprise is… Removes the headache of code-signing and compiling View the entire app as it would appear on an actual device Test interaction with many device APIs that aren't available in web browsers Instantly view all of your organization’s apps (under development and staged) View app details and screenshots Validate staged updates before publishing enterprise.phonegap.com
- 8. PhoneGap Enterprise is not… A replacement for final on device testing of compiled app Capable of receiving push notifications Able to test mobile services Able to configure plugins from config Able to support all PhoneGap plugins
- 9. Plugins Battery Status Camera Console Contacts Device Dialogs File / File Transfer Geolocation In App Browser Media / Media Capture Splashscreen Status Bar Vibration Whitelist Native Page Transitions https://github.com/phonegap/phonegap-plugin-contentsync
- 10. Setting Up PhoneGap Enterprise • Navigate to system console • http://myauthor:4502/system/console/configMgr • Locate Apache Sling Referrer Filter configuration • Enable: Allow empty referrer • Connect to your AEM instance • Provide login credentials • That’s it!
- 11. 11
- 12. Demo
- 13. Sneaks
- 15. Sneak: Offline • Download and store multiple apps • Optionally over WiFi only • Use stored app when possible • Always when no network • When server isn’t more recent • Choose which apps to store • Delete stored apps
- 16. Demo
Editor's Notes
- Hi there, my name is Anthony and I am a developer on the AEM Apps team based out of beautiful Ottawa, Canada.
- What I would like to do today is introduce you to a tool that will become your secret weapon in simplifying the development of hybrid apps built with Adobe Experience Manager. This secret weapon I speak of is the PhoneGap Enterprise viewer. Well, OK, maybe it isn’t so secret since PhoneGap Enterprise is already available to be downloaded but hopefully today I will let you in on some secrets on how to use utilize this tool along with a few sneaks of some upcoming features as well. Before I get ahead of myself let me step back and provide some context on how we got here.
- As we heard briefly yesterday from John, Adobe Experience Manager offers a mobile application development platform called AEM Apps. Part of this platform includes the ability to manage PhoneGap apps as well as making content creation for these apps much easier. While Adobe Experience Manager is already a leader in web content management, the recent integration of PhoneGap has also made mobile app creation for non-developers easy! AEM Apps builds on a proven open source foundation for developing hybrid mobile apps that leverages existing authoring tools for web content in AEM. AEM Apps also offers… A customizable dashboard for managing each of your apps Over-the-air content updates Mobile services integration PhoneGap build integration
- Successful developers need to be able to be adaptable and embrace change. Mobile development is no different especially since it is still experiencing rapid change. It should be in a developers best interest then to seek out and adapt to new processes while replacing old ones.
- The development of mobile apps easily offers up a number of problems that can be encountered when using traditional desktop and web techniques. How do I preview my app on an actual device as it is being developed? How do I preview content changes before they are published? How do I allow an expanding list of stakeholders to also be able to easily view the app? With AEM Apps this would traditionally require a developer to put aside time to download the source of an app and build an instance of the app which could then possibly be distributed for testing via something like HockeyApp or TestFlight once all the desired devices had been properly provisioned. While these techniques are still valid there should also be a better way to obtain feedback faster and sooner as well as reducing the amount of test builds that would need to be performed.
- One option available to improve the development workflow of PhoneGap apps is the PhoneGap Developer app. The PhoneGap Developer App is a great tool for testing PhoneGap and Cordova apps quickly with no platform SDK setup required on your machine. You just download the PhoneGap App from the app store, run a PhoneGap CLI command from your machine to serve up the application you want to test on any iOS, Android or Win Phone device and sync to it from the app running on the device. It also includes live reloading so you can see any changes to your app immediately reflected on your device while running it. This tool could also be used with an AEM App by first downloading and unpacking the source locally before running the phonegap cli command. Since our apps are already being managed by AEM there must be an even better way that this process can be improved and simplified.
- Which brings us back to the cousin of the PhoneGap Developer app, PhoneGap Enterprise. Much like the PhoneGap developer app PhoneGap enterprise removes the headache of code-signing and compiling and provides access to the device APIs that aren't available in web browsers. Since the apps are being managed by AEM however, PhoneGap Enterprise is able to provide much more.
- While PhoneGap Enterprise does offer a lot of capabilities for improving mobile app development processes there are a few items it is not intended for.
- Speaking of plugins… It is PhoneGap plugins that allow web content to access device and platform functionality. Plugins are integral to any successful hybrid app. The PhoneGap Enterprise app itself is a hybrid app built on PhoneGap. Amongst others, PhoneGap Enterprise makes extensive use of the open sourced phonegap content sync plugin. This plugin was developed at Adobe with the specific PhoneGap Enterprise viewer use case in mind but is also used by the PhoneGap developer app and even AEM Apps. In addition to the content sync plugin, PhoneGap Enterprise includes the core Cordova plugins plus a selection of curated third-party plugins that are all available to apps that it launches.
- I know by now you must be pretty excited to try out all the awesome features offered by the PhoneGap Enterprise viewer but before you run out the door there are a few set up tasks that must be done to your AEM author instance first. Specifically, the Sling Referrer Filter needs to be set to allow empty referrers in order to allow PhoneGap Enterprise to authenticate successfully. Actually, now that we’ve successfully configured our AEM author instance let’s have a look at what that authentication sequence looks like.
- Demo App list Staging vs. development App details/metadata Change metadata (icon, title, description) Refresh Add a new page (sponsors) Change page (sponsors button, text) Refresh Open app view changes Exit app Stage app Refresh Open app Change session details Stage update Perform OTA in app
- Demo - Quit app Shutdown AEM Launch app Open previously downloaded app