I think UI5 has far more better look and feel . Many advantages in terms of User interface.

Application is written in
javascript, which is highly in demand in web application programming.
SAP UI5 is an open source which supports technologies such as OpenAJAX, LESS, ARIA etc.
The layout of the app is prepared with the use of HTML5 and CSS3, which provides flexible
solutions dedicated to many devices and screen resolutions
. Support of jQuery means SAPUI5 has no constraints concerning the
development of animations and effects
Open source libraries delivered by SAP allow developers to extend
existing UI controls (dialogue windows, charts, tables, buttons, combo-boxes,
data pickers, accordions) as well as to create new ones from scratch. To edit
UI controls a developer can use the ECLIPSE editor
The SAPUI5 technology supports the MVC (modelviewcontroller)
architecture pattern, which enables every programmer get well-structured and
understandable code
The prepared SAPUI5 application can be stored directly on a built-in SAP
web server or on open source platforms like Apache and Tomcat. It also runs on
various platforms such as SAP NetWeaver AS ABAP/Java, Sybase (SAP Unwired
Platform) and SAP Hana XS
SAPUI5 can work with the newest version of Sybase Unwired Platform
Communication between a SAPUI5 app and the
SAP system is done through secure oData services - the newest standard prepared
by Microsoft. OData is proven secure technology which is currently used by
Facebook, eBay, Netflix and Stack Overflow.
SAPUI5 helps to increase your security
thanks to its cross-domain policy and indirect connection to the SAP server
through SAP NetWeawer Gateway, OData and the latest SUP (Sybase Unwired
Platform)
SAPUI5 enables the combination of multiple data sources such as oData services,
databases and external systems, as well as the data from multiple SAP systems,
all in one app
BY connection do you mean getting data from ABAP systems and populate it in UI ?

If yes, then you can introduce Gateway system in middle of ABAP and frontend. You have to connect
abap and gateway system with trusted RFC and create one gateway service which will get the data from
backend system,

Once you have the service, you can create a UI5 application and consume this service to populate data
in the UI.

Here are Some Important SAPUI5 interview questions, which could help you clear an
interview
What is required to start UI5 development in eclipse?
In the help menu in Eclipse, click Install New Software, paste one the URL according to the
version of the Eclipse.
 https://tools.hana.ondemand.com/lunafor Eclipse Luna (4.4)
https://tools.hana.ondemand.com/kepler for Eclipse Kepler (4.3)
just import SAP UI5 toolkit from hana service marketplace. Also we need SAP
UI5 ABAP Repository connector to deploy project in ABAP System.
Which control libraries are used for UI5 application development?
sap.ui.commons, sap.ui.table and sap.suite.ui libraries for desktop application
development and sap.m library along with sap.ui.layout for Fiori application
development.
How Navigation works in SAPUI5.
Sap uses two mechanisms, routing and EventBus. Routing Is specifically used
for bookmarking the URL. We define routing in component.js within the
metadata. It also defines the navigation path and hash changer which is used
at the runtime to change the url of the particular screen.
What is Component?
It is the first point of the application, it serves as an index, which encapsulates all the
application details, like view names, routing details, main view, applications
type(Full Screen or SplitApp), application service configuration etc.
There are 2 types of compponents,
Faceless components: Mainly without UIs, Used for business logic and helper
methods e.g. Formatters.
UI Component: typically component.js file which is made by extending
sap.ui.core.UI Component class.

What is Responsive Web Design?

A web application which gives same look and feel to the user in desktops and mobile devices.

What is the syntax to define a control in UI5?

var obj_name = new sap.m.ControlName(id of control,{ properties, events,
aggregations });

What is formatter in SAPUI5 and how to use it?

We need to use formatter when we need to perform some changes on the back end property
data on the front end.
we can use formatter while data binding to a property like as follows:
oControl = new sap.ui.commons.TextField({
value : {path : /path, formatter : function(oEvent){
return Value:+oEvent;
}}});

How many types of views are available in SAPUI5?

There are 4 types of views available:
1. JS view
2. JSON view
3. XML view
4. HTML view
How many types of data model are available in SAPUI5?
SAPUI5 has following predefined four data models available:
1. JSON Model Client-side model, supports two way binding.
2. XML Model Client-side model and intended for small data sets this is very
rarely used model.
3. Resource Model This is also client side model used to
maintain resource bundles, specially texts.
4. ODATA Model This is most important model of the four provided.

What all events/life cycle are available in SAPUI5s views controller?

There are 4 lifecycle available in SAPUI5s views controller, they are:
onInit() it is called when a view is instantiated and its controls have already
been created.
onExit() it is called when the view is destroyed, used to free resources and
finalize activities.
onAfterRendering() - when the view has been rendered and, therefore, its
HTML is part of the document.
onBeforeRendering() -It is called before the controller view is re-rendered and
not before the first rendering.
What is the main difference between OData Model and JSON Model?
The JSON model is a client-side model and, therefore, intended for small datasets, which are
completely available on the client.The OData model is a server-side model: the dataset is only
available on the server and the client only knows the currently visible rows and fields.
What is SAPUI5 Bootstrapping?
SAPUI5 Bootstrapping means loading and initializing SAPUI5 in any HTML page. Themes and
Libraries are defined in this.
In how many ways you can bind data to your controls?
We can bind data to any controls using three methods, Property, Element and
Aggregation binding.
What are SAPUI5 Fragments?
Fragments are very light weight UI controls. Fragments are not completely like views but they
act like a view. Fragments are defined similar like views and are names like
Fragment.fragment.xml.
Does Fragment have its own controller?
Fragments are created without controllers, they dont have their own controllers they share
controller of the view which is invoking it.
What is Metadata Annotations?
The service metadata document describes the structure of all resources in the service. This
structural metadata makes it easy to understand a service. We can explore service metadata at
the address $metadata relative to the service root.
 What are common Metadata Annotations?
Following are some of the service metadata annotations which are common and a front end
developer must know these in order to understand the service and integrate it:
-edm:EntityContainer
-edm:EntitySet
-edm:EntityType
-edm:Property
-edm:NavigationProperty
-edm:AssociationSet
What is SAP Fiori?
SAPUI5 is client side HTML5 rendering framework or library and SAP FIORI is collection of and
released as waves of applications which are completely based on SAPUI5 framework. It means
we can create applications using SAPUI5 framework and SAP FIORI is final product i.e.
application. In SAPUI5 we have to code from scratch, but in Fiori Application the custom
application is already built and enhancements can be done on those custom apps.
How many types of fiori applications are there?
There are 3 types of fiori applications:
Transactional
Analytical
Fact Sheets
What is the difference between SAP Fiori and SAPUI5?
SAP FIORI is collection of standard applications based on SAPUI5 library provided by SAP. SAP
FIORI applications share some standard design guidelines and way in which these application
are developed.
What is FIORI Launchpad and Explain it?
It is a home page for all the FIORI applications provided to. There are more than five
hundred custom app provided by SAP. This shows tile based UI where every UI
redirects to assigned FIORI application. This Launchpad is fully customizable
according to your needs like theming and all.
How can you get the web browser of the client on which SAP Fiori
application is running?
SAPUI5 library provides a special API sap.ui.Devicewhich can be used to for device
and its feature detection. This API provides flags like chrome, firefox, mozilla,
edge etc. in sap.ui.Device.browser API which returns boolean values.
What are Fiori Design Principles?
There are 5 design principles we need to keep in mind while designing SAP Fiori
applications.
Role Based
Delightful
Simple
Responsive
Coherent

Part B
1) Which open standards and tools are the foundation of SAPUI5 technology?

D3.js for visualization

ARIA for accessibility standards and keyboard handling

jQuery for managing DOM elements and abstracting browser differences

2) What SAPUI5 control metadata is used to configure the UI elements at runtime?

Associations

Properties

Aggregations

3) What are view types offered by SAPUI5?

JavaScript views

JSON views

XML views

4) What is the purpose of a controller?

To separate the UI and the processing logic

To control the application flow by handling user events or updating the view

5) Name some standard controller hooks in SAPUI5?

onInit an event that is called when the view and the controller are instantiated

onExit an event that is called when the view and the controller are destroyed

6) What does MVC stand for?

Model - View Controller
7) What information can be stored in the manifest.json file of your app?
Root view

Supported device types

Supported themes
8) Which of the following namespaces can be used in the manifest.json file?
sap.ui5

sap.app

sap.ui

9) What is the name of the file where the descriptor for applications, components, and libraries is
stored?
Manifest.json

10) For what stands the abbreviation JSON?

Java Script Object Notation

11) Which data binding mode means a binding from the model to the view and from the view to
the model (value changes in the model and in the view update all corresponding bindings and
the view and model, respectively)?
Two-way

12) How would you add an icon from the SAPUI5 icon font to a button in an XML view?
<Button text="Save Draft" icon="sap-icon://save" />

13) Which predefined sizes for margins that stand for 8px (0.5rem), 16px (1rem), 32px (2rem),
or 48px (3rem) are available in SAPUI5?
'Tiny', 'Small', 'Medium' or 'Large'
14) What is aggregation binding used for?
To bind a set of data entities to a list-like structure

15) Your JSONModel contains the following content:

{

"Employees" : [{

"Lastname" : "Karlson",

"Firstname" : "Karl"

}]

}
 What is the binding path to Karl Karlson's first name?
/Employees/0/Firstname

16) What do you need if you want to bind a list to data in your JSONModel?
An array with the data in the JSONModel that you want to bind to the list

A template list item to be cloned

A bound list control

17) How can you access validation errors in SAPUI5?

Set handleValidation to true in the manifest.json file.

Register to the validationError event on sap.ui.getCore().

18)Name some types in SAPUI5?

sap.ui.model.type.Float

sap.ui.model.type.DateTime

sap.ui.model.type.Currency

19) What coding do you need to add to your XML view to enable grouping in your list binding?
group: true

20) Which of the following sequences of steps do you use to assemble the URL to access your
OData service's metadata?
Run your app from SAP Web IDE and copy its URL into a new browser tab.
In your app's manifest.json file, go to services, copy the URI, and use it to replace the file path
in the URL from Step 1.
Append /$metadata and press enter.
21) How many filters can you apply on a list binding?
As many as needed

22) What is the best practice for showing or hiding an SAPUI5 control at runtime?
Set the visible property of the control to true or false.

23) When do you use element binding?

When you want bindings of child controls to resolve their paths relative to the binding of the
parent

24) What is the difference between aggregation binding and element binding?
Aggregation binding is used for list-like structures, whereas element binding can be used to set
the binding context of any parent control.

25) How is paging accomplished in oData query?

Paging can be accomplished by using $skip in combination with $top. The parameters values
describe the interval of the data that is requested.

26) Name some OData query parameters?

$skip

$count

$expand

Part C

27) How do you enable the debugging option for SAP NetWeaver OData services?
Use the URL parameter sap-ds-debug=true.

28) What do you have to consider when choosing the SAPUI5 version for the application
template?
The SAPUI5 version must be available in your target deployment system.

29) How many complete columns (that include the header) will this table display on a phone?
<Table>
<columns>
<Column
demandPopin="false"
minScreenWidth="Tablet">
...
</Column>
<Column
demandPopin="true
minScreenWidth="Tablet">
...
</Column>
<Column
demandPopin="false"
minScreenWidth="Phone">
...
</Column>
<Column
demandPopin="true"
 minScreenWidth="Phone">
...
</Column>
<columns>
...
</Table>
2

30) What happens when you set the minScreenWidth property of a sap.m.Column to Tablet?
The column is shown only on screens that are larger or equal than the size of a tablet.

31) What are semantic colors in sapui5?

They are representations of states such as success, warning, and error.

32) Name some semantic states in SAPUI5?

Positive

Negative

Critical

33) How can you compose filters in SAPUI5?

By creating multiple filters and concatenating them either with AND or OR

By creating a single sap.ui.model.Filter object and specifying a path, an operator, and up to two
values

34) Where are filters applied in SAPUI5?

To an aggregation binding

35) Which filter operation can you use to filter items with a numeric value lower than X?
sap.ui.model.FilterOperator.LT

36) What can you do to enable your SAPUI5 application to adapt to the users device?
As many controls are responsive out of the box, check whether you have to do anything at all.

Set the compact density on devices without touch support.

37) What can a device model be used for?

To check whether a device supports touch interaction

To influence the user interface without coding, based on the characteristics of the device
38) What information is provided by the sap.ui.Device API?
The device type (phone/tablet)

Whether the device has touch support

The browser name and version

39) Which control adapts its appearance on touch devices?

The PullToRefresh control: It is represented as a simple button on non-touch devices, but the
user needs to pull the page content down on touch devices to refresh it.

40) Why is it useful to have fragments in your app?

To create reusable UI parts without a designated controller or other behavior code

41) What happens in the DOM tree when nesting XML views?
Each XML view creates its own DOM element regardless of the nesting level.

42) What can you do to structure your application code better?

Use subdirectories for related views and controllers.

Use fragments to define reused UI parts only once.

Put the functionality used in multiple controllers into a base controller and extend this controller in
the other controllers in your app.

43) What are fragments primarily used for?

To make parts of your view reusable

44) What are Dialogs in SAPUI5?

They are rendered into a specific area (the static area) in the DOM.

They need to be added to the dependent aggregation of the view to get access to the models.

45) What happens when you instantiate a dialog from a single-rooted fragment?
The dialog instance is returned when you invoke the fragment factory.
The dialog is instantiated but not displayed.

46) Which property of the routing configuration in the manifest.json file should you use to
automatically display a target that is not found?
Bypassed
47) How many targets can you configure within a route in the manifest.json file?
As many as you like

48) What is the correct sequence of called functions / handled callbacks of the OData model in
the Add controller?
on metadataLoaded - createEntry - submit - on success

49) What is the recommended place to configure a "TwoWay" binding for the OData model so
that data changes in the view are written back to the model?
In the "models" section of the manifest.json file

50) How are unit tests for your app started in SAP Web IDE?
By selecting the run configuration Run Unit Tests

By right-clicking the unitTests.qunit.html file and selecting an option from the Run menu

51) How do you register a unit test in QUnit?

Call QUnit.test() in your test code with a speaking test description and a callback that contains at
least one assertion.

52) Which testing features are provided by the SAP Fiori Worklist application template?
A test suite that calls all your unit and integration tests

Clear separation of test and production code

Unit test setup (QUnit) and basic test coverage

53) Which options are available in SAPUI5 if you want to create a custom control?

Extend an existing control with your own features.

Create a composite control that reuses existing controls internally.

Extend the sap.ui.core.Control base class and build a new control.

54) Which of the following are part of the control metadata?

Aggregations

Properties

Events
55) What do you have to consider when defining control metadata?
You can give an aggregation either one or many values by defining the multiplicity as one or
many.
You can make an aggregation invisible in the control API by setting the visibility to hidden.