This Week in Fiori (2015-13)

Well, another week has gone by, which means it must be time for This Week in Fiori! The Fiori juggernaut continues to rumble on, and this week was no exception. Let’s get to it!

Build Your Own SAP Fiori App in the Cloud by openSAP
This week saw the start of the new free course at openSAP, which, according to the description, is all about “building your own SAP Fiori app that’s just as delightful and user-friendly as any of the hundreds SAP has built directly”.

This is great news, especially for those of us who had signed up to the earlier course “Introduction to SAP Fiori UX” but had been rather disappointed that it had had nothing much to do with Fiori UX, and more to do with deployment and setup. I wrote about this in TWIF episode 2014-40. A number of us did have a dialogue with the openSAP folks at the time, and I’m delighted to see our comments were taken on board – this new course looks to be what we have been waiting for.

So we’re into Week 1 of this new nine week course, and already in the last unit of Week 1 — Unit 5, Introduction to SAPUI5 and OData — we’re seeing JSON and XML on the slides, HTTP headers, and even a small glimpse at the superb UI5 toolkit, including a tiny controller and an XML View definition. This is more like it! Technical details on the slides.

Don’t get too excited, however. I spotted some errors in this unit that aren’t trivial. I’ve built courses before and I know how hard it is to get things consistent, but one thing you must do is be accurate. Here are some of the things I spotted:

“OData … is using SOAP and REST to communicate between systems”
OK, so first, REST isn’t a protocol, it’s an architectural style, so it is difficult to use a style to communicate between systems. But that is sort of forgivable, in that perhaps more accurately one could say that the OData protocol has RESTful tendencies. But SOAP? No. OData has nothing to do with SOAP, in fact, one could say that the OData protocol is orthogonal to SOAP.

“One of the most important libraries we have today is sap.ui.m”
I’m guessing that’s just a typo that found its way up through the layers to the actual presentation script. Because while there are libraries with the sap.ui prefix, there is no sap.ui.m. What the instructor is referring to is sap.m. The m originally stood for “mobile”, but now stands for “main”. The sap.m library is one of the main collections of responsive controls which are used to build Fiori apps. For more info, you might want to read “M is for ‘responsive’“.

“We have a library [sap.ui.table] for table, and that provides me with the ability to create a table that is very rich in data but also responsive”
For responsive tables, you probably want to look at the sap.m.Table control, rather than the sap.ui.table library, as the former is designed from the ground up to be responsive, whereas the latter is more for desktop apps.

MVC – View <-> Model data binding
In slide 13, there’s a classic MVC style diagram, but the data binding relationship between the view and the model seems to be shown as one way only:

Screenshot 2015-03-28 at 14.12.27

One of the many features of the powerful model mechanism and the data binding therein is that you can have two way binding. So I’d have drawn that arrow pointing both ways.

XML View definition
Being a stickler for accuracy (perhaps to the point of pedantry, of which I’m proud, not apologetic :-), this XML View definition on slide 14 is not quite accurate:

Screenshot 2015-03-28 at 14.15.27

The View is within the sap.ui.core.mvc namespace, not the sap.ui.core namespace, so the root element here should reflect that, like this:

<mvc:View xmlns:mvc=”sap.ui.core.mvc” …

Router? Bueller?
So if I’m going all out, I might as well mention that one thing that I think slide 16 could have benefitted from is mention of the Router in the architecture overview diagram. I do appreciate that these slides may have come from a time before the Router concept was properly established, but the Router is an incredibly important part of any Fiori app, so it would have really helped to see it here.

Screenshot 2015-03-28 at 14.21.38

That said, now you know, you can go and find out more about it! :-)

Don’t get me wrong, I’m very excited about this course, and these issues can be ironed out now they’ve been surfaced. I’m looking forward very much to Week 2.

Fiori Breakfast Event by Brenton O’Callaghan, Lindsay Stanger and me
On Tuesdsay morning this week in London, Brenton, Lindsay and I, along with other great Bluefin folks, ran a breakfast event all about Fiori. It was a really successful gathering, with business and technical attendees from SAP customer companies who were already, or were about to, or were just interested in embarking upon their Fiori journey. We had a special guest from one of our clients too, and to be honest, she stole the show :-)

It was clear from the event that people are realising that Fiori is not only here, it’s here to stay, and it’s a journey that is not just about new apps, but about a new SAP. If you’re reading this TWIF column, you already know that. It’s a genuinely exciting time for us as customers, partners and consultants, not only because of the UX aspect, but also because the present and future that is Fiori is based upon open technology standards that are right. SAP has grasped the nettle of user experience, and embraced the right tools and technologies. Good work!

Well that was rather a longer post than usual, so in the interests of keeping this to something you can read in a coffee break, I’ll leave it here, and wish you well. Until next time!



This Week in Fiori (2015-12)

Greetings! Last week saw the return of the This Week in Fiori series, with a video from me and Brenton. More on that video shortly. Before last week, the previous episode had been in October last year. So much has happened in the Fiori world that it would be crazy to try and cover it all. Instead, over the next week or two, I’ll pick out some items that stand out.

So let’s get started with some picks for this week.

Filtering Fiori Apps by Release by Gregor Brett
In last week’s video, we looked at the Fiori Apps Library app and found that it wasn’t easy to identify the latest apps. I mentioned that while the Fiori Apps Library app itself didn’t expose the information in that way, the data was actually available, and laid down a challenge for anyone to make the app do just that.

Screen Shot 2015-03-20 at 16.03.06Just a few days later the first response appeared – Gregor Brett came up with a nice solution, which was to patch the running Fiori Apps Library app, adding a new View Settings Filter Item to the filterItems aggregation of the actual View Settings Dialog used in the app. The items within that new View Settings Filter Item were bound to a data collection that was already being exposed by the backend in the OData service, namely the Releases_EV collection, which gave information on Fiori Wave numbers and dates.

Bingo! Nice work Gregor.


The Fiori Community by the SAP Community Network
Since the last episode of TWIF last year in October, SAP have created a new community within the SAP Community Network for Fiori. There’s already a community for SAPUI5, but now there’s a specific community for Fiori. I spoke about this in my keynote at Mastering SAP Technologies last month, and it’s an interesting and important distinction that SAP are making.

If you think about it, Fiori as an umbrella term is gigantic. It could be seen as a lot of things to a lot of people. Separating out the technical underpinnings (UI5) from other aspects (Fiori application configuration, extension and maintenance, UX design, deployment and platform subjects, and more) was only going to be a matter of time, if only to make the subjects more manageable.

But also remember that future Fiori offerings from SAP may not be powered by UI5. Of course, all of the Fiori offerings now and in the near future are, including all the S/4HANA applications such as the SFIN set, but when you consider SAP’s purchases – Ariba, Concur and SuccessFactors to name but three – a unified UX strategy is not going to happen from re-engineering the whole UI/UX layer of those (previously) third party products.

Visit the new SAP Fiori community and have a look around. It looks like it’s here to stay :-)

Planning the Fiori ABAP Frontend Server (FES) – Architecture Questions by Jochen Saterdag
Getting your Fiori apps served to the frontend involves making the following things available: the OData services, the Fiori Launchpad, the Fiori app code (views, controller logic, and so on) and of course the UI5 runtime. SAP has been slowly but surely socialising the term “frontend server” to refer to a system that fulfils this role. I first heard the term from SAP Labs folks in Israel back in 2013 (see “An Amazing 36 Hours at SAP Labs Israel“), and it’s becoming more pervasive these days. In modern parlance, perhaps, it’s now properly “become a thing”.

Of course, there are always considerations when planning such a server, and Jochen does a good job with this overview blog post. He answers some important questions, including whether you should use an existing PI system as the base for such a frontend server … the answer, clearly, is “no”.

10 tips to get you started on your Fiori development journey by me
Well, what’s the point of having your own blog post series if you can’t talk about your own content now and again? ;-) As I mentioned earlier, I spoke at the great Mastering SAP Technologies Conference in Feb this year. I wrote up my keynote into two blog posts, the second of which was a “top ten” style list. I’m sure there are many of you looking to embark upon this journey, so I thought I’d put together tips on what worked for me. If you’re interested in the first of the two posts, it’s “Can I build a Fiori app? Yes you can!“.

Well that’s about it for this week. See you next time!

The Maker’s Schedule, Restraint and Flow

A few years ago Paul Graham published a short essay “Maker’s Schedule, Manager’s Schedule“. It described succinctly how, and perhaps more importantly why calendar entry driven task scheduling, and in particular meetings, cause issues for makers. And I include myself and many of my colleagues within that “makers” general collective term.

Both the manager’s schedule and the maker’s schedule are important, but resonate differently and don’t mix. When making, building, creating things, solving problems, interruptions are disastrous, for all the reasons that Paul explains.

On the other side, time management, the proper organisation of tasks and working out what work to do, and how, doesn’t come for free. Managers and makers alike need skills in these areas. In order to build these skills, each one of us needs to understand that the areas actually exist, first of all. Email, phone calls, interruptions, the almost endless todo list and prioritisation issues are all things that we need to manage. And I recognise that I need to manage those things better. I use the Pomodoro Technique on occasion, but that’s just one tool. I also need to learn restraint. I need to resist the temptation to say “yes”, and to allow myself to be interrupted. If I get it right, I will find myself in flow more often. And that’s the mode that makers – developers, in our context – work.

Since that original article on the Maker’s Schedule, I’ve come across many other great articles and videos, and I wanted to share a few of them with you here, as you may find them useful too.

Remember – saying “no”, creating situations where you’re less able to be interrupted, using task and time management techniques that work for you, that let you produce more (or less, but that’s the subject for another post), is what we *should* be doing. Don’t fall into the trap of thinking that just because your project manager thinks and works in 1 hour chunks of time, you need to do as well. Of course, real life has a habit of getting in the way, but don’t let that stop us trying to be our best.

Further viewing & reading:

Scott Hanselman: It’s Not What You Read, It’s What You Ignore

Johnny Wu: Developer Productivity – The Art Of Saying “No”

Inbox Pause (great as an idea as well as this implementation)

The Pomodoro Technique

This Week In Fiori (2015-11)

Well hello again and welcome to TWIF readers old and new alike.

Last year I started the “This Week In Fiori” (TWIF) series looking at news, events and articles in the Fiori world. The last post (2014-43) was in October 2014, written by Brenton O’Callaghan.

The Fiori world is growing and spinning even faster, and Brenton and I decided it was time to pick up where we left off. To get the ball rolling, we recorded a half-hour session at the end of this week, looking at some news in the Fiori world. This time we took a more technical flavour, remembering that Fiori is UX, but built ultimately built with UI (see “Can I Build A Fiori App? Yes You Can!” for more on Fiori UX vs UI) – there are always two sides to any single coin.

If you have any news, or any suggestions for future TWIF episode topics, just let us know!

Here’s this week’s episode. Thanks Brenton!

Share & enjoy!

Why I’m Staying Close to UI5

I recently came across an article by Greg Donaldson – “Why We Are Staying Clear of SAPUI5“. Everyone is entitled to their opinions, and I do like challenges to assumptions and the status quo, so I enjoyed the article. I thought it would be worth responding with a similar piece, albeit with a slightly different title :-)

It would be an odd situation indeed for a unified consensus on any software, let alone software in this particular context – HTML5 development toolkits and frameworks, where, if you don’t have an opinion, you’re looked upon as an outsider. So I wanted to state before I start that there is no single correct answer, or even a single toolkit to rule them all, and Greg makes some important points.

I thought I’d look at the individual points that Greg made.

“Proprietary framework, no thanks.” 

As a lot of folks already know, UI5 is far from proprietary. It is written and maintained by web developers that work for an enterprise software behemoth, but the key difference is that UI5 has been open sourced, as well as using many open source libraries itself. In the article there’s the contrast made between “proprietary” and “industry standard” as though they’re opposites. This is not the case. So I’m not sure whether the criticism being levelled at UI5 is about its proprietary nature (which is not the case) or about (not) being an industry standard. This latter point is debatable: A toolkit powering frontend software across the entire ERP landscape for SAP customers feels like a de facto industry standard to me. Yes, not every company has adopted Fiori, but for one that drives its business on SAP products, UI5 is a likely software component.

I’m curious about the “SAP quirks” phrase which is also mentioned in this point. I’m not sure which quirks are being referred to, but if industrial strength design, MVC, internationalisation, automatic support for RTL languages, client and server side model support and an accomplished data binding system are SAP quirks, then yes please!

Further, AngularJS is mentioned as a framework with a huge community behind it. From what I can see, that community is fracturing, due to the major upheaval in (re)design between the 1.x and 2.x versions. That’s not to say that this couldn’t happen to UI5, but it’s actually happening right now with that framework.

“SAP Backend Upgrade?”

To do UI5-based apps “properly”, or “the SAP way”, then this is true; if you don’t already have a Gateway system in your ABAP stack landscape, then you’ll need one and also the UI2 add-in with which the UI5 runtime is supplied.

In my experience, however, it’s increasingly less common for an enterprise to not have a Gateway system somewhere; and with NetWeaver 7.40 you get the components built in as standard anyway. Further, installing Gateway components is often a coffee time activity.

But not wanting to over-trivialise this important original point, I wanted to point out the alternative; an alternative that is the most likely scenario anyway for a non-UI5 deployment such as AngularJS: a separate web server. You can just as easily host and serve your UI5 based applications, along with the UI5 runtime, from a web server of your choice. Then accessing the backend becomes the same task as if you’d chosen a different (non-UI5) framework.

And on the subject of accessing the backend, the point that was made about “remote enabled functions” does intrigue me. One of the advantages of UI5 is that it supports OData, an open standard, by the way, and one of the advantages of OData in turn is that it is a server-side model.

Calling remote function modules in this day and age is certainly possible and sometimes the only choice, but you’re not going to take advantage of server-side heavy lifting when it comes to data integration with your frontend. I’ve built Web-based apps with SAP remote function calls since the 90s, so I have the scars :-) Not only that, but the data abstraction model presented by the RFC approach is somewhat orthogonal to modern web based app data mechanisms.

“Browser Support”

This is of course always an interesting issue, but as an individual developer, and as a member of a development team, I prefer a solid statement about a well defined set of modern browsers which are supported by the toolkit I use, rather than have to do that job myself and deal with the vagaries that present themselves on a daily basis. Of course, rolling your own gives more flexibility, but it’s often more work.

And at least for the clients that I work at, the fact that (a) the browser choice is usually somewhat controlled anyway, and (b) the fact that in the BYOD context people even choose (choose!) to bring Windows phones, which are supported by UI5, underlines that choice for me.

“Frontend Developers Don’t Care”

At the risk of appearing obtuse, I’m going to absolutely disagree with this statement :-) Frontend developers *do* care; they care about the quality of the software they work with, about how and whether the toolkit they use does the job without getting in the way. Of course, this caring, this obsessive compulsion to be using the right framework and doing the right thing may mean that for some developers the choice is something other than UI5.

And that would be fine. There is no one piece of software that fits all requirements or circumstances, in any context. In the past I have used jQueryUI, JQTouch, AngularJS and other frameworks. And I would never rule them out for future projects. But right now, I’m investing time and effort in UI5, because it’s open source, it’s enterprise ready, it’s been designed & built and is maintained by committed, passionate designers and developers just like you and me (well, a lot more competent than me) and it is also fully in tune with SAP’s technology directions.

Skills in UI5 are going to be useful not only for building out the current and next generation of proper outside-in apps, but also for supporting the deployments, customisations and extensions for Fiori. A nice side effect at which one should not sniff.


Speaking at Mastering SAP Technologies

Next week I’m travelling to Johannesburg, to attend and speak at the Mastering SAP Technologies conference. It’s a great honour to have been invited, and I’m excited at the prospect of the topics covered in the agenda.

I’m continuing my journey spreading the word about Fiori and UI5. Last November I was in Sydney giving a locknote, a workshop and speaking at an executive lunch, at the SAP Architect & Developer Summit. A couple of weeks ago it was a short trip to Brussels to speak about OpenUI5 at FOSDEM, and now at Mastering SAP I have three slots. Here’s the description of each of them.

Keynote: Can I Build a Fiori App? Yes You Can!

Fiori is not just the new UX-focused, role-based application paradigm from SAP, it’s also a set of technical constraints coupled with a rich but finite set of design patterns for UI. Most importantly it’s made possible by certain parts of the SAPUI5 toolkit that were specifically built with Fiori in mind. (In fact, the first customers of the sap.m library in SAPUI5 were the SAP Fiori developers themselves). This session tells you what you need to know to build a Fiori app.

Tips & Tricks from the Trenches of a Fiori/UI5 Developer

Developing Fiori and UI5 apps with the UI5 toolkit is different than what you’re used to. Different generally because it’s HTML5 based, and different specifically because it’s UI5. Learn the tips and tricks that I use on a daily basis, and get to know how to drive, modify and extend Fiori/UI5 apps from the command line console of Chrome’s developer tools. Master UI5 debugging and maintenance from within the browser and get a step ahead.

Workshop: Building an SAP Fiori-like App From (Almost) Scratch – Hands On!

Starting from a skeleton app that has a structure but minimal content, and an OData or JSON data source, we build together a working Fiori app with SAPUI5. We cover bootstrapping the SAPUI5 toolkit, the Component-based approach to development, Model-View-Controller based development, XML views, navigation, data binding, model operations and more. This is similar to the Open Source Convention (OSCON) hands-on session I co-presented in Portland, June 2014, and the CD168 hands-on sessions I co-built & co-presented at SAP TechEd in 2013 (which were sold out / overbooked many times).

Perhaps I’ll see some of you there. In any case, share & enjoy!

Fiori & UI5 Related Videos

I thought it would be worth collecting together a lightly annotated list of Fiori and UI5 public videos that I’ve published on my YouTube channel. (I say public, as there are quite a few OpenUI5 related videos still marked as private, waiting in the wings … watch this space!)


Fiori Apps Reference Data into a Spreadsheet 09 Jan 2015
Pulling the Apps info from the OData service used by the SAP Fiori Apps Library app into a Google spreadsheet. More info here: Fiori App Data into a Spreadsheet? Challenge Accepted!


YAML Model for UI5 20 Dec 2014
I scratched an itch and built a simple YAML Model implementation for UI5. More info here:

Creation & Reload of UI5 UIs in the Chrome Developer Console 24 Nov 2014
Following my workshop session at the SAP Architect & Developer Summit, this screencast shows the creation of a quick UI, using the manual Chrome Developer Console techniques we learned, and the subsequent export and reload as XML. (I recorded this at Sydney airport on the way back from the summit).

SAP Fiori Rapid Prototyping: SAP Web IDE and Google Docs 05 Nov 2014
With the power of the SAP Web IDE and its plugin / template architecture, we can create custom templates that allow you to create Fiori apps based on all sorts of data sources, in this case, a Google Spreadsheet.

SAP Web IDE Local Install – Up and Running (3-video playlist) 27 Oct 2014
SAP made available its Web IDE as a locally installable service in Oct 2014. This short series of videos shows you how to get up and running with it.

SAP Fiori & UI5 Chat, Fri 17 Oct 2014 17 Oct 2014
Brenton O’Callaghan and I have a 30 min chat about SAP Fiori and the new, unofficial SAP Fiori App that gives information about the available SAP Fiori Apps.

UI5 Icon Finder 14 Sep 2014
A very quick screencast of an “Icon Finder” app that remembers your own word associations you make, so you can more easily find the icons next time. See Scratching an itch – UI5 Icon Finder for more info.

OpenUI5 MultiComboBox First Look 25 Jul 2014
A first look at the sap.m.MultiComboBox in OpenUI5 version 1.22. Note that the addition of a key for the root element is not entirely necessary (but probably what you might want). I wrote more about this here Keyed vs Non-Keyed Root JSON Elements & UI5 Binding.

The SAP Fiori App Analysis application 30 Jun 2014
A short overview of the SAP Fiori App Analysis app, written itself as a Fiori style app. In this overview I show the source for the information (the SAP help documentation), mention how I convert the gathered spreadsheet data into a more easily consumable form, and explore the app a little bit too.

DSON (Doge Serialized Object Notation) Model mechanism for UI5. So model, wow! 06 Jun 2014
A bit of fun for a Friday late afternoon, and it helped me to play about with extending existing client models in the sap.ui.model library set.

Manipulating UI5 Controls from the Chrome Dev Console 17 May 2014
Just a quick screencast to show how easy it can be to find, grab, manipulate and create controls in a UI5 application from the Chrome Developer Console.

Simple Workflow App with UI5 13 Apr 2014
This is a quick screencast of the app I wrote for the basis of my chapter in the SAP Press book Practical Workflow 3rd Edition.

Coding UI5 in JSBin 11 Apr 2014
A quick recap of what we did during the UI5 Mentor Monday in March 2014, showing how easy it is to construct good looking UIs with UI5, and also the great facilities of JSBin – creating, viewing and sharing HTML CSS and JavaScript snippets with live rendering.

Mocking Up the Payroll Control Center Fiori App 14 Feb 2014
There was a blog post on the Payroll Control Center Fiori app and I decided to mock the UI up directly. This video shows me doing that.

#UI5 Control on the Screen, Quick 12 Feb 2014
There was a conversation about how fast you could get a UI5 control on the screen. I decided to try to see how fast it could be.

Using Gists on Github to share code 09 Jan 2014
This screencast relates to a document on SCN “Help Us To Help You – Share Your Code” that describes how and why you should share your code that you want help with, using Gists on Github.


SublimeUI5 – Snippets & Templates for SAPUI5/OpenUI5 19 Dec 2013
SublimeUI5 is a package for Sublime Text 2 for developing SAPUI5 / OpenUI5 applications. There are two parts to it – a series of snippets and some basic application templates to help you quickly get started with complete MVC-based running apps. (I don’t maintain this package any more but you’re welcome to take it over!).

SAPUI5/Fiori – Exploration of an App 22 Nov 2013
An exploration of a custom Fiori app and the SAPUI5 controls that are used to build it. For the full context of this, see the 2-part SAP CodeTalk – SAPUI5 and Fiori playlist.

SAP Fiori-style UI with SAPUI5 06 Nov 2013
This was a short video to show the sort of thing that attendees of our SAP TechEd 2013 Session CD168 “Building SAP Fiori-like UIs with SAPUI5” would be building.


Re-presenting my site with SAPUI5 13 Dec 2012
A short demo of an experiment I carried out to explore SAPUI5 and learn more about it. I really like the Shell component as a user interface paradigm and decided to see if I could re-present the content of my home page and weblog using SAPUI5 and specifically the Shell. It seemed to work out OK.

Stupid Firebase and SAPUI5 tricks 14 Apr 2012
Saturday evening hacking around with Firebase, the command line, and an SAPUI5 Data Table. Fairly pointless but interesting nonetheless. Firebase uses websockets for realtime data streaming to your browser-based app, and you can interact with the JSON data with HTTP. Every piece of data has a URL. Now that’s nice.

SAPUI5 and OData 12 Feb 2012
I looked at the data binding support for OData based data sources (such as those exposed by SAP NetWeaver Gateway!) in the (then relatively) new SAPUI5 toolkit. I also wrote this up on SCN: “SAPUI5 says “Hello OData” to NetWeaver Gateway“.

Morning Fiori Fix

John Moy tweeted today about the Fiori App Reference Library showing duplicate entries recently. It’s something I’d noticed too, after checking the app following the publication of information on SCN about new Fiori apps on the post “New Fiori Apps for HCM” last week.

I’m not 100%, so earlier this morning I needed a bit more time than usual to get my brain in gear. So with a coffee I decided to spend a few mins hacking the list display. It’s not a permanent solution of course, but at least demonstrates that there are properties in the Apps entity that can be used to distinguish the “duplicate” entries. Should be a quick fix (yes, pun intended!) for the Fiori Implementation eXperience folks to carry out.

Here’s a quick screencast as an animated GIF (why not?)


Right, on with the morning.

OpenUI5 at FOSDEM 2015

I just returned from FOSDEM, the conference for free and open source software developers that’s held annually in Brussels. It’s a super event that has a long pedigree already, and has managed to remain true to the hacker culture and spirit that pervades the open source world. Innovation, scrutiny, sharing and collaboration are the bywords of this culture.

I have attended FOSDEM a number of times over the years; in the early days in my capacity as a Jabber / XMPP programmer, and these days more generally, but this time it was specifically about OpenUI5.

IMG_20150202_080814SAP’s open sourced UI development toolkit for HTML5 is SAPUI5’s twin with an Apache 2.0 licence. SAPUI5 is the basis for SAP’s UI innovation and with what SAP Fiori apps are built. Although still relatively young, it’s a very accomplished toolkit, and one I was eager to share with the open source developer community at large.

I spoke on the subject of OpenUI5 in this talk:

A Whirlwind Introduction to OpenUI5

and it was very well received; the room was packed and there was some great feedback. It wasn’t difficult talking about a product from such a great team, although to add extra spice, I’d decided not to use any slides, and instead, do some live coding on stage.

IMG_20150202_080838I had deliberately set myself up for a fall, showing how difficult it can be to built hierarchies of controls in JavaScript, which then set the scene for my favoured approach of defining views declaratively, with XML being my favourite flavour in that vein. Luckily the audience seemed to appreciate the in-joke, and not everyone thought I was an idiot :-)


I’ve made the source code of the app I built on stage available on Github, in the fosdem-2015-openui5 repository.

The SAP folks had an OpenUI5 booth at FOSDEM too which was staffed by a few of the real UI5 developers, so the conference attendees were able to learn first hand about the toolkit from the source. The booth saw a nice increase in traffic after my talk, which is a great sign.

SAP has had a presence at many conferences in the past few years, but this one resonates particularly with me, as some folks might think that the SAP and open source worlds are far apart. How wrong they are. Onwards!

Picture credits: Denise Nepraunig, Jan Penninkhof, Martin Gillet – thanks!

Atom, Snippets, Tabs and CSON parsing

This morning on the train down from Manchester to Bristol I fired up the Atom editor and noticed that when trying to load a snippets file from my ui5-snippets package, I got an error:

Screen Shot 2015-01-19 at 08.18.19

Between Stafford and Wolverhampton I hacked around with the source, particularly the html.cson file that contained a number of UI5 snippets for HTML files. From where was this error message emanating, and why now?

Well, it seems that a few days ago, in release 0.171.0, Atom had moved from parsing CoffeeScript Object Notation (CSON) with cson, to parsing with cson-safe. CSON is the format in which snippets can be written. Moving to cson-safe meant that the parser was rather stricter and was the source of the “Syntax error on line 4, column 11: Unexpected token” error.

By the time we’d got to Birmingham, I’d figured out what it was: tabs. In wanting to move in the direction of the UI5 coding standards, I’d started moved to tabs for indentation within the UI5 snippets, as you can see in this openui5 starter snippet. While the original cson parser used by Atom was fine with real tabs in the snippet source file, cson-safe didn’t like them.

Switching the tabs to literal “\t” tab representations (i.e. backslash then ‘t’) solved the issue.