tl;dr – the Github repo “w3u3_redonebasic” is a simple re-write of one of the open.sap.com mobile course sample SAPUI5 apps to fix some fundamental issues.

In the current open.sap.com course Introduction to Mobile Solution Development there are a number of SAPUI5 based example apps that are used to illustrate various concepts and provide learning and exercise materials. Unfortunately, these apps don’t particularly show good techniques; in fact I’d go so far as to say that some of the approaches used are simply not appropriate:

  • they ignore fundamental SAPUI5 mechanisms such as automatic module loading
  • libraries are included that aren’t necessary and may cause issues
  • OData and JSON models are confused and abused

I would class these as “must-change”. There is an urgency of scale at work here as much as anything else; there are over 28,000 registered participants on this course, and it would make me happy to think that there’s a way to get them back on the right path, SAPUI5-wise.

There are of course other aspects that are less “incorrect” with the app but neverthless perhaps better done a different way. I would class these as “nice-to-have”. Examples are:

  • views are built in JavaScript instead of declaratively in XML*
  • general app organisation could be improved; there is an Application.js-based ‘best practice’ approach in the publically available documentation but this has not been followed (there is also a Component-based approach*)

*both these things will become more important over time, starting very soon!

So I’ve picked a first app – the “MyFirstEnterpriseReadyWebApp” in Week 3 Unit 3 (W3U3) – and re-written it. I have addressed the “must-change” aspects, but left (for now) the “nice-to-have” aspects.

I stuck to the following principles:

  • not to deviate from the general architectural approach too much (i.e. remain with MVC and have the same views and progression through them)
  • not to introduce any new functionality or styling (save for moving from sap_mvi to sap_bluecrystal)
  • to keep the app code and structure feel as close to the original as possible

These principles are so that any course participant who has already looked at the original app will feel at home and be able to more easily recognise the improvements.

I’ve pushed my new “Redone, Basic” version of the W3U3 app to Github so the code is available for everyone to study and try out, but also over the course of the next few posts I’ll highlight some of the changes and describe the differences and the fixes, and the reasons why. Until then, have a look at the repo “w3u3_redonebasic” and see what you think.

Here are the follow on posts (links inserted here as I write them) dealing with the detail of the rewrite:

Mobile Dev Course W3U3 Rewrite – Index and Structure

Mobile Dev Course W3U3 Rewrite – App and Login

Mobile Dev Course W3U3 Rewrite – ProductList, ProductDetail and SupplierDetail

Mobile Dev Course W3U3 Rewrite – XML Views – An Intro

Mobile Dev Course W3U3 Rewrite – XML Views – An Analysis

Share & enjoy

dj

To report this post you need to login first.

10 Comments

You must be Logged on to comment or reply to a post.

  1. Jason Scott

    This is great dj, well done. I also noted that the JavaScript samples in the HANA course were not to a standard to show students and we’re not even close to passing a basic run through a code linter.

    Would love to see you carry on here with the nice-to-haves.   😉

    –Jason.

    (0) 
  2. Craig Haworth

    Thank you, this is really great.

    A very neat clean revision of the code.

    I have done my best to point all the students to this page.

    Regards

    Craig

    (0) 
    1. DJ Adams Post author

      You’re welcome, Craig. Many hands make light work, etc. I have enjoyed the course very much, I don’t want you to get the wrong impression! 🙂

      (0) 
  3. Steven De Saeger

    Thx DJ for clearing this up… and excellent series 🙂

    I am on the same course and was a bit surprised by some of the approaches chosen to develop SAPUI5 applications …

    I followed both openSAP courses and would advise anyone to do so but some of the showed coding practises need to be looked at …

    Steven

    (0) 
    1. DJ Adams Post author

      Thanks Steven

      I’m wondering whether it’s worth linking the course material to these posts here on SCN too.

      Perhaps we need more material first …

      cheers

      dj    

      (0) 
  4. b28 guest

    Thx very much! Yeah I think the original app brought a lot of “confusion” and was not really best practice. There was actually no “good example” to learn from! Your “Fiori like apps in 10 exercises” is also brilliant – ooooooh I am dreaming of an SAPUI5/OpenUI5 MOOC openSAP course from you…justsaying 😉

    (0) 
  5. Joseph Reed

    Hi DJ

    Great blog.  I new to SAPUI5, JAVA, and SMP.  But I just thinking of the art of possible for the future of UI5 mobile apps.  I read once that a major goal was to write oncce and run everywhere to avoid the app hell of supporting different OS devices.

    How do you see enriching the SAPUI5 mobile experience ?  Is the responsive UI due have any of the Kapsel like features?  Would it be possible to say take a picture, use the mic, push notifications, geo-location or such with out using the SMP to embed the Kapsel features into the SAPUI5 application.  I thought the goal was to create device agnostic mobile apps with UI5 but if they are just browser based version of the desktop web pages then there are many mobile features lacking,  Any thougths on ways to get these features into UI5?

    (0) 

Leave a Reply