Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
Former Member


Hey All,

    Having been an active user in the UI5 community since a year i have analyzed a bit on where developers go wrong when trying to learn UI5. So i just thought of blogging out my personal views on how to approach it & maybe the way how i learnt it.

Me primarily being a front-end dev, i was interested to explore much of what's happening rather than just the bits & pieces of the development. So for anyone looking to be a PRO, i would recommend some of these

1. Start with a simple text editor. Ex - Notepad++, sublime text.

Well, it is known that SAP offers awesome development tools like SAP web ide, Plugins for Eclipse & there are also other third party tools. But as a beginner when we start using these i believe we don't get the underneath basic knowledge on how the complete app works. We start coding directly in the views using the templates offered by SAP. These come handy for development but when you really want to learn i would recommend to use an editor like notepad++/sublime text where you'll have to completely code the entire app from the scratch. I too started my learning as a beginner using the Eclipse plugins but when i switched to Sublime text where i had to code completely i realized how much i actually knew UI5.


2. Learn to use the API reference & don't copy the code from UI5 demokit

  With UI5, there a lot of options where the readymade code is available. You’ll find the code for all the controls in UI5 Demokit. I was blindly doing the same but i had no idea what other options the controls offered apart from the one provided in the sample code. That's when i came to know that you have an API reference in the UI5 demokit which has documented all the properties, aggregations, methods, events of the controls. Since i learnt how to code a single control by following the API reference, i was able to do the same for all the other controls and more importantly i knew what all the controls offered now.


http://img.picturequotes.com/2/2/1378/you-were-born-an-original-dont-die-a-copy-quote-1.jpg

3. Knowing how to Debug is a must!

  More often when we run the code it ends up with some issues. Posting the code in SCN/getting help from colleagues immediately we face an issue is not going to really help in a longer run. Actually browsers say chrome have inbuilt debugging tools which we will have to use it to the best to debug the issue. In fact, it's really simple once you learn how to setup a breakpoint & how to check the requests in the network log to get a pointer on most of the issues. The debugging skills helps us solving the issues by ourselves, but when that doesn't help creating a discussion in SCN/stackoverflow is good to go.


If you find some time, go through the video on debugging UI5 Apps  - Debugging UI5 Applications - YouTube   by UI5 developers tobias.oetzel & cahit.guerguec

http://www.ibmsystemsmag.com/getattachment/c247b44e-07b3-4ca9-9724-d913fb9dc3c2/

4. Start with js views &  5. Learn JavaScript as much as you can

  Often there leads to a confusion on which view to use in the development. Though XML views are the one being recommended, for any beginner i would suggest js views. The intention is to make sure that we start writing as much as code in JavaScript as JavaScript is something to be learnt to learn UI5! Being comfortable with JavaScript is indeed required here. Migrating from JS view to XML view is not really a tougher one. (just Ctrl + Alt + Shift + S)

  For anyone whose career is into web development JavaScript plays a vital role, be it front-end/back-end. So here learning JavaScript is directly proportional to learning UI5. I would recommend to go through blogs/docs on JavaScript. I got a better insights by reading the design patterns in JavaScript by Addyosmani & also on object oriented JavaScript.


One of the better places to learn JavaScript would be Mozilla developer Network, https://developer.mozilla.org/en-US/docs/Web/JavaScript


http://www.keepcalmstudio.com/_gallery/300/O2tJXT.png

6. Try to solve questions in SCN

    Trying to solve the questions is SCN has remarkably made me improvise my skills. It's like 'The more you solve, the better you become'! And more than that it gives me a confidence that I’ll be able to tackle most of the issues if i face.


http://www.barbiedecker.com/wp-content/uploads/2014/11/Problems-solving.jpg

   

7. Look out the source code of UI5

    The source code of UI5 is something where we get to see the code written by some of the most intellectual guys. It might look a bit mystery out there in the beginning, but going forward you'll be able to take away few good things  from the code & thats how one becomes a PRO at it.

http://d1lwft0f0qzya1.cloudfront.net/dims4/COKE/43f697d/2147483647/thumbnail/596x334/quality/75/?url=http%3A%2F%2Fassets.coca-colacompany.com%2F5a%2F02%2Febc1d0f842468408be5de9740884%2Fcoding1-604.jpg

I would suggest these for the one who wants to have a career with UI5 or front-end technologies in a longer run. It might take a bit of time but it'll prove to be worthy & at least have worked out for me.  I would also like to know the views of UI5 experts out here on how they approached :smile:


Last do make sure you keep aligned with all the latest updates - OpenUI5 Blog

- Sakthivel

42 Comments