A beginner’s guide to skilling up for SAP Fiori and UI5
New to UI5 and Fiori? You’ve come to the right place!
This year has been a tough one for me having to “get with the times” to evolve my technical skillset beyond the ABAP world. Luckily there’s plenty of freely available information and courses to help you make the jump. Don’t wait for someone to send you on training – make time to skill yourself up!
Learning web technology skills
Once you’ve understood the mechanics of these languages, I would recommend building a personal website to showcase your skills to potential employers. Maybe a website resume about yourself?
Know how to use browser debuggers
If you’ve spent a lot of time using SAP’s great ABAP debugger, you’ll want to familiarise yourself with the wonderful web debuggers available. I have a slight preference to Google Chrome dev tools however it doesn’t hurt to explore one of the following if your workplace has multiple browsers:
- Google Chrome Dev Tools (press F12 in Chrome)
- Firebug for Firefox
- Safari Developer Tools
- Internet Explorer F12 Developer Tools
I can’t live without my browser debugger!
Understand how RESTful APIs work
If you’re not familiar with the basics of RESTful API’s, this page has a good overview and tutorial.
Get hands on with OData
- OData is a type of RESTful protocol and the main page has some great information worth reading too.
- I would recommend getting hands on with OData by downloading the Postman extension and installing in Google Chrome
- Once you have Postman you can do the basic OData tutorial.
- Once you’re done with this I would then look to SCN for some guides on how to build these in your SAP Netweaver Gateway system.
Learn about git, github, gists and jsbin
- Git is a great open source code repository that all SAP developers should put on their “to learn” lists.
- Codeschool has some great free interactive courses you can get hands on with.
If you get really good at UI5, feel free to contribute back to the community and share your examples on Github or jsbin. DJ Adams has a great article about github and gists – Help Us To Help You – Share Your Code. There’s also discussion in the commentsabout how it compares with jsbin. Either way – sharing is caring. 🙂
A hands on course you can learn about github is Mastering Github by codeschool.
Learn about SAP Fiori and UI5
The following SAP courses are great and will bring you up to speed quickly on various topics around Fiori, UI5, WebIDE, infrastructure, application design and business engagement:
- Introduction to SAP Fiori UX
- Introduction to Mobile Solution Development
- Build Your Own SAP Fiori App in the Cloud
- Creating Business Value with User Experience
Read “Get Started” in the UI5 Developer Toolkit
Throughout my UI5 journey, there’s been a number of times where the UI5 Developer Toolkit has answered my questions before doing a google search. If you’re new I would go through the “Get Started” section and build an app from scratch. You’ll find you will start referring to different sections as you go along and whilst it’s alien first time around, it will all eventually make sense if you persist.
Learn about wireframe mockups with Axure
- Take note Axure is not free. However if you have some time to put aside to learn this tool, download the trial version and complete the free tutorial provided.
- SAP have Fiori specifc design stencils for Axure as well – check it out!
- If you want something a bit simpler you can use long term, I also recommend the SAP Fiori Prototyping kit (Components).
References I can’t live without
Once you’re building your confidence with UI5, I would bookmark the following pages and keep them handy for reference!
- Fiori Design Guidelines – My bible for best practise on how to design UI5 applications. I’m not a trained designer and the experts who built this page have years of research behind these guidelines. Great resources for building great UI5 applications.
- Experience SAP – SAP’s user experience community website, a great place to educate yourself about good design.
- Fiori Application Library – Great website to reference technical setup and see what Fiori apps are available to your customer.
- Fiori Demo – Great website to quickly understand demonstrate sample Fiori applications.
- UI5 Developer Toolkit – The bible for UI5 development. Gets better every time I visit it!
Have fun learning and if you have some great resources to share please feel free to add to the comments below.