Essentially, these are some of my slides from a TechEd presentation last week (MOB205). My position with this presentation is to depict the overall process I use when developing an app, a few of the *many* considerations to make, as well as the simplicity of using a product like Gateway to actually connect and “consume” ERP/CRM/Back office data in a few lines of code.
| Slides |
|---|
 |
| Why Mobile?Needs no introduction, mobile was one of the hottest topics at TechEd this year, if it had a “girly” name or acronym like “HANA” … I am convinced it would have been “the” hottest topic 🙂 Why Gateway?The mobile landscape is fairly complex right now, lot sof vendors, lots of choices and not particularly easy to navigate. One this is for sure, services are here to stay – particularly REST based web services and that is exactly what Gateway is built for.Another great product: XS Data Services for HANA …. |
 |
| So this is the app being designed during the presentation. Essentially my goal was to develop a “template” type app which the attendees could download and use as a starting point for their mobile app development and encourage them to get their feet wet. |
| The app makes 2 service calls. 1 to pull a list of customers from SAP ERP, once selecting a customer, the app would download the additional details of the customer including the address. And lastly – the “idea” … anyone wanting to customize the app could pull additional data in, a good example would be: An Accounts Receivable Clerk who attends a weekly open payables meeting, may want to take their iPad, get a list of customers, select one in question and see all open payables which are relevant … easy to do with this type of structure and simple to implement.Another example was a Business Development road warrior who could select a customer, and see a list of Open Quotes.Your app … here is some starter type code and you decide … |
| I skipped a couple of the slides related to the Gateway platform … this included this slide/blog post I added a couple of weeks ago:http://scn.sap.com/community/netweaver-gateway/blog/2012/10/02/what-sap-netweaver-gateway-is-not |
 |
| During the presentation I also reminded folks that mobile apps can be powered by a variety of data providers, including a method we (Lithium labs) did a couple years ago which was actually using SAP.Net Connector (v2.0) to create a ASP.NET Web Service (XML) which was called from the mobile device which worked and is still in production today. |
 |
| In this app, all the components are distributed. The Netweaver Gateway instance in the cloud at AWS (Thanks John!) and connected to a ERP backend which is in Walldorf (ES Workplace). The app talks to the AWS GW machine which pulls the data from the ERP and gives it back to the iPad via a REST web call. |
 |
| Now that we have covered the platform, we will go through the prerequisites for developing the iPad app. We will cover the development machine types, software need and useful tools. |
 |
| A mac development machine is recommended, when I started out 3 years ago, I tied to put together a hackintosh … didnt work, first update and it bombed… waste of time. A used mac mini off craigslist goes for +- $300 … worth the investment. |
 |
| This is an overview of the developer accounts – most important point was that with the free account you cannot run your app on a physical device … (boo). Pay the $99 if you are getting started and if you develop something your company wants to deploy on a larger scale … i.e. > 10 devices, pony up to the Enterprise Program.Click here for additional details:https://developer.apple.com/programs/start/ios |
 |
| Development options.I am a native kind of guy … |
 |
| Useful tools include a solid graphics editor … I estimate that I spent +- 50% of my time when developing an app from start to finish with graphics and the UI. If you have access to a graphic or UI designer … USE THEM 🙂 RESTClient for Firefox has saved me multiple hours … a quick and easy way to test your services before development. |
 |
| In this case the 5 steps simply outline the general direction needed to take a app from conception to production. |
 |
| From a requirements point of view and as mentioned in the introduction, the app was built to provide a framework for the participants and encourage them to “Extend” it. |
 |
| When starting the app it makes an initial service call from BAPI_CUSTOMER_GETLIST, selecting one of the records will make a second call usig BAPI_CUSTOMER_GETDETAIL and populate the detail page. |
 |
| Another suggestion I made was to proof out the data access portion first, not necessarily build from the bottom up, but rather ensure that all data fields which are required are accessible. I have spent countless hours developing front end apps, with a “wishlist” of datasets which were not feasible when I started modelling the data services and had to reconsider many points. |
| Checkpoint |
 |
| So next up from a design perspective and as mentioned above, we walked through the data exposure piece, essentially using SE80 to take your BAPI and create a web service. From SP04 – this should be done in SEGW, not SE80. |
 |
| Once the service has been created and exposed, RESTClient for firefox is a great tool for testing the service before even touching any code. This to me is part of the “data access” test I do before design. |
 |
| Executing our service in this case produced the results showing a list of the customer details. |
| Checkpoint |
 |
| Data has been exposed and seems to be working. Next up design the app UI. |
 |
 |
 |
| As mentioned, a point people found interesting in the presentation was that I spent on average 50% of my time in a graphics editing program like photoshop, designing icons, UI elements, etc. IMO – UI is the difference between a good app, and a great app. The iPad/iPhone graph paper is very handy and you can print or even buy your own from this site: http://sneakpeekit.com/pad-sketchsheets/ |
 |
| I also suggested that open source software should be considered when developing mobile apps, in our case the app will be using 2 packages to make life simpler, JSONKit and AFNetworking. Cocoacontrols.com is a great website for discovering open source code. |
| Checkpoint |
 |
| At this stage the data source created, the UI designed and its time to do some coding in XCode. I will be going into more detail behind these steps in an upcoming blog series called “S2F”. |
 |
| Start with a master – detail template (from XCode). Add your UI elements comprising of labels and buttons. |
 |
| Create a 20 line method for fetching data from your gateway service and displaying it on the screen. Very quick and simple. Obviously *good* programming takes considerably more time, but as a POC and starting point, this is perfect. |
| Checkpoint |
 |
| Data, design and code done, next up some testing and deployment options. |
 |
| We did a quick test and spoke about the deployment options. If you are a partner and would like to certify your app, work needs to be done to package your content using the AAK toolkit and developing in your own namespace.Also keep in mind that with a apple enterprise license:“An app will not run if the distribution certificate has expired. Currently, distribution certificates are valid for one year. A few weeks before your certificate expires, request a new distribution certificate from the iOS Dev Center, use it create create new distribution provisioning profiles, and then recompile and distribute the updated apps to your users.” |
 |
| Wrapping things up, we can see that with only a few lines of code you can easily (and without any additional tools) can connect and consume data from Netweaver Gateway. Also keep in mind that if you would like to cache that data in a local sqlite db, it really only takes a few more lines to make data available offline. (differential control when writing data is a WHOLE nother story!) |
At the end a couple of the questions included:
I see you are passing the username and password in the URL? Yes, in this example that was the case to display the simplicity. Pratically you would want to definitively use SSL, pass your params in the header of the HTTP request and also possible hash/encrypt these variables.
You must be logged in to post a comment.